feat: reset to default view, and create new default view

apps/app/contexts/theme.context.tsx

@@ -9,13 +9,14 @@ import {
   SET_GROUP_BY_PROPERTY,
   SET_ORDER_BY_PROPERTY,
   SET_FILTER_ISSUES,
+  RESET_TO_DEFAULT,
 } from "constants/theme.context.constants";
 // components
 import ToastAlert from "components/toast-alert";
 // hooks
 import useUser from "lib/hooks/useUser";
 // constants
-import { PROJECT_MEMBERS, USER_PROJECT_VIEW } from "constants/fetch-keys";
+import { USER_PROJECT_VIEW } from "constants/fetch-keys";
 // services
 import projectService from "lib/services/project.service";
 
@@ -31,7 +32,8 @@ type ReducerActionType = {
     | typeof SET_ISSUE_VIEW
     | typeof SET_ORDER_BY_PROPERTY
     | typeof SET_FILTER_ISSUES
-    | typeof SET_GROUP_BY_PROPERTY;
+    | typeof SET_GROUP_BY_PROPERTY
+    | typeof RESET_TO_DEFAULT;
   payload?: Partial<Theme>;
 };
 
@@ -46,6 +48,8 @@ type ContextType = {
   setGroupByProperty: (property: NestedKeyOf<IIssue> | null) => void;
   setOrderBy: (property: NestedKeyOf<IIssue> | null) => void;
   setFilterIssue: (property: "activeIssue" | "backlogIssue" | null) => void;
+  resetFilterToDefault: () => void;
+  setNewFilterDefaultView: () => void;
 };
 
 type StateType = Theme;
@@ -70,8 +74,7 @@ export const reducer: ReducerFunctionType = (state, action) => {
       };
       return newState;
     case REHYDRATE_THEME: {
-      const newState = payload;
-      return { ...initialState, ...newState };
+      return { ...initialState, ...payload };
     }
     case SET_ISSUE_VIEW: {
       const newState = {
@@ -113,6 +116,12 @@ export const reducer: ReducerFunctionType = (state, action) => {
         ...newState,
       };
     }
+    case RESET_TO_DEFAULT: {
+      return {
+        ...initialState,
+        ...payload,
+      };
+    }
     default: {
       return state;
     }
@@ -120,18 +129,27 @@ export const reducer: ReducerFunctionType = (state, action) => {
 };
 
 const saveDataToServer = async (workspaceSlug: string, projectID: string, state: any) => {
-  await projectService.setProjectView(workspaceSlug, projectID, state);
+  await projectService.setProjectView(workspaceSlug, projectID, {
+    view_props: state,
+  });
+};
+
+const setNewDefault = async (workspaceSlug: string, projectID: string, state: any) => {
+  await projectService.setProjectView(workspaceSlug, projectID, {
+    view_props: state,
+    default_props: state,
+  });
 };
 
 export const ThemeContextProvider: React.FC<{ children: React.ReactNode }> = ({ children }) => {
   const [state, dispatch] = useReducer(reducer, initialState);
 
-  const { activeProject, activeWorkspace, user } = useUser();
+  const { activeProject, activeWorkspace } = useUser();
 
-  const { data: projectMember } = useSWR(
-    activeWorkspace && activeProject ? PROJECT_MEMBERS(activeProject.id) : null,
+  const { data: myViewProps, mutate: mutateMyViewProps } = useSWR(
+    activeWorkspace && activeProject ? USER_PROJECT_VIEW(activeProject.id) : null,
     activeWorkspace && activeProject
-      ? () => projectService.projectMembers(activeWorkspace.slug, activeProject.id)
+      ? () => projectService.projectMemberMe(activeWorkspace.slug, activeProject.id)
       : null
   );
 
@@ -191,6 +209,7 @@ export const ThemeContextProvider: React.FC<{ children: React.ReactNode }> = ({
     },
     [activeProject, activeWorkspace, state]
   );
+
   const setFilterIssue = useCallback(
     (property: "activeIssue" | "backlogIssue" | null) => {
       dispatch({
@@ -209,12 +228,30 @@ export const ThemeContextProvider: React.FC<{ children: React.ReactNode }> = ({
     [activeProject, activeWorkspace, state]
   );
 
+  const setNewDefaultView = useCallback(() => {
+    if (!activeWorkspace || !activeProject) return;
+    setNewDefault(activeWorkspace.slug, activeProject.id, state);
+  }, [activeProject, activeWorkspace, state]);
+
+  const resetToDefault = useCallback(() => {
+    dispatch({
+      type: RESET_TO_DEFAULT,
+      payload: myViewProps?.default_props,
+    });
+    if (!activeWorkspace || !activeProject) return;
+    saveDataToServer(activeWorkspace.slug, activeProject.id, myViewProps?.default_props).then(
+      () => {
+        mutateMyViewProps();
+      }
+    );
+  }, [activeProject, activeWorkspace, myViewProps, mutateMyViewProps]);
+
   useEffect(() => {
     dispatch({
       type: REHYDRATE_THEME,
-      payload: projectMember?.find((member) => member.member.id === user?.id)?.view_props,
+      payload: myViewProps?.view_props,
     });
-  }, [projectMember, user]);
+  }, [myViewProps]);
 
   return (
     <themeContext.Provider
@@ -229,6 +266,8 @@ export const ThemeContextProvider: React.FC<{ children: React.ReactNode }> = ({
         setOrderBy,
         filterIssue: state.filterIssue,
         setFilterIssue,
+        resetFilterToDefault: resetToDefault,
+        setNewFilterDefaultView: setNewDefaultView,
       }}
     >
       <ToastAlert />