snapshot of https://github.com/makeplane/plane.git @ d868349a55de79979eb8b98701bf1702c67ad634 (2026-09-15)

apps/web/core/components/navigation/use-tab-preferences.ts

@@ -0,0 +1,143 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useMemo } from "react";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+import { useMember } from "@/hooks/store/use-member";
+import { useUser } from "@/hooks/store/user";
+import { DEFAULT_TAB_KEY } from "./tab-navigation-utils";
+import type { TTabPreferences } from "./tab-navigation-utils";
+
+export type TTabPreferencesHook = {
+  tabPreferences: TTabPreferences;
+  isLoading: boolean;
+  handleToggleDefaultTab: (tabKey: string) => void;
+  handleHideTab: (tabKey: string) => void;
+  handleShowTab: (tabKey: string) => void;
+};
+
+/**
+ * Custom hook to manage tab preferences for a project
+ * Uses MobX store for state management and API persistence
+ *
+ * @param workspaceSlug - The workspace slug
+ * @param projectId - The project ID
+ * @returns Tab preferences state and handlers
+ */
+export const useTabPreferences = (workspaceSlug: string, projectId: string): TTabPreferencesHook => {
+  const {
+    project: { getProjectUserProperties, updateProjectUserProperties },
+  } = useMember();
+  // const { projectUserInfo } = useUserPermissions();
+  const { data } = useUser();
+
+  // Get member ID from projectUserInfo
+  // const projectMemberInfo = projectUserInfo[workspaceSlug]?.[projectId];
+  const memberId = data?.id || null;
+
+  // Get preferences from store
+  const storePreferences = getProjectUserProperties(projectId);
+  const defaultTab = storePreferences?.preferences?.navigation?.default_tab || DEFAULT_TAB_KEY;
+  const hideInMoreMenu = storePreferences?.preferences?.navigation?.hide_in_more_menu || [];
+
+  // Convert store preferences to component format
+  const tabPreferences: TTabPreferences = useMemo(() => {
+    return {
+      defaultTab,
+      hiddenTabs: hideInMoreMenu,
+    };
+  }, [defaultTab, hideInMoreMenu]);
+
+  const isLoading = !storePreferences && memberId !== null;
+
+  /**
+   * Update preferences via store
+   */
+  const updatePreferences = async (newPreferences: TTabPreferences) => {
+    await updateProjectUserProperties(workspaceSlug, projectId, {
+      preferences: {
+        pages: storePreferences?.preferences?.pages || { block_display: false },
+        navigation: {
+          default_tab: newPreferences.defaultTab,
+          hide_in_more_menu: newPreferences.hiddenTabs,
+        },
+      },
+    });
+  };
+
+  /**
+   * Toggle default tab setting
+   * If tab is already default, resets to work_items; otherwise sets as default
+   */
+  const handleToggleDefaultTab = (tabKey: string) => {
+    const newDefaultTab = tabKey === tabPreferences.defaultTab ? DEFAULT_TAB_KEY : tabKey;
+    const newPreferences = { ...tabPreferences, defaultTab: newDefaultTab };
+    updatePreferences(newPreferences)
+      .then(() => {
+        setToast({
+          type: TOAST_TYPE.SUCCESS,
+          title: "Success!",
+          message: "Default tab updated successfully.",
+        });
+        return;
+      })
+      .catch(() => {
+        setToast({
+          type: TOAST_TYPE.ERROR,
+          title: "Error!",
+          message: "Failed to update default tab. Please try again later.",
+        });
+      });
+  };
+
+  /**
+   * Hide a tab (moves to overflow menu with "Show" option)
+   */
+  const handleHideTab = (tabKey: string) => {
+    const newPreferences = {
+      ...tabPreferences,
+      hiddenTabs: [...tabPreferences.hiddenTabs, tabKey],
+    };
+    try {
+      updatePreferences(newPreferences);
+    } catch (error) {
+      console.error("Error hiding tab:", error);
+      setToast({
+        type: TOAST_TYPE.ERROR,
+        title: "Error!",
+        message: "Failed to hide tab. Please try again later.",
+      });
+    }
+  };
+
+  /**
+   * Show a previously hidden tab (returns to visible pool)
+   */
+  const handleShowTab = (tabKey: string) => {
+    const newPreferences = {
+      ...tabPreferences,
+      hiddenTabs: tabPreferences.hiddenTabs.filter((key) => key !== tabKey),
+    };
+    try {
+      updatePreferences(newPreferences);
+    } catch (error) {
+      console.error("Error showing tab:", error);
+      setToast({
+        type: TOAST_TYPE.ERROR,
+        title: "Error!",
+        message: "Something went wrong. Please try again later.",
+      });
+    }
+  };
+
+  return {
+    tabPreferences,
+    isLoading,
+    handleToggleDefaultTab,
+    handleHideTab,
+    handleShowTab,
+  };
+};