chore: use client side for layout and page

space/app/[workspaceSlug]/[projectId]/page.tsx

@@ -32,12 +32,15 @@ const ProjectIssuesPage = (props: Props) => {
     publishService
       .fetchAnchorFromProjectDetails(workspaceSlug, projectId)
       .then((res) => {
-        let url = `/issues/${res.anchor}`;
+        let url = "";
-        const params = new URLSearchParams();
+        if (res.entity_name === "project") {
-        if (board) params.append("board", board);
+          url = `/issues/${res.anchor}`;
-        if (peekId) params.append("peekId", peekId);
+          const params = new URLSearchParams();
-        if (params.toString()) url += `?${params.toString()}`;
+          if (board) params.append("board", board);
-        navigate(url);
+          if (peekId) params.append("peekId", peekId);
+          if (params.toString()) url += `?${params.toString()}`;
+          navigate(url);
+        } else throw Error("Invalid entity name");
       })
       .catch(() => setError(true));
   }, [board, peekId, projectId, workspaceSlug]);

space/app/issues/[anchor]/layout.tsx

@@ -1,23 +1,34 @@
+"use client";
+
+import { observer } from "mobx-react-lite";
 import Image from "next/image";
-import { notFound } from "next/navigation";
+import useSWR from "swr";
 // components
+import { LogoSpinner } from "@/components/common";
 import IssueNavbar from "@/components/issues/navbar";
 // hooks
-import { usePublish } from "@/hooks/store";
+import { usePublish, usePublishList } from "@/hooks/store";
 // assets
 import planeLogo from "@/public/plane-logo.svg";
 
-type Props = { children: React.ReactNode; params: { anchor: string } };
+type Props = {
+  children: React.ReactNode;
+  params: {
+    anchor: string;
+  };
+};
 
-const ProjectIssuesLayout = (props: Props) => {
+const ProjectIssuesLayout = observer((props: Props) => {
   const { children, params } = props;
   // params
   const { anchor } = params;
   // store hooks
+  const { fetchPublishSettings } = usePublishList();
   const publishSettings = usePublish(anchor);
-  const { id, workspace_detail, project } = publishSettings;
+  // fetch publish settings
+  useSWR(anchor ? `PUBLISH_SETTINGS_${anchor}` : null, anchor ? () => fetchPublishSettings(anchor) : null);
 
-  if (!workspace_detail || !project || !id) notFound();
+  if (!publishSettings) return <LogoSpinner />;
 
   return (
     <div className="relative flex h-screen min-h-[500px] w-screen flex-col overflow-hidden">
@@ -40,6 +51,6 @@ const ProjectIssuesLayout = (props: Props) => {
       </a>
     </div>
   );
-};
+});
 
 export default ProjectIssuesLayout;

space/app/issues/[anchor]/page.tsx

@@ -1,11 +1,10 @@
 "use client";
 
 import { useSearchParams } from "next/navigation";
-import useSWR from "swr";
 // components
 import { ProjectDetailsView } from "@/components/views";
 // hooks
-import { usePublish, usePublishList } from "@/hooks/store";
+import { usePublish } from "@/hooks/store";
 
 type Props = {
   params: {
@@ -19,11 +18,8 @@ const ProjectIssuesPage = (props: Props) => {
   // params
   const searchParams = useSearchParams();
   const peekId = searchParams.get("peekId") || undefined;
-  // store hooks
-  const { fetchPublishSettings } = usePublishList();
-  const publishSettings = usePublish(anchor);
 
-  useSWR(anchor ? `PUBLISH_SETTINGS_${anchor}` : null, anchor ? () => fetchPublishSettings(anchor) : null);
+  const publishSettings = usePublish(anchor);
 
   if (!publishSettings) return null;
 

space/app/page/layout.tsx

@@ -1,49 +0,0 @@
-import Image from "next/image";
-import { notFound } from "next/navigation";
-import useSWR from "swr";
-// components
-import IssueNavbar from "@/components/issues/navbar";
-// hooks
-import { usePublish, usePublishList } from "@/hooks/store";
-// assets
-import planeLogo from "@/public/plane-logo.svg";
-
-type Props = { children: React.ReactNode; params: { anchor: string } };
-
-const PageDetailsLayout = (props: Props) => {
-  const { children, params } = props;
-  // params
-  const { anchor } = params;
-  // store hooks
-  const { fetchPublishSettings } = usePublishList();
-  const publishSettings = usePublish(anchor);
-  const { id, workspace_detail, project } = publishSettings;
-
-  useSWR(anchor ? `PUBLISH_SETTINGS_${anchor}` : null, anchor ? () => fetchPublishSettings(anchor) : null);
-
-  if (!workspace_detail || !project || !id) notFound();
-
-  return (
-    <div className="relative flex h-screen min-h-[500px] w-screen flex-col overflow-hidden">
-      <div className="relative flex h-[60px] flex-shrink-0 select-none items-center border-b border-custom-border-300 bg-custom-sidebar-background-100">
-        <IssueNavbar publishSettings={publishSettings} />
-      </div>
-      <div className="relative h-full w-full overflow-hidden bg-custom-background-90">{children}</div>
-      <a
-        href="https://plane.so"
-        className="fixed bottom-2.5 right-5 !z-[999999] flex items-center gap-1 rounded border border-custom-border-200 bg-custom-background-100 px-2 py-1 shadow-custom-shadow-2xs"
-        target="_blank"
-        rel="noreferrer noopener"
-      >
-        <div className="relative grid h-6 w-6 place-items-center">
-          <Image src={planeLogo} alt="Plane logo" className="h-6 w-6" height="24" width="24" />
-        </div>
-        <div className="text-xs">
-          Powered by <span className="font-semibold">Plane Deploy</span>
-        </div>
-      </a>
-    </div>
-  );
-};
-
-export default PageDetailsLayout;

space/app/page/page.tsx

@@ -1,27 +0,0 @@
-"use client";
-
-import useSWR from "swr";
-// hooks
-import { usePublish, usePublishList } from "@/hooks/store";
-
-type Props = {
-  params: {
-    anchor: string;
-  };
-};
-
-const PageDetailsPage = (props: Props) => {
-  const { params } = props;
-  const { anchor } = params;
-  // store hooks
-  const { fetchPublishSettings } = usePublishList();
-  const publishSettings = usePublish(anchor);
-
-  useSWR(anchor ? `PUBLISH_SETTINGS_${anchor}` : null, anchor ? () => fetchPublishSettings(anchor) : null);
-
-  if (!publishSettings) return null;
-
-  return <>Page details</>;
-};
-
-export default PageDetailsPage;

space/components/issues/navbar/controls.tsx

@@ -38,7 +38,7 @@ export const NavbarControls: FC<NavbarControlsProps> = observer((props) => {
   const { getIssueFilters, isIssueFiltersUpdated, initIssueFilters } = useIssueFilter();
   const { setPeekId } = useIssueDetails();
   // derived values
-  const { anchor, views, workspace_detail } = publishSettings;
+  const { anchor, view_props, workspace_detail } = publishSettings;
   const issueFilters = anchor ? getIssueFilters(anchor) : undefined;
   const activeLayout = issueFilters?.display_filters?.layout || undefined;
 
@@ -49,11 +49,11 @@ export const NavbarControls: FC<NavbarControlsProps> = observer((props) => {
       const viewsAcceptable: string[] = [];
       let currentBoard: TIssueLayout | null = null;
 
-      if (views?.list) viewsAcceptable.push("list");
+      if (view_props?.list) viewsAcceptable.push("list");
-      if (views?.kanban) viewsAcceptable.push("kanban");
+      if (view_props?.kanban) viewsAcceptable.push("kanban");
-      if (views?.calendar) viewsAcceptable.push("calendar");
+      if (view_props?.calendar) viewsAcceptable.push("calendar");
-      if (views?.gantt) viewsAcceptable.push("gantt");
+      if (view_props?.gantt) viewsAcceptable.push("gantt");
-      if (views?.spreadsheet) viewsAcceptable.push("spreadsheet");
+      if (view_props?.spreadsheet) viewsAcceptable.push("spreadsheet");
 
       if (board) {
         if (viewsAcceptable.includes(board.toString())) currentBoard = board.toString() as TIssueLayout;
@@ -95,7 +95,7 @@ export const NavbarControls: FC<NavbarControlsProps> = observer((props) => {
     initIssueFilters,
     setPeekId,
     isIssueFiltersUpdated,
-    views,
+    view_props,
     workspace_detail,
   ]);
 

space/services/publish.service.ts

@@ -10,19 +10,14 @@ class PublishService extends APIService {
   }
 
   async fetchPublishSettings(anchor: string): Promise<TPublishSettings> {
-    return this.get(`/api/public/publish-settings/${anchor}/`)
+    return this.get(`/api/public/anchor/${anchor}/settings/`)
       .then((response) => response?.data)
       .catch((error) => {
         throw error?.response;
       });
   }
 
-  async fetchAnchorFromProjectDetails(
+  async fetchAnchorFromProjectDetails(workspaceSlug: string, projectID: string): Promise<TPublishSettings> {
-    workspaceSlug: string,
-    projectID: string
-  ): Promise<{
-    anchor: string;
-  }> {
     return this.get(`/api/public/workspaces/${workspaceSlug}/projects/${projectID}/anchor/`)
       .then((response) => response?.data)
       .catch((error) => {

space/store/publish/publish.store.ts

@@ -3,7 +3,7 @@ import { observable, makeObservable, computed } from "mobx";
 import { RootStore } from "@/store/root.store";
 // types
 import { TProjectDetails, TViewDetails, TWorkspaceDetails } from "@/types/project";
-import { TPublishSettings } from "@/types/publish";
+import { TPublishEntityType, TPublishSettings } from "@/types/publish";
 
 export interface IPublishStore extends TPublishSettings {
   // computed
@@ -19,6 +19,8 @@ export class PublishStore implements IPublishStore {
   comments: boolean;
   created_at: string | undefined;
   created_by: string | undefined;
+  entity_identifier: string | undefined;
+  entity_name: TPublishEntityType | undefined;
   id: string | undefined;
   inbox: unknown;
   project: string | undefined;
@@ -26,7 +28,7 @@ export class PublishStore implements IPublishStore {
   reactions: boolean;
   updated_at: string | undefined;
   updated_by: string | undefined;
-  views: TViewDetails | undefined;
+  view_props: TViewDetails | undefined;
   votes: boolean;
   workspace: string | undefined;
   workspace_detail: TWorkspaceDetails | undefined;
@@ -39,6 +41,8 @@ export class PublishStore implements IPublishStore {
     this.comments = publishSettings.comments;
     this.created_at = publishSettings.created_at;
     this.created_by = publishSettings.created_by;
+    this.entity_identifier = publishSettings.entity_identifier;
+    this.entity_name = publishSettings.entity_name;
     this.id = publishSettings.id;
     this.inbox = publishSettings.inbox;
     this.project = publishSettings.project;
@@ -46,7 +50,7 @@ export class PublishStore implements IPublishStore {
     this.reactions = publishSettings.reactions;
     this.updated_at = publishSettings.updated_at;
     this.updated_by = publishSettings.updated_by;
-    this.views = publishSettings.views;
+    this.view_props = publishSettings.view_props;
     this.votes = publishSettings.votes;
     this.workspace = publishSettings.workspace;
     this.workspace_detail = publishSettings.workspace_detail;
@@ -57,6 +61,8 @@ export class PublishStore implements IPublishStore {
       comments: observable.ref,
       created_at: observable.ref,
       created_by: observable.ref,
+      entity_identifier: observable.ref,
+      entity_name: observable.ref,
       id: observable.ref,
       inbox: observable,
       project: observable.ref,
@@ -64,7 +70,7 @@ export class PublishStore implements IPublishStore {
       reactions: observable.ref,
       updated_at: observable.ref,
       updated_by: observable.ref,
-      views: observable,
+      view_props: observable,
       votes: observable.ref,
       workspace: observable.ref,
       workspace_detail: observable,

space/types/project.d.ts

@@ -22,21 +22,3 @@ export type TProjectDetails = {
   logo_props: TLogoProps;
   description: string;
 };
-
-export type TProjectSettings = {
-  id: string;
-  anchor: string;
-  comments: boolean;
-  reactions: boolean;
-  votes: boolean;
-  inbox: unknown;
-  workspace: string;
-  workspace_detail: TWorkspaceDetails;
-  project: string;
-  project_details: TProjectDetails;
-  views: TViewDetails;
-  created_by: string;
-  updated_by: string;
-  created_at: string;
-  updated_at: string;
-};

space/types/publish.d.ts

@@ -1,10 +1,14 @@
 import { TProjectDetails, TViewDetails, TWorkspaceDetails } from "./project";
 
+export type TPublishEntityType = "project";
+
 export type TPublishSettings = {
   anchor: string | undefined;
   comments: boolean;
   created_at: string | undefined;
   created_by: string | undefined;
+  entity_identifier: string | undefined;
+  entity_name: TPublishEntityType | undefined;
   id: string | undefined;
   inbox: unknown;
   project: string | undefined;
@@ -12,7 +16,7 @@ export type TPublishSettings = {
   reactions: boolean;
   updated_at: string | undefined;
   updated_by: string | undefined;
-  views: TViewDetails | undefined;
+  view_props: TViewDetails | undefined;
   votes: boolean;
   workspace: string | undefined;
   workspace_detail: TWorkspaceDetails | undefined;

web/components/project/publish-project/modal.tsx

@@ -311,11 +311,9 @@ export const PublishProjectModal: React.FC<Props> = observer((props) => {
                       {project.is_deployed && (
                         <>
                           <div className="relative flex items-center gap-2 rounded-md border border-custom-border-100 bg-custom-background-80 px-3 py-2">
-                            <div className="flex-grow truncate text-sm">
+                            <div className="flex-grow truncate text-sm">{`${SPACE_URL}/issues/`}</div>
-                              {`${SPACE_URL}/${workspaceSlug}/${project.id}`}
-                            </div>
                             <div className="relative flex flex-shrink-0 items-center gap-1">
-                              <CopyLinkToClipboard copy_link={`${SPACE_URL}/${workspaceSlug}/${project.id}`} />
+                              <CopyLinkToClipboard copy_link={`${SPACE_URL}/issues`} />
                             </div>
                           </div>
                           <div className="mt-3 flex items-center gap-1 text-custom-primary-100">

web/services/project/project-publish.service.ts

@@ -9,8 +9,8 @@ export class ProjectPublishService extends APIService {
     super(API_BASE_URL);
   }
 
-  async getProjectSettingsAsync(workspace_slug: string, project_slug: string): Promise<any> {
+  async getProjectSettingsAsync(workspaceSlug: string, projectID: string): Promise<IProjectPublishSettings> {
-    return this.get(`/api/workspaces/${workspace_slug}/projects/${project_slug}/project-deploy-boards/`)
+    return this.get(`/api/workspaces/${workspaceSlug}/projects/${projectID}/project-deploy-boards/`)
       .then((response) => response?.data)
       .catch((error) => {
         throw error?.response;
@@ -18,11 +18,11 @@ export class ProjectPublishService extends APIService {
   }
 
   async createProjectSettingsAsync(
-    workspace_slug: string,
+    workspaceSlug: string,
-    project_slug: string,
+    projectID: string,
     data: IProjectPublishSettings
-  ): Promise<any> {
+  ): Promise<IProjectPublishSettings> {
-    return this.post(`/api/workspaces/${workspace_slug}/projects/${project_slug}/project-deploy-boards/`, data)
+    return this.post(`/api/workspaces/${workspaceSlug}/projects/${projectID}/project-deploy-boards/`, data)
       .then((response) => response?.data)
       .catch((error) => {
         throw error?.response;
@@ -30,13 +30,13 @@ export class ProjectPublishService extends APIService {
   }
 
   async updateProjectSettingsAsync(
-    workspace_slug: string,
+    workspaceSlug: string,
-    project_slug: string,
+    projectID: string,
     project_publish_id: string,
     data: IProjectPublishSettings
   ): Promise<any> {
     return this.patch(
-      `/api/workspaces/${workspace_slug}/projects/${project_slug}/project-deploy-boards/${project_publish_id}/`,
+      `/api/workspaces/${workspaceSlug}/projects/${projectID}/project-deploy-boards/${project_publish_id}/`,
       data
     )
       .then((response) => response?.data)
@@ -45,13 +45,9 @@ export class ProjectPublishService extends APIService {
       });
   }
 
-  async deleteProjectSettingsAsync(
+  async deleteProjectSettingsAsync(workspaceSlug: string, projectID: string, project_publish_id: string): Promise<any> {
-    workspace_slug: string,
-    project_slug: string,
-    project_publish_id: string
-  ): Promise<any> {
     return this.delete(
-      `/api/workspaces/${workspace_slug}/projects/${project_slug}/project-deploy-boards/${project_publish_id}/`
+      `/api/workspaces/${workspaceSlug}/projects/${projectID}/project-deploy-boards/${project_publish_id}/`
     )
       .then((response) => response?.data)
       .catch((error) => {

web/store/project/project-publish.store.ts

@@ -28,7 +28,7 @@ export interface IProjectPublishStore {
   // observables
   projectPublishSettings: IProjectPublishSettings | "not-initialized";
   // project settings actions
-  getProjectSettingsAsync: (workspaceSlug: string, projectId: string) => Promise<void>;
+  getProjectSettingsAsync: (workspaceSlug: string, projectId: string) => Promise<IProjectPublishSettings>;
   updateProjectSettingsAsync: (
     workspaceSlug: string,
     projectId: string,
@@ -36,7 +36,11 @@ export interface IProjectPublishStore {
     data: IProjectPublishSettings
   ) => Promise<void>;
   // project publish actions
-  publishProject: (workspaceSlug: string, projectId: string, data: IProjectPublishSettings) => Promise<void>;
+  publishProject: (
+    workspaceSlug: string,
+    projectId: string,
+    data: IProjectPublishSettings
+  ) => Promise<IProjectPublishSettings>;
   unPublishProject: (workspaceSlug: string, projectId: string, projectPublishId: string) => Promise<void>;
 }
 
@@ -85,24 +89,9 @@ export class ProjectPublishStore implements IProjectPublishStore {
         this.fetchSettingsLoader = true;
       });
       const response = await this.projectPublishService.getProjectSettingsAsync(workspaceSlug, projectId);
-      if (response && response.length > 0) {
+      if (response) {
-        const _projectPublishSettings: IProjectPublishSettings = {
-          id: response[0]?.id,
-          comments: response[0]?.comments,
-          reactions: response[0]?.reactions,
-          votes: response[0]?.votes,
-          views: {
-            list: response[0]?.views?.list || false,
-            kanban: response[0]?.views?.kanban || false,
-            calendar: response[0]?.views?.calendar || false,
-            gantt: response[0]?.views?.gantt || false,
-            spreadsheet: response[0]?.views?.spreadsheet || false,
-          },
-          inbox: response[0]?.inbox || null,
-          project: response[0]?.project || null,
-        };
         runInAction(() => {
-          this.projectPublishSettings = _projectPublishSettings;
+          this.projectPublishSettings = response;
           this.fetchSettingsLoader = false;
         });
       } else {
@@ -134,23 +123,13 @@ export class ProjectPublishStore implements IProjectPublishStore {
       });
       const response = await this.projectPublishService.createProjectSettingsAsync(workspaceSlug, projectId, data);
       if (response) {
-        const _projectPublishSettings: IProjectPublishSettings = {
-          id: response?.id || null,
-          comments: response?.comments || false,
-          reactions: response?.reactions || false,
-          votes: response?.votes || false,
-          views: { ...response?.views },
-          inbox: response?.inbox || null,
-          project: response?.project || null,
-        };
-
         runInAction(() => {
-          this.projectPublishSettings = _projectPublishSettings;
+          this.projectPublishSettings = response;
           set(this.projectRootStore.project.projectMap, [projectId, "is_deployed"], true);
           this.generalLoader = false;
         });
-        return response;
       }
+      return response;
     } catch (error) {
       runInAction(() => {
         this.generalLoader = false;

yarn.lock

@@ -9437,6 +9437,11 @@ lucide-react@^0.378.0:
   resolved "https://registry.yarnpkg.com/lucide-react/-/lucide-react-0.378.0.tgz#232acb99c6baedfa90959a2c0dd11327b058bde8"
   integrity sha512-u6EPU8juLUk9ytRcyapkWI18epAv3RU+6+TC23ivjR0e+glWKBobFeSgRwOIJihzktILQuy6E0E80P2jVTDR5g==
 
+lucide-react@^0.379.0:
+  version "0.379.0"
+  resolved "https://registry.yarnpkg.com/lucide-react/-/lucide-react-0.379.0.tgz#29e34eeffae7fb241b64b09868cbe3ab888ef7cc"
+  integrity sha512-KcdeVPqmhRldldAAgptb8FjIunM2x2Zy26ZBh1RsEUcdLIvsEmbcw7KpzFYUy5BbpGeWhPu9Z9J5YXfStiXwhg==
+
 lz-string@^1.5.0:
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/lz-string/-/lz-string-1.5.0.tgz#c1ab50f77887b712621201ba9fd4e3a6ed099941"