@asaleh37/ui-base 25.6.1 → 25.6.2-0.1

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

@@ -1,140 +1,140 @@
-import Typography from "@mui/material/Typography";
-import { workflowDocumentActionHistory } from "./WorkflowDocumentPanel";
-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>;
-};
-
-const WorkflowDocumentTimeLine: React.FC<WorkflowDocumentTimeLineProp> = (
-  props
-) => {
-  const AppLayout = useSelector((state: any) => state.AppLayout);
-  const { t } = useTranslation();
-  return (
-    <Paper
-      sx={{
-        display: "flex",
-        flexDirection: "column",
-        flexGrow: 1,
-        padding: 1,
-        margin: 1,
-        alignItems: "center",
-        justifyContent: "center",
-      }}
-    >
-      <Box
-        sx={{
-          width: "100%",
-          display: "flex",
-          alignItems: "center",
-          justifyContent: "center",
-          fontSize: 18,
-          fontWeight: "bold",
-        }}
-      >
-        <FontAwesomeIcon
-          icon="history"
-          style={{ marginRight: 10, marginLeft: 10 }}
-        />
-        {t("WF_ACTION_HISTORY_LABEL")}
-      </Box>
-      <Box
-        sx={{
-          flexGrow: 1,
-          width: "100%",
-          display: "flex",
-          flexDirection: "column",
-          overflowY: "auto",
-          alignItems: "center",
-          justifyContent: "flex-start",
-        }}
-      >
-        {props.actionHistory.map((actionHistoryRecord, index) => {
-          return (
-            <>
-              <Box
-                sx={{
-                  display: "flex",
-                  alignItems: "center",
-                  justifyContent: "center",
-                  width: "100%",
-                  marginBottom: 2,
-                }}
-              >
-                <Box
-                  sx={{
-                    display: "flex",
-                    flex: 1,
-                    flexDirection: "column",
-                    alignItems: "flex-end",
-                    justifyContent: "center",
-                  }}
-                >
-                  <Box sx={{ marginBottom: 0.2 }}>
-                    {actionHistoryRecord.actionTime}
-                  </Box>
-                  <Typography>
-                    via {actionHistoryRecord.actionMethod}
-                  </Typography>
-                </Box>
-                <Box
-                  sx={{
-                    display: "flex",
-                    flexDirection: "column",
-                    alignItems: "center",
-                    justifyContent: "center",
-                    position: "relative",
-                    marginRight: 2,
-                    marginLeft: 2,
-                  }}
-                >
-                  <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>
-                  ) : (
-                    <></>
-                  )}
-                </Box>
-                <Box
-                  sx={{
-                    display: "flex",
-                    flex: 1,
-                    flexDirection: "column",
-                    alignItems: "flex-start",
-                    justifyContent: "center",
-                  }}
-                >
-                  <Box sx={{ width: "100%" }}>
-                    {AppLayout.appDirection === "ltr"
-                      ? `${actionHistoryRecord?.documentActionEnName}`
-                      : `${actionHistoryRecord?.documentActionArName}`}
-                    {actionHistoryRecord?.actionComment
-                      ? " - " + actionHistoryRecord.actionComment
-                      : ""}
-                  </Box>
-                  <Box sx={{ width: "100%" }}>
-                    {AppLayout.appDirection === "ltr"
-                      ? `${actionHistoryRecord?.employeeEnName}`
-                      : `${actionHistoryRecord?.employeeArName}`}
-                  </Box>
-                </Box>
-              </Box>
-            </>
-          );
-        })}
-      </Box>
-    </Paper>
-  );
-};
-
-export default WorkflowDocumentTimeLine;
+import Typography from "@mui/material/Typography";
+import { workflowDocumentActionHistory } from "./WorkflowDocumentPanel";
+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>;
+};
+
+const WorkflowDocumentTimeLine: React.FC<WorkflowDocumentTimeLineProp> = (
+  props
+) => {
+  const AppLayout = useSelector((state: any) => state.AppLayout);
+  const { t } = useTranslation();
+  return (
+    <Paper
+      sx={{
+        display: "flex",
+        flexDirection: "column",
+        flexGrow: 1,
+        padding: 1,
+        margin: 1,
+        alignItems: "center",
+        justifyContent: "center",
+      }}
+    >
+      <Box
+        sx={{
+          width: "100%",
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          fontSize: 18,
+          fontWeight: "bold",
+        }}
+      >
+        <FontAwesomeIcon
+          icon="history"
+          style={{ marginRight: 10, marginLeft: 10 }}
+        />
+        {t("WF_ACTION_HISTORY_LABEL")}
+      </Box>
+      <Box
+        sx={{
+          flexGrow: 1,
+          width: "100%",
+          display: "flex",
+          flexDirection: "column",
+          overflowY: "auto",
+          alignItems: "center",
+          justifyContent: "flex-start",
+        }}
+      >
+        {props.actionHistory.map((actionHistoryRecord, index) => {
+          return (
+            <>
+              <Box
+                sx={{
+                  display: "flex",
+                  alignItems: "center",
+                  justifyContent: "center",
+                  width: "100%",
+                  marginBottom: 2,
+                }}
+              >
+                <Box
+                  sx={{
+                    display: "flex",
+                    flex: 1,
+                    flexDirection: "column",
+                    alignItems: "flex-end",
+                    justifyContent: "center",
+                  }}
+                >
+                  <Box sx={{ marginBottom: 0.2 }}>
+                    {actionHistoryRecord.actionTime}
+                  </Box>
+                  <Typography>
+                    via {actionHistoryRecord.actionMethod}
+                  </Typography>
+                </Box>
+                <Box
+                  sx={{
+                    display: "flex",
+                    flexDirection: "column",
+                    alignItems: "center",
+                    justifyContent: "center",
+                    position: "relative",
+                    marginRight: 2,
+                    marginLeft: 2,
+                  }}
+                >
+                  <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>
+                  ) : (
+                    <></>
+                  )}
+                </Box>
+                <Box
+                  sx={{
+                    display: "flex",
+                    flex: 1,
+                    flexDirection: "column",
+                    alignItems: "flex-start",
+                    justifyContent: "center",
+                  }}
+                >
+                  <Box sx={{ width: "100%" }}>
+                    {AppLayout.appDirection === "ltr"
+                      ? `${actionHistoryRecord?.documentActionEnName}`
+                      : `${actionHistoryRecord?.documentActionArName}`}
+                    {actionHistoryRecord?.actionComment
+                      ? " - " + actionHistoryRecord.actionComment
+                      : ""}
+                  </Box>
+                  <Box sx={{ width: "100%" }}>
+                    {AppLayout.appDirection === "ltr"
+                      ? `${actionHistoryRecord?.employeeEnName}`
+                      : `${actionHistoryRecord?.employeeArName}`}
+                  </Box>
+                </Box>
+              </Box>
+            </>
+          );
+        })}
+      </Box>
+    </Paper>
+  );
+};
+
+export default WorkflowDocumentTimeLine;

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

@@ -1,14 +1,14 @@
-import { useParams } from "react-router-dom";
-import WorkflowDocumentPanel from "./WorkflowDocumentPanel";
-
-const WorkflowRouteComponent: React.FC = () => {
-  const { workflowDocumentCode, refDocumentId } = useParams();
-  return (
-    <WorkflowDocumentPanel
-      workFlowDocumentCode={workflowDocumentCode}
-      refDocumentId={refDocumentId}
-    />
-  );
-};
-
-export default WorkflowRouteComponent;
+import { useParams } from "react-router-dom";
+import WorkflowDocumentPanel from "./WorkflowDocumentPanel";
+
+const WorkflowRouteComponent: React.FC = () => {
+  const { workflowDocumentCode, refDocumentId } = useParams();
+  return (
+    <WorkflowDocumentPanel
+      workFlowDocumentCode={workflowDocumentCode}
+      refDocumentId={refDocumentId}
+    />
+  );
+};
+
+export default WorkflowRouteComponent;

package/src/hooks/UseConfirmationWindow.tsx

@@ -1,54 +1,54 @@
-import {
-  Button,
-  Dialog,
-  DialogActions,
-  DialogContent,
-  DialogContentText,
-  DialogTitle,
-} from "@mui/material";
-import { useState } from "react";
-import { useTranslation } from "react-i18next";
-
-interface ConfirmationWindowProps {
-  title: string;
-  body: string;
-  onConfirmationCallBk: () => void;
-}
-
-export const useConfirmationWindow = (props: ConfirmationWindowProps) => {
-  const [open, setOpen] = useState<boolean>(false);
-  const { t } = useTranslation();
-  const ConfirmationWindow: React.FC = () => {
-    return (
-      <Dialog open={open}>
-        <DialogTitle>{props.title}</DialogTitle>
-        <DialogContent>
-          <DialogContentText>{props.body}</DialogContentText>
-        </DialogContent>
-        <DialogActions>
-          <Button
-            variant="contained"
-            color="primary"
-            onClick={() => {
-              setOpen(false);
-            }}
-          >
-            {t("NO_LABEL")}
-          </Button>
-          <Button
-            variant="contained"
-            color="error"
-            onClick={() => {
-              props.onConfirmationCallBk();
-              setOpen(false);
-            }}
-            autoFocus
-          >
-            {t("YES_LABEL")}
-          </Button>
-        </DialogActions>
-      </Dialog>
-    );
-  };
-  return { ConfirmationWindow, open, setOpen };
-};
+import {
+  Button,
+  Dialog,
+  DialogActions,
+  DialogContent,
+  DialogContentText,
+  DialogTitle,
+} from "@mui/material";
+import { useState } from "react";
+import { useTranslation } from "react-i18next";
+
+interface ConfirmationWindowProps {
+  title: string;
+  body: string;
+  onConfirmationCallBk: () => void;
+}
+
+export const useConfirmationWindow = (props: ConfirmationWindowProps) => {
+  const [open, setOpen] = useState<boolean>(false);
+  const { t } = useTranslation();
+  const ConfirmationWindow: React.FC = () => {
+    return (
+      <Dialog open={open}>
+        <DialogTitle>{props.title}</DialogTitle>
+        <DialogContent>
+          <DialogContentText>{props.body}</DialogContentText>
+        </DialogContent>
+        <DialogActions>
+          <Button
+            variant="contained"
+            color="primary"
+            onClick={() => {
+              setOpen(false);
+            }}
+          >
+            {t("NO_LABEL")}
+          </Button>
+          <Button
+            variant="contained"
+            color="error"
+            onClick={() => {
+              props.onConfirmationCallBk();
+              setOpen(false);
+            }}
+            autoFocus
+          >
+            {t("YES_LABEL")}
+          </Button>
+        </DialogActions>
+      </Dialog>
+    );
+  };
+  return { ConfirmationWindow, open, setOpen };
+};

package/src/hooks/UseMobile.tsx

@@ -1,13 +1,13 @@
-import { useEffect, useState } from "react";
-
-export const useIsMobile = (breakpoint = 768) => {
-  const [isMobile, setIsMobile] = useState(window.innerWidth < breakpoint);
-
-  useEffect(() => {
-    const handleResize = () => setIsMobile(window.innerWidth < breakpoint);
-    window.addEventListener("resize", handleResize);
-    return () => window.removeEventListener("resize", handleResize);
-  }, [breakpoint]);
-
-  return isMobile;
-};
+import { useEffect, useState } from "react";
+
+export const useIsMobile = (breakpoint = 768) => {
+  const [isMobile, setIsMobile] = useState(window.innerWidth < breakpoint);
+
+  useEffect(() => {
+    const handleResize = () => setIsMobile(window.innerWidth < breakpoint);
+    window.addEventListener("resize", handleResize);
+    return () => window.removeEventListener("resize", handleResize);
+  }, [breakpoint]);
+
+  return isMobile;
+};

package/src/hooks/UseSession.tsx

@@ -1,40 +1,40 @@
-import { useSelector } from "react-redux";
-
-const useSession = () => {
-  const UserSession = useSelector((state: any) => state.UserSession);
-  const UserInfo = UserSession.value;
-  const isUserAuthorized = (authorityCode: string): boolean => {
-    if (UserSession?.value?.authorities) {
-      for (let grantedAuthority of UserSession.value.authorities) {
-        if (
-          authorityCode === "DEVELOPMENT_ADMIN" &&
-          (grantedAuthority?.authority === "DEVELOPMENT_ADMIN" ||
-            grantedAuthority?.authority === "ORGANIZATION_ADMIN")
-        ) {
-          return true;
-        } else if (
-          authorityCode === "ORGANIZATION_ADMIN" &&
-          grantedAuthority?.authority === "ORGANIZATION_ADMIN"
-        ) {
-          return true;
-        } else if (
-          authorityCode !== "DEVELOPMENT_ADMIN" &&
-          authorityCode !== "ORGANIZATION_ADMIN"
-        ) {
-          if (
-            grantedAuthority?.authority === "ORGANIZATION_ADMIN" ||
-            grantedAuthority?.authority === "DEVELOPMENT_ADMIN" ||
-            grantedAuthority?.authority === "SYSTEM_ADMIN" ||
-            grantedAuthority?.authority === authorityCode
-          ) {
-            return true;
-          }
-        }
-      }
-    }
-    return false;
-  };
-  return { UserSession, isUserAuthorized, UserInfo };
-};
-
-export default useSession;
+import { useSelector } from "react-redux";
+
+const useSession = () => {
+  const UserSession = useSelector((state: any) => state.UserSession);
+  const UserInfo = UserSession.value;
+  const isUserAuthorized = (authorityCode: string): boolean => {
+    if (UserSession?.value?.authorities) {
+      for (let grantedAuthority of UserSession.value.authorities) {
+        if (
+          authorityCode === "DEVELOPMENT_ADMIN" &&
+          (grantedAuthority?.authority === "DEVELOPMENT_ADMIN" ||
+            grantedAuthority?.authority === "ORGANIZATION_ADMIN")
+        ) {
+          return true;
+        } else if (
+          authorityCode === "ORGANIZATION_ADMIN" &&
+          grantedAuthority?.authority === "ORGANIZATION_ADMIN"
+        ) {
+          return true;
+        } else if (
+          authorityCode !== "DEVELOPMENT_ADMIN" &&
+          authorityCode !== "ORGANIZATION_ADMIN"
+        ) {
+          if (
+            grantedAuthority?.authority === "ORGANIZATION_ADMIN" ||
+            grantedAuthority?.authority === "DEVELOPMENT_ADMIN" ||
+            grantedAuthority?.authority === "SYSTEM_ADMIN" ||
+            grantedAuthority?.authority === authorityCode
+          ) {
+            return true;
+          }
+        }
+      }
+    }
+    return false;
+  };
+  return { UserSession, isUserAuthorized, UserInfo };
+};
+
+export default useSession;