[WEB-3998] feat: settings page revamp

apiserver/plane/app/serializers/user.py

@@ -99,11 +99,16 @@ def get_workspace(self, obj):
                 workspace_member__member=obj.id,
                 workspace_member__is_active=True,
             ).first()
+            logo_asset_url = workspace.logo_asset.asset_url if workspace.logo_asset is not None else ""
             return {
                 "last_workspace_id": profile.last_workspace_id,
                 "last_workspace_slug": (
                     workspace.slug if workspace is not None else ""
                 ),
+                "last_workspace_name": (
+                    workspace.name if workspace is not None else ""
+                ),
+                "last_workspace_logo": (logo_asset_url),
                 "fallback_workspace_id": profile.last_workspace_id,
                 "fallback_workspace_slug": (
                     workspace.slug if workspace is not None else ""

apiserver/plane/app/views/workspace/base.py

@@ -3,6 +3,7 @@
 import io
 import os
 from datetime import date
+import uuid
 
 from dateutil.relativedelta import relativedelta
 from django.db import IntegrityError
@@ -35,6 +36,7 @@
     Workspace,
     WorkspaceMember,
     WorkspaceTheme,
+    Profile
 )
 from plane.app.permissions import ROLE, allow_permission
 from django.utils.decorators import method_decorator
@@ -150,8 +152,19 @@ def list(self, request, *args, **kwargs):
     def partial_update(self, request, *args, **kwargs):
         return super().partial_update(request, *args, **kwargs)
 
+
+    def remove_last_workspace_ids_from_user_settings(self, id: uuid.UUID) -> None:
+        """
+        Remove the last workspace id from the user settings
+        """
+        Profile.objects.filter(last_workspace_id=id).update(last_workspace_id=None)
+        return
+
     @allow_permission([ROLE.ADMIN], level="WORKSPACE")
     def destroy(self, request, *args, **kwargs):
+        # Get the workspace
+        workspace = self.get_object()
+        self.remove_last_workspace_ids_from_user_settings(workspace.id)
         return super().destroy(request, *args, **kwargs)
 
 

packages/constants/src/index.ts

@@ -32,5 +32,6 @@ export * from "./dashboard";
 export * from "./page";
 export * from "./emoji";
 export * from "./subscription";
+export * from "./settings";
 export * from "./icon";
 export * from "./analytics-v2";

packages/constants/src/profile.ts

@@ -1,39 +1,53 @@
-export const PROFILE_ACTION_LINKS: {
-  key: string;
-  i18n_label: string;
-  href: string;
-  highlight: (pathname: string) => boolean;
-}[] = [
-  {
+export const PROFILE_SETTINGS = {
+  profile: {
     key: "profile",
     i18n_label: "profile.actions.profile",
-    href: `/profile`,
-    highlight: (pathname: string) => pathname === "/profile/",
+    href: `/settings/account`,
+    highlight: (pathname: string) => pathname === "/settings/account/",
   },
-  {
+  security: {
     key: "security",
     i18n_label: "profile.actions.security",
-    href: `/profile/security`,
-    highlight: (pathname: string) => pathname === "/profile/security/",
+    href: `/settings/account/security`,
+    highlight: (pathname: string) => pathname === "/settings/account/security/",
   },
-  {
+  activity: {
     key: "activity",
     i18n_label: "profile.actions.activity",
-    href: `/profile/activity`,
-    highlight: (pathname: string) => pathname === "/profile/activity/",
+    href: `/settings/account/activity`,
+    highlight: (pathname: string) => pathname === "/settings/account/activity/",
   },
-  {
-    key: "appearance",
-    i18n_label: "profile.actions.appearance",
-    href: `/profile/appearance`,
-    highlight: (pathname: string) => pathname.includes("/profile/appearance"),
+  preferences: {
+    key: "preferences",
+    i18n_label: "profile.actions.preferences",
+    href: `/settings/account/preferences`,
+    highlight: (pathname: string) => pathname === "/settings/account/preferences",
   },
-  {
+  notifications: {
     key: "notifications",
     i18n_label: "profile.actions.notifications",
-    href: `/profile/notifications`,
-    highlight: (pathname: string) => pathname === "/profile/notifications/",
+    href: `/settings/account/notifications`,
+    highlight: (pathname: string) => pathname === "/settings/account/notifications/",
+  },
+  "api-tokens": {
+    key: "api-tokens",
+    i18n_label: "profile.actions.api-tokens",
+    href: `/settings/account/api-tokens`,
+    highlight: (pathname: string) => pathname === "/settings/account/api-tokens/",
   },
+};
+export const PROFILE_ACTION_LINKS: {
+  key: string;
+  i18n_label: string;
+  href: string;
+  highlight: (pathname: string) => boolean;
+}[] = [
+  PROFILE_SETTINGS["profile"],
+  PROFILE_SETTINGS["security"],
+  PROFILE_SETTINGS["activity"],
+  PROFILE_SETTINGS["preferences"],
+  PROFILE_SETTINGS["notifications"],
+  PROFILE_SETTINGS["api-tokens"],
 ];
 
 export const PROFILE_VIEWER_TAB = [
@@ -72,6 +86,23 @@ export const PROFILE_ADMINS_TAB = [
   },
 ];
 
+export const PREFERENCE_OPTIONS: {
+  id: string;
+  title: string;
+  description: string;
+}[] = [
+  {
+    id: "theme",
+    title: "theme",
+    description: "select_or_customize_your_interface_color_scheme",
+  },
+  {
+    id: "start_of_week",
+    title: "First day of the week",
+    description: "This will change how all calendars in your app look.",
+  },
+];
+
 /**
  * @description The start of the week for the user
  * @enum {number}

packages/constants/src/settings.ts

@@ -0,0 +1,52 @@
+import { PROFILE_SETTINGS } from ".";
+import { WORKSPACE_SETTINGS } from "./workspace";
+
+export enum WORKSPACE_SETTINGS_CATEGORY {
+  ADMINISTRATION = "administration",
+  FEATURES = "features",
+  DEVELOPER = "developer",
+}
+
+export enum PROFILE_SETTINGS_CATEGORY {
+  YOUR_PROFILE = "your profile",
+  DEVELOPER = "developer",
+}
+
+export enum PROJECT_SETTINGS_CATEGORY {
+  PROJECTS = "projects",
+}
+
+export const WORKSPACE_SETTINGS_CATEGORIES = [
+  WORKSPACE_SETTINGS_CATEGORY.ADMINISTRATION,
+  WORKSPACE_SETTINGS_CATEGORY.FEATURES,
+  WORKSPACE_SETTINGS_CATEGORY.DEVELOPER,
+];
+
+export const PROFILE_SETTINGS_CATEGORIES = [
+  PROFILE_SETTINGS_CATEGORY.YOUR_PROFILE,
+  PROFILE_SETTINGS_CATEGORY.DEVELOPER,
+];
+
+export const PROJECT_SETTINGS_CATEGORIES = [PROJECT_SETTINGS_CATEGORY.PROJECTS];
+
+export const GROUPED_WORKSPACE_SETTINGS = {
+  [WORKSPACE_SETTINGS_CATEGORY.ADMINISTRATION]: [
+    WORKSPACE_SETTINGS["general"],
+    WORKSPACE_SETTINGS["members"],
+    WORKSPACE_SETTINGS["billing-and-plans"],
+    WORKSPACE_SETTINGS["export"],
+  ],
+  [WORKSPACE_SETTINGS_CATEGORY.FEATURES]: [],
+  [WORKSPACE_SETTINGS_CATEGORY.DEVELOPER]: [WORKSPACE_SETTINGS["webhooks"]],
+};
+
+export const GROUPED_PROFILE_SETTINGS = {
+  [PROFILE_SETTINGS_CATEGORY.YOUR_PROFILE]: [
+    PROFILE_SETTINGS["profile"],
+    PROFILE_SETTINGS["preferences"],
+    PROFILE_SETTINGS["notifications"],
+    PROFILE_SETTINGS["security"],
+    PROFILE_SETTINGS["activity"],
+  ],
+  [PROFILE_SETTINGS_CATEGORY.DEVELOPER]: [PROFILE_SETTINGS["api-tokens"]],
+};

packages/constants/src/workspace.ts

@@ -114,13 +114,6 @@ export const WORKSPACE_SETTINGS = {
     access: [EUserWorkspaceRoles.ADMIN],
     highlight: (pathname: string, baseUrl: string) => pathname === `${baseUrl}/settings/webhooks/`,
   },
-  "api-tokens": {
-    key: "api-tokens",
-    i18n_label: "workspace_settings.settings.api_tokens.title",
-    href: `/settings/api-tokens`,
-    access: [EUserWorkspaceRoles.ADMIN],
-    highlight: (pathname: string, baseUrl: string) => pathname === `${baseUrl}/settings/api-tokens/`,
-  },
 };
 
 export const WORKSPACE_SETTINGS_ACCESS = Object.fromEntries(
@@ -139,7 +132,6 @@ export const WORKSPACE_SETTINGS_LINKS: {
   WORKSPACE_SETTINGS["billing-and-plans"],
   WORKSPACE_SETTINGS["export"],
   WORKSPACE_SETTINGS["webhooks"],
-  WORKSPACE_SETTINGS["api-tokens"],
 ];
 
 export const ROLE = {