@asaleh37/ui-base 1.2.25 → 1.2.27

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@asaleh37/ui-base",
-  "version": "1.2.25",
+  "version": "1.2.27",
   "description": "",
   "license": "ISC",
   "author": "Ahmed Saleh Mohamed",

package/rollup.config-1748377725725.cjs

@@ -1,16 +1,16 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-var resolve = require('@rollup/plugin-node-resolve');
-var commonjs = require('@rollup/plugin-commonjs');
-var typescript = require('@rollup/plugin-typescript');
-var dts = require('rollup-plugin-dts');
-var terser = require('@rollup/plugin-terser');
-var json = require('@rollup/plugin-json');
-var peerDepsExternal = require('rollup-plugin-peer-deps-external');
-var postcss = require('rollup-plugin-postcss');
-
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var resolve = require('@rollup/plugin-node-resolve');
+var commonjs = require('@rollup/plugin-commonjs');
+var typescript = require('@rollup/plugin-typescript');
+var dts = require('rollup-plugin-dts');
+var terser = require('@rollup/plugin-terser');
+var json = require('@rollup/plugin-json');
+var peerDepsExternal = require('rollup-plugin-peer-deps-external');
+var postcss = require('rollup-plugin-postcss');
+
 const packageJson = require("./package.json");
 
 var rollup_config = [
@@ -45,6 +45,6 @@ var rollup_config = [
     plugins: [dts.default()],
     external: [/\.css$/],
   },
-];
-
-exports.default = rollup_config;
+];
+
+exports.default = rollup_config;

package/src/components/administration/dev/MailNotificationQueueGrid.tsx

@@ -2,12 +2,14 @@ import { useState } from "react";
 import TemplateGrid from "../../templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid";
 import { FormElementProps } from "../../templates/DataEntryTemplates/DataEntryTypes";
 import { useTranslation } from "react-i18next";
-import { useApiActions } from "../../../hooks";
+import { useApiActions, useAxios, useConfirmationWindow } from "../../../hooks";
 import { useSelector } from "react-redux";
 
 const MailNotificationQueueGrid: React.FC = () => {
   const { t } = useTranslation();
   const [data, setData] = useState([]);
+  const { handlePostRequest } = useAxios();
+
   const apiActions = useApiActions({
     findAll: "api/v1/dev/mailnotificationqueue/all",
     deleteById: "api/v1/dev/mailnotificationqueue",
@@ -19,6 +21,19 @@ const MailNotificationQueueGrid: React.FC = () => {
     (state: any) => state.commonStores.stores.SystemMailTemplates.data
   );
 
+  const resendMail = async (id: any) => {
+    await handlePostRequest({
+      endPointURI: "api/v1/public/mailNotification/resend",
+      showMask: true,
+      parameters: {
+        mailNotificationQueueId: id,
+      },
+      successCallBkFn: (response: any) => {
+        apiActions.reloadData();
+      },
+    });
+  };
+
   const formElements: Array<FormElementProps> = [
     {
       type: "field",
@@ -201,6 +216,17 @@ const MailNotificationQueueGrid: React.FC = () => {
       setData={setData}
       editMode={{ editMode: "none" }}
       formElements={formElements}
+      rowActions={[
+        {
+          actionFn: async (data) => {
+            resendMail(data.id);
+          },
+          label: "Resend",
+          icon: "repeat",
+          confirmationMessage: "Are you sure you want to resend this email ?",
+          isConfirmationRequired: true,
+        },
+      ]}
       keyColumnName={"id"}
       gridTitle={t("MAIL_NOTIFICATION_QUEUE_PLURAL")}
       girdIcon="table-cells"

package/src/components/administration/dev/MailTemplateGrid.tsx

@@ -14,6 +14,9 @@ const MailTemplateGrid: React.FC = () => {
   const SystemDataQueries = useSelector(
     (state: any) => state.commonStores.stores.SystemDataQueries.data
   );
+  const SystemTimeIntervals = useSelector(
+    (state: any) => state.commonStores.stores.SystemTimeIntervals.data
+  );
   const [selectedRecord, setSelectedRecord] = useState<any>(null);
   const {
     Window: MailRecipentsWindow,
@@ -246,14 +249,7 @@ const MailTemplateGrid: React.FC = () => {
             props: {
               fieldLabel: "MAIL_TEMPLATE_PERIOD_TYPE",
               fieldName: "periodType",
-              options: [
-                { value: "Year" },
-                { value: "Month" },
-                { value: "Day" },
-                { value: "Hour" },
-                { value: "Minute" },
-                { value: "Second" },
-              ],
+              options: SystemTimeIntervals,
               optionDisplayField: "value",
               optionValueField: "value",
               required: false,

package/src/components/templates/DataEntryTemplates/TemplateDataGrid/TemplateGrid.tsx

@@ -93,16 +93,22 @@ const TemplateGrid: React.FC<TemplateGridProps> = (props) => {
       width: "fit-content",
       height: "fit-content",
       minHeight: 500,
-      minWidth: 400,
+      minWidth: "50%",
+      onCloseCallBack: () => {
+        props?.apiActions?.reloadData(props.gridLoadParametersValues);
+      },
     });
   const { Window: WorkFlowWindow, setWindowState: setWorkFlowWindowState } =
     useWindow({
-      windowTitle: t(props.gridTitle) + " Attachments",
-      windowIcon: "paperclip",
+      windowTitle: t(props.gridTitle) + " Approvals",
+      windowIcon: "stamp",
       width: "fit-content",
       height: "fit-content",
       minHeight: 500,
-      minWidth: 400,
+      minWidth: "80%",
+      onCloseCallBack: () => {
+        props?.apiActions?.reloadData(props.gridLoadParametersValues);
+      },
     });
   const [generatedColumns, setGeneratedColumns] = useState<
     Array<TemplateGridColDef>
@@ -632,7 +638,11 @@ const TemplateGrid: React.FC<TemplateGridProps> = (props) => {
         />
       );
     }
-    if (props?.rowActions) {
+    if (
+      record[props?.keyColumnName || "id"] &&
+      record[props?.keyColumnName || "id"] > 0 &&
+      props?.rowActions
+    ) {
       for (const rowAction of props.rowActions) {
         if (
           !(
@@ -917,11 +927,13 @@ const TemplateGrid: React.FC<TemplateGridProps> = (props) => {
             workFlowDocumentCode={props.workFlowDocumentCode}
             refDocumentId={selectedRecord[props?.keyColumnName || "id"]}
             postActionCallBk={() => {
+              debugger;
               setWorkFlowWindowState(false);
               props.apiActions.reloadData(props.gridLoadParametersValues);
             }}
             cancelActionCallBk={() => {
               setWorkFlowWindowState(false);
+              props.apiActions.reloadData(props.gridLoadParametersValues);
             }}
           />
         </WorkFlowWindow>
@@ -950,6 +962,11 @@ const TemplateGrid: React.FC<TemplateGridProps> = (props) => {
         columns={adjustedColumns}
         checkboxSelection
         editMode="row"
+        onRowEditStop={(params, event) => {
+          if (params.reason === "rowFocusOut") {
+            event.defaultMuiPrevented = true;
+          }
+        }}
         rowModesModel={
           props.editMode.editMode == "row" ? rowModesModel : undefined
         }

package/src/components/templates/attachment/AttachmentCard.tsx

@@ -6,7 +6,7 @@ import Button from "@mui/material/Button";
 import Typography from "@mui/material/Typography";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { IconButton, Tooltip } from "@mui/material";
-import { useAxios, useConfirmationWindow } from "../../../hooks";
+import { useAxios, useConfirmationWindow, useSession } from "../../../hooks";
 import AttachmentImageViewer from "./AttachmentImageViewer";
 
 export type attachment = {
@@ -19,12 +19,18 @@ export type attachment = {
   docType: string;
   fileName: string;
   refKey: string;
+  allowDelete?: boolean;
+  downloadAuthorityKey?: string;
   remark: string;
 };
 
 const AttachmentCard: React.FC<attachment> = (props) => {
   const { handleGetRequest, handleDeleteRequest } = useAxios();
-
+  const { isUserAuthorized } = useSession();
+  let allowDownload = true;
+  if (props?.downloadAuthorityKey) {
+    allowDownload = isUserAuthorized(props.downloadAuthorityKey);
+  }
   const handleDelete = async () => {
     await handleDeleteRequest({
       endPointURI: "api/v1/attachment/archive",
@@ -101,22 +107,31 @@ const AttachmentCard: React.FC<attachment> = (props) => {
           </Typography>
         </CardContent>
         <CardActions>
-          <IconButton
-            size="small"
-            onClick={() => {
-              setOpen(true);
-            }}
-          >
-            <Tooltip title="Delete Attachment">
-              <FontAwesomeIcon icon="trash" />
-            </Tooltip>
-          </IconButton>
+          {props?.allowDelete ? (
+            <IconButton
+              size="small"
+              onClick={() => {
+                setOpen(true);
+              }}
+            >
+              <Tooltip title="Delete Attachment">
+                <FontAwesomeIcon icon="trash" />
+              </Tooltip>
+            </IconButton>
+          ) : (
+            <></>
+          )}
+
           <div style={{ flex: 1 }}></div>
-          <IconButton size="small" onClick={handleDownload}>
-            <Tooltip title="Download Attachment">
-              <FontAwesomeIcon icon="download" />
-            </Tooltip>
-          </IconButton>
+          {allowDownload ? (
+            <IconButton size="small" onClick={handleDownload}>
+              <Tooltip title="Download Attachment">
+                <FontAwesomeIcon icon="download" />
+              </Tooltip>
+            </IconButton>
+          ) : (
+            <></>
+          )}
         </CardActions>
       </Card>
     </>

package/src/components/templates/attachment/AttachmentImageViewer.tsx

@@ -1,6 +1,6 @@
 import { useState } from "react";
 import { useSelector } from "react-redux";
-import { Avatar } from "@mui/material";
+import { Avatar, SxProps } from "@mui/material";
 
 type AttachmentImageViewerProps = {
   attachmentId?: number;
@@ -8,6 +8,7 @@ type AttachmentImageViewerProps = {
   refKey?: string;
   category?: string;
   showAsAvatar?: boolean;
+  style?: SxProps;
 };
 
 const AttachmentImageViewer: React.FC<AttachmentImageViewerProps> = (props) => {
@@ -25,7 +26,7 @@ const AttachmentImageViewer: React.FC<AttachmentImageViewerProps> = (props) => {
   }
   const [imgSrc, setImgSrc] = useState(imagePath);
   return props?.showAsAvatar ? (
-    <Avatar src={imgSrc} />
+    <Avatar src={imgSrc} sx={props.style} />
   ) : (
     <img
       src={imgSrc}

package/src/components/templates/attachment/AttachmentPanel.tsx

@@ -144,7 +144,7 @@ const AttachmentPanel: React.FC<AttachmentPanelProps> = (props) => {
     !isUserAuthorized(attachmentConfig?.downloadAuthorityKey)
   ) {
     showAttachments = false;
-  }  
+  }
   let allowUpload = true;
   if (props?.enableAttachment === false) {
     allowUpload = false;
@@ -253,6 +253,8 @@ const AttachmentPanel: React.FC<AttachmentPanelProps> = (props) => {
                     {...refKeyAttachment}
                     attachmentCode={props.attachmentCode}
                     setAttachmentConfig={setAttachmentConfig}
+                    downloadAuthorityKey={attachmentConfig.downloadAuthorityKey}
+                    allowDelete={allowUpload}
                   />
                 </Grid2>
               );

package/src/components/templates/report/ExcelReportViewer.tsx

@@ -33,10 +33,16 @@ const getGridColumnsFromRecord = (data: Array<any>) => {
 };
 
 const ExcelReportViewer: React.FC<ExcelReportViewerProps> = (props) => {
-  console.log("reportdata", props.reportData);
+  const [data, setData] = useState([]);
+  useEffect(() => {
+    const newData = props.reportData.map((record, index) => {
+      return { ...record, report_record_data_key: index };
+    });
+    setData(newData);
+  }, [props.reportData]);
   return (
     <TemplateGrid
-      data={props.reportData}
+      data={data}
       disableDefaultAction={true}
       setData={props.setReportData}
       formElements={getGridColumnsFromRecord(props.reportData)}
@@ -47,6 +53,7 @@ const ExcelReportViewer: React.FC<ExcelReportViewerProps> = (props) => {
       girdIcon={"file-excel"}
       gridTitle="Report"
       autoLoad={true}
+      keyColumnName={"report_record_data_key"}
       hideInfoBar={true}
       apiActions={{
         deleteRecordById: async () => {

package/src/components/templates/report/ReportViewer.tsx

@@ -99,7 +99,7 @@ const ReportViewer: React.FC<ReportViewerProps> = (props) => {
   const loadReportData = async () => {
     setReportViewerState("LOADING_METADATA");
     await handleGetRequest({
-      endPointURI: "api/v1/dev/report/metadata",
+      endPointURI: "api/v1/public/report/metadata",
       showMask: true,
       parameters: { reportCode: props.reportCode },
       successCallBkFn: (response: any) => {
@@ -130,7 +130,7 @@ const ReportViewer: React.FC<ReportViewerProps> = (props) => {
     setReportViewerState("WAITING_RESULT");
     if (reportInfoProp?.reportType === "Excel") {
       await handlePostRequest({
-        endPointURI: "api/v1/dev/report/run",
+        endPointURI: "api/v1/public/report/run",
         showMask: true,
         data: {
           reportCode: props.reportCode,
@@ -145,7 +145,7 @@ const ReportViewer: React.FC<ReportViewerProps> = (props) => {
       });
     } else if (reportInfoProp?.reportType) {
       await HandleDownloadHTTPPostPDF({
-        endPointURI: "api/v1/dev/report/run",
+        endPointURI: "api/v1/public/report/run",
         showMask: true,
         data: {
           reportCode: props.reportCode,
@@ -156,6 +156,7 @@ const ReportViewer: React.FC<ReportViewerProps> = (props) => {
         successCallBkFn: (response: any) => {
           setReportViewerState("SHOWING_RESULT");
           const contentDisposition = response.headers["content-disposition"];
+          debugger;
           let filename = "downloaded_file";
           if (
             contentDisposition &&

package/src/components/templates/workflow/WorkflowDocumentPanel.tsx

@@ -1,6 +1,14 @@
 import { useEffect, useState } from "react";
 import { useAxios, useSession, useWindow } from "../../../hooks";
-import { Avatar, Box, Button, Divider, Grid2, Paper } from "@mui/material";
+import {
+  Avatar,
+  Box,
+  Button,
+  Divider,
+  Grid2,
+  IconButton,
+  Paper,
+} from "@mui/material";
 import TemplateTextField from "../DataEntryTemplates/TemplateDataForm/FormFields/TemplateTextField";
 import ComboBox from "../DataEntryTemplates/TemplateDataForm/FormFields/ComboBox";
 import { useSelector } from "react-redux";
@@ -9,6 +17,8 @@ import WorkflowDocumentTimeLine from "./WorkflowDocumentTimeLine";
 import { toast } from "react-toastify";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import ReportViewer from "../report/ReportViewer";
+import AttachmentImageViewer from "../attachment/AttachmentImageViewer";
+import { useNavigate } from "react-router-dom";
 
 export type WorkflowDocumentPanelProps = {
   workFlowDocumentCode: string;
@@ -47,6 +57,7 @@ export type workflowDocumentActionHistory = {
   documentActionEnName: string;
   employeeArName: string;
   employeeEnName: string;
+  personId: number;
 };
 
 type WorkflowDocumentInfo = {
@@ -60,6 +71,7 @@ type WorkflowDocumentInfo = {
 };
 
 const WorkflowDocumentPanel: React.FC<WorkflowDocumentPanelProps> = (props) => {
+  const navigate = useNavigate();
   const AppLayout = useSelector((state: any) => state.AppLayout);
   const { isUserAuthorized, UserInfo } = useSession();
   const { handleGetRequest, handlePostRequest } = useAxios();
@@ -187,6 +199,9 @@ const WorkflowDocumentPanel: React.FC<WorkflowDocumentPanelProps> = (props) => {
             },
             successCallBkFn: () => {
               loadWorkFlowDocumentInfo();
+              if (props?.postActionCallBk) {
+                props.postActionCallBk();
+              }
             },
           });
           return;
@@ -282,6 +297,13 @@ const WorkflowDocumentPanel: React.FC<WorkflowDocumentPanelProps> = (props) => {
             justifyContent: "center",
           }}
         >
+          <IconButton
+            onClick={() => {
+              navigate(-1, { replace: true });
+            }}
+          >
+            <FontAwesomeIcon icon="arrow-left" />
+          </IconButton>
           <Box sx={{ flex: 1 }}></Box>
           <FontAwesomeIcon
             icon="file"
@@ -467,8 +489,11 @@ const WorkflowDocumentPanel: React.FC<WorkflowDocumentPanelProps> = (props) => {
                             padding: 2,
                           }}
                         >
-                          <Avatar
-                            sx={{
+                          <AttachmentImageViewer
+                            showAsAvatar={true}
+                            attachmentCode="EMPLOYEE_PHOTOS"
+                            refKey={nextActionTaker?.id || "0"}
+                            style={{
                               marginRight: 2,
                               marginLeft: 2,
                               width: 60,

package/src/components/templates/workflow/WorkflowDocumentTimeLine.tsx

@@ -4,6 +4,7 @@ import { useSelector } from "react-redux";
 import { Avatar, Box, Divider, Paper, Stack } from "@mui/material";
 import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 import { useTranslation } from "react-i18next";
+import AttachmentImageViewer from "../attachment/AttachmentImageViewer";
 
 type WorkflowDocumentTimeLineProp = {
   actionHistory: Array<workflowDocumentActionHistory>;
@@ -92,7 +93,12 @@ const WorkflowDocumentTimeLine: React.FC<WorkflowDocumentTimeLineProp> = (
                     marginLeft: 2,
                   }}
                 >
-                  <Avatar sx={{ m: 1, width: 70, height: 70 }} />
+                  <AttachmentImageViewer
+                    showAsAvatar={true}
+                    attachmentCode="EMPLOYEE_PHOTOS"
+                    refKey={actionHistoryRecord?.personId + "" || "0"}
+                    style={{ m: 1, width: 70, height: 70 }}
+                  />
                   {index !== props.actionHistory.length - 1 ? (
                     <Box sx={{ marginTop: 11, position: "absolute" }}>|</Box>
                   ) : (

package/src/layout/NotificationButton.tsx

@@ -48,7 +48,7 @@ const NotificationButton: React.FC = () => {
                 ? `You have new notifications`
                 : `لديك اشعارات جديدة`,
               {
-                autoClose: false,
+                autoClose: 3000,
                 position:
                   AppLayout.appDirection === "ltr"
                     ? "bottom-right"

package/src/layout/TopBar.tsx

@@ -196,7 +196,7 @@ const TopBar: React.FC = () => {
           <NotificationButton />
           <AttachmentImageViewer
             showAsAvatar={true}
-            attachmentCode="PERSON_IMG"
+            attachmentCode="EMPLOYEE_PHOTOS"
             refKey={UserSession.value?.id + ""}
           />
           <div style={{ marginLeft: 5, marginRight: 5 }}>

package/src/locals/book/arabic/bookLocalsAr.json

@@ -0,0 +1,8 @@
+{
+	"book":"book",
+			"WF_DOC_SINGULAR":"wfdoc",
+		"WF_DOC_PLURAL":"wfdocs",
+														"WF_DOC_DOC_NUM":"Doc num",
+												"WF_DOC_DOC_STATUS":"Doc status",
+												"WF_DOC_DOC_TYPE":"Doc type",
+																																									}

package/src/locals/book/english/bookLocalsEn.json

@@ -0,0 +1,8 @@
+{
+	"book":"book",
+			"WF_DOC_SINGULAR":"wfdoc",
+		"WF_DOC_PLURAL":"wfdocs",
+														"WF_DOC_DOC_NUM":"Doc num",
+												"WF_DOC_DOC_STATUS":"Doc status",
+												"WF_DOC_DOC_TYPE":"Doc type",
+																																									}

package/src/main.tsx

@@ -1,11 +1,10 @@
-import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 import { BaseApp } from "./components";
-// import logo from "./assets/logo.png";
+
 
 createRoot(document.getElementById("root")!).render(
   <BaseApp
-    apiBaseUrl="http://localhost:8080/api-base"
+    apiBaseUrl="http://localhost:8080/ezz-residual"
     appLogo={"/public/logo.png"}
     appName="UI Base Library"
     appVersion="0.0"