From 6f417cd09a2a7ed2efdfcc415839300651daab9f Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 4 Sep 2024 15:49:31 +0530
Subject: [PATCH 1/2] [WEB-2376] dev: workspace settings improvement &
 refactor.

---
 .../settings/mobile-header-tabs.tsx           | 42 +++++++++++++------
 .../(projects)/settings/sidebar.tsx           |  4 ++
 web/ce/helpers/workspace.helper.ts            |  2 +
 .../actions/workspace-settings-actions.tsx    |  5 ++-
 web/core/lib/store-context.tsx                |  7 ++--
 web/ee/helpers/workspace.helper.ts            |  1 +
 6 files changed, 43 insertions(+), 18 deletions(-)
 create mode 100644 web/ce/helpers/workspace.helper.ts
 create mode 100644 web/ee/helpers/workspace.helper.ts

diff --git a/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx b/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx
index 5cbcce6534a..404306115d8 100644
--- a/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx
+++ b/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx
@@ -1,28 +1,44 @@
 import { useParams, usePathname } from "next/navigation";
+// constants
+import { EUserWorkspaceRoles } from "@/constants/workspace";
 // hooks
+import { useUser } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 // plane web constants
 import { WORKSPACE_SETTINGS_LINKS } from "@/plane-web/constants/workspace";
+// plane web helpers
+import { filterWorkspaceSettingLinks } from "@/plane-web/helpers/workspace.helper";
 
 export const MobileWorkspaceSettingsTabs = () => {
   const router = useAppRouter();
   const { workspaceSlug } = useParams();
   const pathname = usePathname();
+  // mobx store
+  const {
+    membership: { currentWorkspaceRole },
+  } = useUser();
+
+  // derived values
+  const workspaceMemberInfo = currentWorkspaceRole || EUserWorkspaceRoles.GUEST;
+
   return (
     <div className="flex-shrink-0 md:hidden sticky inset-0 flex overflow-x-auto bg-custom-background-100 z-10">
-      {WORKSPACE_SETTINGS_LINKS.map((item, index) => (
-        <div
-          className={`${
-            item.highlight(pathname, `/${workspaceSlug}`)
-              ? "text-custom-primary-100 text-sm py-2 px-3 whitespace-nowrap flex flex-grow cursor-pointer justify-around border-b border-custom-primary-200"
-              : "text-custom-text-200 flex flex-grow cursor-pointer justify-around border-b border-custom-border-200 text-sm py-2 px-3 whitespace-nowrap"
-          }`}
-          key={index}
-          onClick={() => router.push(`/${workspaceSlug}${item.href}`)}
-        >
-          {item.label}
-        </div>
-      ))}
+      {WORKSPACE_SETTINGS_LINKS.map(
+        (item, index) =>
+          filterWorkspaceSettingLinks(item.key) &&
+          workspaceMemberInfo >= item.access && (
+            <div
+              className={`${item.highlight(pathname, `/${workspaceSlug}`)
+                ? "text-custom-primary-100 text-sm py-2 px-3 whitespace-nowrap flex flex-grow cursor-pointer justify-around border-b border-custom-primary-200"
+                : "text-custom-text-200 flex flex-grow cursor-pointer justify-around border-b border-custom-border-200 text-sm py-2 px-3 whitespace-nowrap"
+                }`}
+              key={index}
+              onClick={() => router.push(`/${workspaceSlug}${item.href}`)}
+            >
+              {item.label}
+            </div>
+          )
+      )}
     </div>
   );
 };
diff --git a/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx b/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx
index 0dc206f2b0f..35f286c870d 100644
--- a/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx
+++ b/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx
@@ -12,6 +12,8 @@ import { EUserWorkspaceRoles } from "@/constants/workspace";
 import { useUser } from "@/hooks/store";
 // plane web constants
 import { WORKSPACE_SETTINGS_LINKS } from "@/plane-web/constants/workspace";
+// plane web helpers
+import { filterWorkspaceSettingLinks } from "@/plane-web/helpers/workspace.helper";
 
 export const WorkspaceSettingsSidebar = observer(() => {
   // router
@@ -22,6 +24,7 @@ export const WorkspaceSettingsSidebar = observer(() => {
     membership: { currentWorkspaceRole },
   } = useUser();
 
+  // derived values
   const workspaceMemberInfo = currentWorkspaceRole || EUserWorkspaceRoles.GUEST;
 
   return (
@@ -31,6 +34,7 @@ export const WorkspaceSettingsSidebar = observer(() => {
         <div className="flex w-full flex-col gap-1">
           {WORKSPACE_SETTINGS_LINKS.map(
             (link) =>
+              filterWorkspaceSettingLinks(link.key) &&
               workspaceMemberInfo >= link.access && (
                 <Link key={link.key} href={`/${workspaceSlug}${link.href}`}>
                   <SidebarNavItem
diff --git a/web/ce/helpers/workspace.helper.ts b/web/ce/helpers/workspace.helper.ts
new file mode 100644
index 00000000000..649ff877e4c
--- /dev/null
+++ b/web/ce/helpers/workspace.helper.ts
@@ -0,0 +1,2 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+export const filterWorkspaceSettingLinks = (settingKey: string) => true;
diff --git a/web/core/components/command-palette/actions/workspace-settings-actions.tsx b/web/core/components/command-palette/actions/workspace-settings-actions.tsx
index 109257ed133..e21cb3d2cbb 100644
--- a/web/core/components/command-palette/actions/workspace-settings-actions.tsx
+++ b/web/core/components/command-palette/actions/workspace-settings-actions.tsx
@@ -11,6 +11,8 @@ import { useUser } from "@/hooks/store";
 import { useAppRouter } from "@/hooks/use-app-router";
 // plane wev constants
 import { WORKSPACE_SETTINGS_LINKS } from "@/plane-web/constants/workspace";
+// plane web helpers
+import { filterWorkspaceSettingLinks } from "@/plane-web/helpers/workspace.helper";
 
 type Props = {
   closePalette: () => void;
@@ -38,7 +40,8 @@ export const CommandPaletteWorkspaceSettingsActions: React.FC<Props> = (props) =
     <>
       {WORKSPACE_SETTINGS_LINKS.map(
         (setting) =>
-          workspaceMemberInfo >= setting.access && (
+          workspaceMemberInfo >= setting.access &&
+          filterWorkspaceSettingLinks(setting.key) && (
             <Command.Item
               key={setting.key}
               onSelect={() => redirect(`/${workspaceSlug}${setting.href}`)}
diff --git a/web/core/lib/store-context.tsx b/web/core/lib/store-context.tsx
index cbee8b2dac6..f06dfb4d838 100644
--- a/web/core/lib/store-context.tsx
+++ b/web/core/lib/store-context.tsx
@@ -15,7 +15,6 @@ const initializeStore = () => {
   return newRootStore;
 };
 
-export const StoreProvider = ({ children }: { children: ReactElement }) => {
-  const store = initializeStore();
-  return <StoreContext.Provider value={store}>{children}</StoreContext.Provider>;
-};
+export const store = initializeStore();
+
+export const StoreProvider = ({ children }: { children: ReactElement }) => <StoreContext.Provider value={store}>{children}</StoreContext.Provider>;
diff --git a/web/ee/helpers/workspace.helper.ts b/web/ee/helpers/workspace.helper.ts
new file mode 100644
index 00000000000..731cd07dc4b
--- /dev/null
+++ b/web/ee/helpers/workspace.helper.ts
@@ -0,0 +1 @@
+export * from "ce/helpers/workspace.helper";

From c1a1f916adcc428c519f17530e8e691f7b130788 Mon Sep 17 00:00:00 2001
From: Prateek Shourya <prateekshourya29@gmail.com>
Date: Wed, 4 Sep 2024 17:07:02 +0530
Subject: [PATCH 2/2] chore: update `filterWorkspaceSettingLinks` to
 `shouldRenderSettingLink`.

---
 .../(projects)/settings/mobile-header-tabs.tsx                | 4 ++--
 web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx       | 4 ++--
 web/ce/helpers/workspace.helper.ts                            | 2 +-
 .../command-palette/actions/workspace-settings-actions.tsx    | 4 ++--
 4 files changed, 7 insertions(+), 7 deletions(-)

diff --git a/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx b/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx
index 404306115d8..a672cc2ca4b 100644
--- a/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx
+++ b/web/app/[workspaceSlug]/(projects)/settings/mobile-header-tabs.tsx
@@ -7,7 +7,7 @@ import { useAppRouter } from "@/hooks/use-app-router";
 // plane web constants
 import { WORKSPACE_SETTINGS_LINKS } from "@/plane-web/constants/workspace";
 // plane web helpers
-import { filterWorkspaceSettingLinks } from "@/plane-web/helpers/workspace.helper";
+import { shouldRenderSettingLink } from "@/plane-web/helpers/workspace.helper";
 
 export const MobileWorkspaceSettingsTabs = () => {
   const router = useAppRouter();
@@ -25,7 +25,7 @@ export const MobileWorkspaceSettingsTabs = () => {
     <div className="flex-shrink-0 md:hidden sticky inset-0 flex overflow-x-auto bg-custom-background-100 z-10">
       {WORKSPACE_SETTINGS_LINKS.map(
         (item, index) =>
-          filterWorkspaceSettingLinks(item.key) &&
+          shouldRenderSettingLink(item.key) &&
           workspaceMemberInfo >= item.access && (
             <div
               className={`${item.highlight(pathname, `/${workspaceSlug}`)
diff --git a/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx b/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx
index 35f286c870d..9572d6519b7 100644
--- a/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx
+++ b/web/app/[workspaceSlug]/(projects)/settings/sidebar.tsx
@@ -13,7 +13,7 @@ import { useUser } from "@/hooks/store";
 // plane web constants
 import { WORKSPACE_SETTINGS_LINKS } from "@/plane-web/constants/workspace";
 // plane web helpers
-import { filterWorkspaceSettingLinks } from "@/plane-web/helpers/workspace.helper";
+import { shouldRenderSettingLink } from "@/plane-web/helpers/workspace.helper";
 
 export const WorkspaceSettingsSidebar = observer(() => {
   // router
@@ -34,7 +34,7 @@ export const WorkspaceSettingsSidebar = observer(() => {
         <div className="flex w-full flex-col gap-1">
           {WORKSPACE_SETTINGS_LINKS.map(
             (link) =>
-              filterWorkspaceSettingLinks(link.key) &&
+              shouldRenderSettingLink(link.key) &&
               workspaceMemberInfo >= link.access && (
                 <Link key={link.key} href={`/${workspaceSlug}${link.href}`}>
                   <SidebarNavItem
diff --git a/web/ce/helpers/workspace.helper.ts b/web/ce/helpers/workspace.helper.ts
index 649ff877e4c..bc8c5c1b4f7 100644
--- a/web/ce/helpers/workspace.helper.ts
+++ b/web/ce/helpers/workspace.helper.ts
@@ -1,2 +1,2 @@
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
-export const filterWorkspaceSettingLinks = (settingKey: string) => true;
+export const shouldRenderSettingLink = (settingKey: string) => true;
diff --git a/web/core/components/command-palette/actions/workspace-settings-actions.tsx b/web/core/components/command-palette/actions/workspace-settings-actions.tsx
index e21cb3d2cbb..c2094d296c1 100644
--- a/web/core/components/command-palette/actions/workspace-settings-actions.tsx
+++ b/web/core/components/command-palette/actions/workspace-settings-actions.tsx
@@ -12,7 +12,7 @@ import { useAppRouter } from "@/hooks/use-app-router";
 // plane wev constants
 import { WORKSPACE_SETTINGS_LINKS } from "@/plane-web/constants/workspace";
 // plane web helpers
-import { filterWorkspaceSettingLinks } from "@/plane-web/helpers/workspace.helper";
+import { shouldRenderSettingLink } from "@/plane-web/helpers/workspace.helper";
 
 type Props = {
   closePalette: () => void;
@@ -41,7 +41,7 @@ export const CommandPaletteWorkspaceSettingsActions: React.FC<Props> = (props) =
       {WORKSPACE_SETTINGS_LINKS.map(
         (setting) =>
           workspaceMemberInfo >= setting.access &&
-          filterWorkspaceSettingLinks(setting.key) && (
+          shouldRenderSettingLink(setting.key) && (
             <Command.Item
               key={setting.key}
               onSelect={() => redirect(`/${workspaceSlug}${setting.href}`)}