Merge pull request #3119 from makeplane/chore/analytics_permission_validation

chore: analytics permission validation added

web/components/headers/cycle-issues.tsx

@@ -192,10 +192,12 @@ export const CycleIssuesHeader: React.FC = observer(() => {
               handleDisplayPropertiesUpdate={handleDisplayProperties}
             />
           </FiltersDropdown>
+
+          {canUserCreateIssue && (
+            <>
               <Button onClick={() => setAnalyticsModal(true)} variant="neutral-primary" size="sm">
                 Analytics
               </Button>
-          {canUserCreateIssue && (
               <Button
                 onClick={() => {
                   setTrackElement("CYCLE_PAGE_HEADER");
@@ -206,6 +208,7 @@ export const CycleIssuesHeader: React.FC = observer(() => {
               >
                 Add Issue
               </Button>
+            </>
           )}
           <button
             type="button"

web/components/headers/module-issues.tsx

@@ -193,10 +193,12 @@ export const ModuleIssuesHeader: React.FC = observer(() => {
               handleDisplayPropertiesUpdate={handleDisplayProperties}
             />
           </FiltersDropdown>
+
+          {canUserCreateIssue && (
+            <>
               <Button onClick={() => setAnalyticsModal(true)} variant="neutral-primary" size="sm">
                 Analytics
               </Button>
-          {canUserCreateIssue && (
               <Button
                 onClick={() => {
                   setTrackElement("MODULE_PAGE_HEADER");
@@ -207,6 +209,7 @@ export const ModuleIssuesHeader: React.FC = observer(() => {
               >
                 Add Issue
               </Button>
+            </>
           )}
           <button
             type="button"

web/components/headers/project-issues.tsx

@@ -202,10 +202,12 @@ export const ProjectIssuesHeader: React.FC = observer(() => {
               </span>
             </Link>
           )}
+
+          {canUserCreateIssue && (
+            <>
               <Button onClick={() => setAnalyticsModal(true)} variant="neutral-primary" size="sm">
                 Analytics
               </Button>
-          {canUserCreateIssue && (
               <Button
                 onClick={() => {
                   setTrackElement("PROJECT_PAGE_HEADER");
@@ -216,6 +218,7 @@ export const ProjectIssuesHeader: React.FC = observer(() => {
               >
                 Add Issue
               </Button>
+            </>
           )}
         </div>
       </div>

web/components/workspace/sidebar-menu.tsx

@@ -9,6 +9,8 @@ import { BarChart2, Briefcase, CheckCircle, LayoutGrid } from "lucide-react";
 // mobx store
 import { useMobxStore } from "lib/mobx/store-provider";
 import { observer } from "mobx-react-lite";
+// constants
+import { EUserWorkspaceRoles } from "constants/workspace";
 
 const workspaceLinks = (workspaceSlug: string) => [
   {
@@ -34,16 +36,21 @@ const workspaceLinks = (workspaceSlug: string) => [
 ];
 
 export const WorkspaceSidebarMenu = observer(() => {
-  const { theme: themeStore } = useMobxStore();
+  const {
+    theme: themeStore,
+    user: { currentWorkspaceRole },
+  } = useMobxStore();
   // router
   const router = useRouter();
   const { workspaceSlug } = router.query;
 
+  const isAuthorizedUser = !!currentWorkspaceRole && currentWorkspaceRole >= EUserWorkspaceRoles.MEMBER;
+
   return (
     <div className="w-full cursor-pointer space-y-1 p-4">
       {workspaceLinks(workspaceSlug as string).map((link, index) => {
         const isActive = link.name === "Settings" ? router.asPath.includes(link.href) : router.asPath === link.href;
-
+        if (!isAuthorizedUser && link.name === "Analytics") return;
         return (
           <Link key={index} href={link.href}>
             <span className="block w-full">

web/components/workspace/sidebar-quick-action.tsx

@@ -10,6 +10,8 @@ import { CreateUpdateDraftIssueModal } from "components/issues";
 import { useMobxStore } from "lib/mobx/store-provider";
 import { observer } from "mobx-react-lite";
 import { EProjectStore } from "store/command-palette.store";
+// constants
+import { EUserWorkspaceRoles } from "constants/workspace";
 
 export const WorkspaceSidebarQuickAction = observer(() => {
   // states
@@ -19,12 +21,15 @@ export const WorkspaceSidebarQuickAction = observer(() => {
     theme: themeStore,
     commandPalette: commandPaletteStore,
     trackEvent: { setTrackElement },
+    user: { currentWorkspaceRole },
   } = useMobxStore();
 
   const { storedValue, clearValue } = useLocalStorage<any>("draftedIssue", JSON.stringify({}));
 
   const isSidebarCollapsed = themeStore.sidebarCollapsed;
 
+  const isAuthorizedUser = !!currentWorkspaceRole && currentWorkspaceRole >= EUserWorkspaceRoles.MEMBER;
+
   return (
     <>
       <CreateUpdateDraftIssueModal
@@ -42,6 +47,7 @@ export const WorkspaceSidebarQuickAction = observer(() => {
           isSidebarCollapsed ? "flex-col gap-1" : "gap-2"
         }`}
       >
+        {isAuthorizedUser && (
           <div
             className={`group relative flex w-full cursor-pointer items-center justify-between gap-1 rounded px-2 ${
               isSidebarCollapsed
@@ -65,7 +71,9 @@ export const WorkspaceSidebarQuickAction = observer(() => {
 
             {storedValue && Object.keys(JSON.parse(storedValue)).length > 0 && (
               <>
-              <div className={`h-8 w-0.5 bg-custom-sidebar-background-80 ${isSidebarCollapsed ? "hidden" : "block"}`} />
+                <div
+                  className={`h-8 w-0.5 bg-custom-sidebar-background-80 ${isSidebarCollapsed ? "hidden" : "block"}`}
+                />
 
                 <button
                   type="button"
@@ -94,9 +102,12 @@ export const WorkspaceSidebarQuickAction = observer(() => {
               </>
             )}
           </div>
+        )}
 
         <button
-          className={`flex flex-shrink-0 items-center justify-center rounded p-2 outline-none ${
+          className={`flex flex-shrink-0 items-center rounded p-2 gap-2 outline-none ${
+            isAuthorizedUser ? "justify-center" : "w-full"
+          } ${
             isSidebarCollapsed
               ? "hover:bg-custom-sidebar-background-80"
               : "border-[0.5px] border-custom-border-200 shadow-custom-sidebar-shadow-2xs"
@@ -104,6 +115,7 @@ export const WorkspaceSidebarQuickAction = observer(() => {
           onClick={() => commandPaletteStore.toggleCommandPaletteModal(true)}
         >
           <Search className="h-4 w-4 text-custom-sidebar-text-300" />
+          <span className="text-xs font-medium">Open command menu</span>
         </button>
       </div>
     </>