feat: support publish

Author: qinluhe

src/@types/translations/en.json

@@ -508,6 +508,8 @@
         "namespaceLengthAtLeast2Characters": "The namespace must be at least 2 characters long",
         "onlyWorkspaceOwnerCanUpdateNamespace": "Only workspace owner can update the namespace",
         "onlyWorkspaceOwnerCanRemoveHomepage": "Only workspace owner can remove the homepage",
+        "onlyWorkspaceOwnerCanChangeHomepage": "Only workspace owner can change the homepage",
+        "onlyProCanSetHomepage": "Only Pro Plan workspace owner can set the homepage",
         "setHomepageFailed": "Failed to set homepage",
         "namespaceTooLong": "The namespace is too long, please try another one",
         "namespaceTooShort": "The namespace is too short, please try another one",
@@ -3042,5 +3044,8 @@
   "memberCount_many": "{{count}} members",
   "memberCount_other": "{{count}} members",
   "aiMatch": "AI match",
-  "titleMatch": "Title match"
+  "titleMatch": "Title match",
+  "namespace": "Namespace",
+  "manageNamespaceDescription": "Manage your namespace and homepage",
+  "homepage": "Homepage"
 }

src/application/services/js-services/http/http_api.ts

@@ -21,7 +21,13 @@ import {
   CreateSpacePayload,
   UpdateSpacePayload,
   Role,
-  WorkspaceMember, QuickNote, QuickNoteEditorData, CreateWorkspacePayload, UpdateWorkspacePayload,
+  WorkspaceMember,
+  QuickNote,
+  QuickNoteEditorData,
+  CreateWorkspacePayload,
+  UpdateWorkspacePayload,
+  PublishViewPayload,
+  UploadPublishNamespacePayload,
 } from '@/application/types';
 import { GlobalComment, Reaction } from '@/application/comment.type';
 import { initGrantService, refreshToken } from '@/application/services/js-services/http/gotrue';
@@ -328,6 +334,48 @@ export async function getUserWorkspaceInfo (): Promise<{
   return Promise.reject(data);
 }
 
+export async function publishView (workspaceId: string, viewId: string, payload?: PublishViewPayload) {
+  const url = `/api/workspace/${workspaceId}/page-view/${viewId}/publish`;
+  const response = await axiosInstance?.post<{
+    code: number;
+    message: string;
+  }>(url, payload);
+
+  if (response?.data.code === 0) {
+    return;
+  }
+
+  return Promise.reject(response?.data);
+}
+
+export async function unpublishView (workspaceId: string, viewId: string) {
+  const url = `/api/workspace/${workspaceId}/page-view/${viewId}/unpublish`;
+  const response = await axiosInstance?.delete<{
+    code: number;
+    message: string;
+  }>(url);
+
+  if (response?.data.code === 0) {
+    return;
+  }
+
+  return Promise.reject(response?.data);
+}
+
+export async function updatePublishNamespace (workspaceId: string, payload: UploadPublishNamespacePayload) {
+  const url = `/api/workspace/${workspaceId}/publish-namespace`;
+  const response = await axiosInstance?.put<{
+    code: number;
+    message: string;
+  }>(url, payload);
+
+  if (response?.data.code === 0) {
+    return;
+  }
+
+  return Promise.reject(response?.data);
+}
+
 export async function getPublishViewMeta (namespace: string, publishName: string) {
   const url = `/api/workspace/v1/published/${namespace}/${publishName}`;
   const response = await axiosInstance?.get<{
@@ -491,6 +539,9 @@ export async function getPublishInfoWithViewId (viewId: string) {
     data?: {
       namespace: string;
       publish_name: string;
+      publisher_email: string;
+      view_id: string;
+      publish_timestamp: string;
     };
     message: string;
   }>(url);
@@ -596,6 +647,75 @@ export async function getView (workspaceId: string, viewId: string, depth: numbe
   return Promise.reject(data);
 }
 
+export async function getPublishNamespace (workspaceId: string) {
+  const url = `/api/workspace/${workspaceId}/publish-namespace`;
+  const response = await axiosInstance?.get<{
+    code: number;
+    data?: string;
+    message: string;
+  }>(url);
+
+  const data = response?.data;
+
+  if (data?.code === 0 && data.data) {
+    return data.data;
+  }
+
+  return Promise.reject(data);
+}
+
+export async function getPublishHomepage (workspaceId: string) {
+  const url = `/api/workspace/${workspaceId}/publish-default`;
+  const response = await axiosInstance?.get<{
+    code: number;
+    data?: {
+      namespace: string;
+      publish_name: string;
+      publisher_email: string;
+      view_id: string;
+    };
+    message: string;
+  }>(url);
+
+  const data = response?.data;
+
+  if (data?.code === 0 && data.data) {
+    return data.data;
+  }
+
+  return Promise.reject(data);
+}
+
+export async function updatePublishHomepage (workspaceId: string, viewId: string) {
+  const url = `/api/workspace/${workspaceId}/publish-default`;
+  const response = await axiosInstance?.put<{
+    code: number;
+    message: string;
+  }>(url, {
+    view_id: viewId,
+  });
+
+  if (response?.data.code === 0) {
+    return;
+  }
+
+  return Promise.reject(response?.data);
+}
+
+export async function removePublishHomepage (workspaceId: string) {
+  const url = `/api/workspace/${workspaceId}/publish-default`;
+  const response = await axiosInstance?.delete<{
+    code: number;
+    message: string;
+  }>(url);
+
+  if (response?.data.code === 0) {
+    return;
+  }
+
+  return Promise.reject(response?.data);
+}
+
 export async function getPublishOutline (publishNamespace: string) {
   const url = `/api/workspace/published-outline/${publishNamespace}`;
   const response = await axiosInstance?.get<{

src/application/services/js-services/index.ts

@@ -31,9 +31,9 @@ import {
 import {
   CreatePagePayload, CreateSpacePayload, CreateWorkspacePayload,
   DatabaseRelations,
-  DuplicatePublishView, QuickNoteEditorData,
+  DuplicatePublishView, PublishViewPayload, QuickNoteEditorData,
   SubscriptionInterval, SubscriptionPlan,
-  Types, UpdatePagePayload, UpdateSpacePayload, UpdateWorkspacePayload, WorkspaceMember,
+  Types, UpdatePagePayload, UpdateSpacePayload, UpdateWorkspacePayload, UploadPublishNamespacePayload, WorkspaceMember,
   YjsEditorKey,
 } from '@/application/types';
 import { applyYDoc } from '@/application/ydoc/apply';
@@ -65,6 +65,43 @@ export class AFClientService implements AFService {
     return this.clientId;
   }
 
+  async publishView (workspaceId: string, viewId: string, payload?: PublishViewPayload) {
+    if (this.publishViewInfo.has(viewId)) {
+      this.publishViewInfo.delete(viewId);
+    }
+
+    return APIService.publishView(workspaceId, viewId, payload);
+  }
+
+  async unpublishView (workspaceId: string, viewId: string) {
+    if (this.publishViewInfo.has(viewId)) {
+      this.publishViewInfo.delete(viewId);
+    }
+
+    return APIService.unpublishView(workspaceId, viewId);
+  }
+
+  async updatePublishNamespace (workspaceId: string, payload: UploadPublishNamespacePayload) {
+    this.publishViewInfo.clear();
+    return APIService.updatePublishNamespace(workspaceId, payload);
+  }
+
+  async getPublishNamespace (workspaceId: string) {
+    return APIService.getPublishNamespace(workspaceId);
+  }
+
+  async getPublishHomepage (workspaceId: string) {
+    return APIService.getPublishHomepage(workspaceId);
+  }
+
+  async updatePublishHomepage (workspaceId: string, viewId: string) {
+    return APIService.updatePublishHomepage(workspaceId, viewId);
+  }
+
+  async removePublishHomepage (workspaceId: string) {
+    return APIService.removePublishHomepage(workspaceId);
+  }
+
   async getPublishViewMeta (namespace: string, publishName: string) {
     const name = `${namespace}_${publishName}`;
 
@@ -165,6 +202,9 @@ export class AFClientService implements AFService {
       return this.publishViewInfo.get(viewId) as {
         namespace: string;
         publishName: string;
+        publisherEmail: string;
+        viewId: string;
+        publishedAt: string;
       };
     }
 
@@ -179,6 +219,9 @@ export class AFClientService implements AFService {
     const data = {
       namespace,
       publishName: info.publish_name,
+      publisherEmail: info.publisher_email,
+      viewId: info.view_id,
+      publishedAt: info.publish_timestamp,
     };
 
     this.publishViewInfo.set(viewId, data);
@@ -569,7 +612,7 @@ export class AFClientService implements AFService {
     return APIService.deleteQuickNote(workspaceId, id);
   }
 
-  searchWorkspace(workspaceId: string, query: string) {
+  searchWorkspace (workspaceId: string, query: string) {
     return APIService.searchWorkspace(workspaceId, query);
   }
 }

src/application/services/services.type.ts

@@ -19,7 +19,12 @@ import {
   UpdateSpacePayload,
   WorkspaceMember,
   QuickNoteEditorData,
-  QuickNote, Subscription, CreateWorkspacePayload, UpdateWorkspacePayload,
+  QuickNote,
+  Subscription,
+  CreateWorkspacePayload,
+  UpdateWorkspacePayload,
+  PublishViewPayload,
+  UploadPublishNamespacePayload,
 } from '@/application/types';
 import { GlobalComment, Reaction } from '@/application/comment.type';
 import { ViewMeta } from '@/application/db/tables/view_metas';
@@ -138,11 +143,22 @@ export interface TemplateService {
 }
 
 export interface PublishService {
-
+  publishView: (workspaceId: string, viewId: string, payload?: PublishViewPayload) => Promise<void>;
+  unpublishView: (workspaceId: string, viewId: string) => Promise<void>;
+  updatePublishNamespace: (workspaceId: string, payload: UploadPublishNamespacePayload) => Promise<void>;
   getPublishViewMeta: (namespace: string, publishName: string) => Promise<ViewMeta>;
   getPublishView: (namespace: string, publishName: string) => Promise<YDoc>;
   getPublishRowDocument: (viewId: string) => Promise<YDoc>;
-  getPublishInfo: (viewId: string) => Promise<{ namespace: string; publishName: string }>;
+  getPublishInfo: (viewId: string) => Promise<{
+    namespace: string;
+    publishName: string,
+    publisherEmail: string,
+    publishedAt: string
+  }>;
+  getPublishNamespace: (namespace: string) => Promise<string>;
+  getPublishHomepage: (workspaceId: string) => Promise<{ view_id: string }>;
+  updatePublishHomepage: (workspaceId: string, viewId: string) => Promise<void>;
+  removePublishHomepage: (workspaceId: string) => Promise<void>;
 
   getPublishOutline (namespace: string): Promise<View[]>;
 

src/application/types.ts

@@ -684,6 +684,16 @@ export enum CollabOrigin {
 
 }
 
+export interface PublishViewPayload {
+  publish_name?: string;
+  visible_database_view_ids?: string[];
+}
+
+export interface UploadPublishNamespacePayload {
+  old_namespace: string;
+  new_namespace: string;
+}
+
 export const layoutMap = {
   [ViewLayout.Document]: 'document',
   [ViewLayout.Grid]: 'grid',
@@ -1020,4 +1030,11 @@ export interface CreateWorkspacePayload {
 
 export interface UpdateWorkspacePayload {
   workspace_name: string;
+}
+
+export enum SettingMenuItem {
+  ACCOUNT = 'ACCOUNT',
+  WORKSPACE = 'WORKSPACE',
+  MEMBERS = 'MEMBERS',
+  SITES = 'SITES',
 }

src/components/_shared/modal/NormalModal.tsx

@@ -7,7 +7,7 @@ import { ReactComponent as CloseIcon } from '@/assets/close.svg';
 // @ts-ignore
 export interface NormalModalProps extends DialogProps {
   okText?: string;
-  cancelText?: string;
+  cancelText?: string | React.ReactNode;
   onOk?: () => void;
   onCancel?: () => void;
   danger?: boolean;
@@ -17,6 +17,7 @@ export interface NormalModalProps extends DialogProps {
   cancelButtonProps?: ButtonProps;
   okLoading?: boolean;
   closable?: boolean;
+  overflowHidden?: boolean;
 }
 
 export function NormalModal ({
@@ -32,6 +33,7 @@ export function NormalModal ({
   cancelButtonProps,
   okLoading,
   closable = true,
+  overflowHidden = false,
   ...dialogProps
 }: NormalModalProps) {
   const { t } = useTranslation();
@@ -51,7 +53,12 @@ export function NormalModal ({
       }}
       {...dialogProps}
     >
-      <div className={'relative flex flex-col gap-4 p-5'}>
+      <div
+        style={{
+          overflow: overflowHidden ? 'hidden' : 'auto',
+        }}
+        className={'relative flex flex-col gap-4 p-5'}
+      >
         <div className={'flex w-full items-center justify-between text-base font-medium'}>
           <div className={'flex-1 text-center font-medium truncate'}>{title}</div>
           {closable && <div className={'relative -right-1.5'}>
@@ -67,7 +74,12 @@ export function NormalModal ({
 
         </div>
 
-        <div className={'flex-1'}>{children}</div>
+        <div
+          style={{
+            overflow: overflowHidden ? 'hidden' : 'auto',
+          }}
+          className={'flex-1 w-full'}
+        >{children}</div>
         <div className={'flex w-full justify-end gap-3'}>
           <Button
             color={'inherit'}

src/components/_shared/outline/OutlineItemContent.tsx

@@ -6,7 +6,7 @@ import React, { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 import PageIcon from '@/components/_shared/view-icon/PageIcon';
 
-function OutlineItemContent({
+function OutlineItemContent ({
   item,
   setIsExpanded,
   navigateToView,
@@ -53,7 +53,11 @@ function OutlineItemContent({
           value={extra.space_icon || ''}
           char={extra.space_icon ? undefined : name.slice(0, 1)}
         /> :
-        <PageIcon view={item} className={'flex h-5 w-5 min-w-5 items-center justify-center'}/>
+        <PageIcon
+          view={item}
+          iconSize={16}
+          className={'flex w-4 h-4 text-sm items-center justify-center'}
+        />
       }
 
       <Tooltip