Task #234692 Integrate Public Metabase URL in Profile Section

tekdi · Feb 12, 2025 · 78383f4 · 78383f4
1 parent 26cb619
commit 78383f4
Show file tree

Hide file tree

Showing 5 changed files with 88 additions and 53 deletions.
diff --git a/public/locales/en/common.json b/public/locales/en/common.json
@@ -144,7 +144,8 @@
     "ASSIGN_ROLE": "Assign Role",
     "ENABLE_ROLE": "Enable Role",
     "SEND_INVITATION_TO_NEW_ADMIN": "Send Invitation to new cohort admin",
-    "SEND_INVITATION": "Send Invitation"
+    "SEND_INVITATION": "Send Invitation",
+    "METABASE_REPORTS": "Metabase Report"
   },
   "LOGIN_PAGE": {
     "USERNAME": "Username",
@@ -478,25 +479,25 @@
     "NO_CHANGES_TO_UPDATE": "No Changes to Update"
   },
   "COHORTINVITATION": {
-      "TAKE_ACTION": "Take Action",
-      "INVITED_AS_ADMIN": "You have been invited to be the Admin of the cohort",
-      "SENT":"Sent",
-      "RECEIVED":"Received",
-      "ACCEPT_INVITATION": "Accept Invitation",
-      "REJECT_INVITATION": "Reject Invitation",
-      "NO_PENDING_REQUESTS_SENT": "No pending requests sent",
-      "NO_PENDING_INVITATIONS": "No pending invitations",
-      "INVITED_TO_JOIN_COHORT": "Invited to join cohort",
-      "INVITED_BY": "Invited by",
-      "REVOKE_INVITATION": "Revoke Invitation",
-      "DELETE_CONFIRMATION": "Revoke request of ",
-      "CANCEL": "Cancel",
-      "REVOKE": "Revoke",
-      "ACCEPTED_SUCCESS": "Accepted request successfully",
-      "REJECTED_SUCCESS": "Rejected request",
-      "ERROR_UPDATING_REQUEST": "Error in updating request",
-      "INVITATION_DELETED_SUCCESS": "Invitation deleted successfully",
-      "INVITATION_DELETED_ERROR": "Failed to delete invitation",
-      "FETCH_INVITATIONS_ERROR": "Failed to fetch invitations"
-    }
+    "TAKE_ACTION": "Take Action",
+    "INVITED_AS_ADMIN": "You have been invited to be the Admin of the cohort",
+    "SENT": "Sent",
+    "RECEIVED": "Received",
+    "ACCEPT_INVITATION": "Accept Invitation",
+    "REJECT_INVITATION": "Reject Invitation",
+    "NO_PENDING_REQUESTS_SENT": "No pending requests sent",
+    "NO_PENDING_INVITATIONS": "No pending invitations",
+    "INVITED_TO_JOIN_COHORT": "Invited to join cohort",
+    "INVITED_BY": "Invited by",
+    "REVOKE_INVITATION": "Revoke Invitation",
+    "DELETE_CONFIRMATION": "Revoke request of ",
+    "CANCEL": "Cancel",
+    "REVOKE": "Revoke",
+    "ACCEPTED_SUCCESS": "Accepted request successfully",
+    "REJECTED_SUCCESS": "Rejected request",
+    "ERROR_UPDATING_REQUEST": "Error in updating request",
+    "INVITATION_DELETED_SUCCESS": "Invitation deleted successfully",
+    "INVITATION_DELETED_ERROR": "Failed to delete invitation",
+    "FETCH_INVITATIONS_ERROR": "Failed to fetch invitations"
+  }
 }
diff --git a/src/components/ActionIcon.tsx b/src/components/ActionIcon.tsx
@@ -7,10 +7,12 @@ import deleteIcon from "../../public/images/deleteIcon.svg";
 import editIcon from "../../public/images/editIcon.svg";
 import cohortIcon from "../../public/images/apartment.svg";
 import addIcon from "../../public/images/addIcon.svg";
-
+import Dashboard from "@/pages/dashboard";
 import Image from "next/image";
 import { useRouter } from "next/router";
-
+import AssessmentIcon from "@mui/icons-material/Assessment"; // MUI report icon
+import ApartmentIcon from "@mui/icons-material/Apartment"; // MUI cohort icon
+import AddIcon from "@mui/icons-material/Add";
 interface ActionCellProps {
   onEdit: (rowData: any) => void;
   onDelete: (rowData: any) => void;
@@ -44,16 +46,20 @@ const ActionIcon: React.FC<ActionCellProps> = ({
 
   const isCohortAdmin = rowData?.userRoleTenantMapping?.code === "cohort_admin";
   const isLearnersPage = router.pathname === "/learners";
+  const isCohortPage = router.pathname === "/cohorts";
+
+  const showEditDeleteButtons = true;
   const isActionAllowed = isCohortAdmin && !isLearnersPage;
+  const isAddEnabled = isCohortAdmin && isCohortPage;
+  const isEditDeleteEnabled = isLearnersPage || !isCohortAdmin;
+
   return (
     <Box
       sx={{
         display: "flex",
         flexDirection: "row",
         gap: "20px",
         alignItems: "center",
-        pointerEvents: isActionAllowed ? "none" : "auto",
-        opacity: isActionAllowed ? 0.5 : 1,
       }}
     >
       {roleButton && (
@@ -83,40 +89,39 @@ const ActionIcon: React.FC<ActionCellProps> = ({
         <Tooltip title={t("COMMON.ADD")}>
           <Box
             onClick={() => {
-              if (!isActionAllowed) onAdd(rowData);
+              if (isAddEnabled) onAdd(rowData);
             }}
             sx={{
               display: "flex",
               flexDirection: "column",
               alignItems: "center",
-              cursor: "pointer",
-              color: disable ? theme?.palette?.secondary.contrastText : "",
-              backgroundColor: "#EAF2FF",
+              cursor: isAddEnabled ? "pointer" : "not-allowed",
+              color: isAddEnabled ? "" : theme?.palette?.secondary.contrastText,
+              backgroundColor: isAddEnabled ? "#EAF2FF" : "#d3d3d3",
               p: "10px",
+              opacity: isAddEnabled ? 1 : 0.5,
             }}
           >
             <Image src={addIcon} alt="" />
-            {/* 
-          <Typography variant="body2" fontFamily={"Poppins"}>
-            {t("COMMON.DELETE")}
-          </Typography> */}
           </Box>
         </Tooltip>
       )}
-      {allowEditIcon && (
+
+      {(showEditDeleteButtons || allowEditIcon) && (
         <>
           <Tooltip title={t("COMMON.EDIT")}>
             <Box
               onClick={() => {
-                if (!isActionAllowed) onEdit(rowData);
+                if (isEditDeleteEnabled) onEdit(rowData);
               }}
               sx={{
                 display: "flex",
                 flexDirection: "column",
                 alignItems: "center",
-                cursor: isActionAllowed ? "not-allowed" : "pointer",
-                backgroundColor: isActionAllowed ? "#d3d3d3" : "#E3EAF0",
+                cursor: isEditDeleteEnabled ? "pointer" : "not-allowed",
+                backgroundColor: isEditDeleteEnabled ? "#E3EAF0" : "#d3d3d3",
                 p: "10px",
+                opacity: isEditDeleteEnabled ? 1 : 0.5,
               }}
             >
               <Image src={editIcon} alt="" />
@@ -126,36 +131,60 @@ const ActionIcon: React.FC<ActionCellProps> = ({
           <Tooltip title={t("COMMON.DELETE")}>
             <Box
               onClick={() => {
-                if (!isActionAllowed) onDelete(rowData);
+                if (isEditDeleteEnabled) onDelete(rowData);
               }}
               sx={{
                 display: "flex",
                 flexDirection: "column",
                 alignItems: "center",
-                cursor: isActionAllowed ? "not-allowed" : "pointer",
-                backgroundColor: isActionAllowed ? "#d3d3d3" : "#EAF2FF",
+                cursor: isEditDeleteEnabled ? "pointer" : "not-allowed",
+                backgroundColor: isEditDeleteEnabled ? "#EAF2FF" : "#d3d3d3",
                 p: "10px",
+                opacity: isEditDeleteEnabled ? 1 : 0.5,
               }}
             >
               <Image src={deleteIcon} alt="" />
             </Box>
           </Tooltip>
+          <Tooltip title={t("COMMON.METABASE_REPORTS")}>
+            <Box
+              onClick={() => {
+                router.push({
+                  pathname: "/dashboard",
+                  query: rowData,
+                });
+              }}
+              sx={{
+                display: "flex",
+                flexDirection: "column",
+                alignItems: "center",
+                cursor: "pointer",
+                backgroundColor: "#EAF2FF",
+                p: "10px",
+                opacity: 1,
+              }}
+            >
+              <AssessmentIcon />
+            </Box>
+          </Tooltip>
         </>
       )}
 
       {userAction && (
         <Tooltip title={reassignType}>
           <Box
             onClick={() => {
-              if (!isActionAllowed && reassignCohort) reassignCohort(rowData);
+              if (isEditDeleteEnabled && reassignCohort)
+                reassignCohort(rowData);
             }}
             sx={{
               display: "flex",
               flexDirection: "column",
               alignItems: "center",
-              cursor: isActionAllowed ? "not-allowed" : "pointer",
-              backgroundColor: isActionAllowed ? "#d3d3d3" : "#E5E5E5",
+              cursor: isEditDeleteEnabled ? "pointer" : "not-allowed",
+              backgroundColor: isEditDeleteEnabled ? "#E5E5E5" : "#d3d3d3",
               p: "10px",
+              opacity: isEditDeleteEnabled ? 1 : 0.5,
             }}
           >
             <Image src={cohortIcon} alt="" />

diff --git a/src/components/layouts/header/Profile.tsx b/src/components/layouts/header/Profile.tsx
@@ -362,7 +362,7 @@ const Profile = () => {
               {adminInfo?.email}
             </Typography>
           </Box>
-          <Box
+          {/* <Box
             sx={{
               display: "flex",
               alignItems: "center",
@@ -376,7 +376,7 @@ const Profile = () => {
             <Typography variant="body1" sx={{ fontSize: "14px" }}>
               Dashboard
             </Typography>
-          </Box>
+          </Box> */}
 
           <Divider sx={{ color: "#D0C5B4" }} />
           <Box sx={{ px: "20px" }}>

diff --git a/src/data/tableColumns.ts b/src/data/tableColumns.ts
@@ -141,8 +141,9 @@ export const getCohortTableData = (
     // },
     // { key: "roleDefine", titleKey: "TABLE_TITLE.ROLE", width: 130 },
 
-    ...(role == true &&
-    !(filter?.status?.[0] === "inactive" || filter?.status?.[0] === "archived")
+    ...(!(
+      filter?.status?.[0] === "inactive" || filter?.status?.[0] === "archived"
+    )
       ? [
           {
             key: "cohortAdmin",

diff --git a/src/pages/dashboard.tsx b/src/pages/dashboard.tsx
@@ -2,19 +2,23 @@ import { serverSideTranslations } from "next-i18next/serverSideTranslations";
 import { useRouter } from "next/router";
 import { useEffect, useState } from "react";
 
+interface RowData {
+  tenantId?: string;
+}
 const Dashboard = () => {
   const router = useRouter();
-  const { userId } = router.query;
+  const [rowData, setRowData] = useState<RowData | undefined>();
   const [isError, setIsError] = useState(false);
 
   // Validate userId
   useEffect(() => {
-    if (!userId) {
-      setIsError(true);
+    if (router.query) {
+      setRowData(router.query);
     }
-  }, [userId]);
+  }, [router.query]);
+  console.log({ rowData });
 
-  const metabaseUrl = `${process.env.NEXT_PUBLIC_METABASE_URL}${userId}`;
+  const metabaseUrl = `${process.env.NEXT_PUBLIC_METABASE_URL}${rowData?.tenantId}`;
 
   return (
     <div>