[PE-182] refactor: pages' components and store for scalability (#6283)

* refactor: created a generic base page instance

* refactor: project store hooks

* chore: add missing prop declaration

* refactor: editor page root and body

* refactor: issue embed hook

* chore: update search entity types

* fix: version editor component

* fix: add page to favorites action

---------

Co-authored-by: Prateek Shourya <prateekshourya29@gmail.com>
This commit is contained in:
Aaryan Khandelwal
2024-12-27 20:41:38 +05:30
committed by GitHub
parent 211d5e1cd0
commit 8d7425a3b7
34 changed files with 553 additions and 521 deletions

View File

@@ -1,14 +1,15 @@
import { useContext } from "react";
// mobx store
import { StoreContext } from "@/lib/store-context";
// mobx store
import { IPage } from "@/store/pages/page";
import { TUsePage } from "@/store/pages/base-page";
// store
import { TProjectPage } from "@/store/pages/project-page";
export const usePage = (pageId: string | undefined): IPage => {
export const useProjectPage: TUsePage = (pageId: string | undefined): TProjectPage => {
const context = useContext(StoreContext);
if (context === undefined) throw new Error("usePage must be used within StoreProvider");
if (!pageId) return {} as IPage;
if (!pageId) return {} as TProjectPage;
return context.projectPages.data?.[pageId] ?? {};
};

View File

@@ -1,8 +1,11 @@
import { useState, useEffect, useCallback, useMemo } from "react";
// plane editor
import { EditorReadOnlyRefApi, EditorRefApi, TDocumentEventsServer } from "@plane/editor";
import { DocumentCollaborativeEvents, TDocumentEventsClient, getServerEventName } from "@plane/editor/lib";
// plane ui
import { TOAST_TYPE, setToast } from "@plane/ui";
import { IPage } from "@/store/pages/page";
// store
import { TPageInstance } from "@/store/pages/base-page";
// Better type naming and structure
type CollaborativeAction = {
@@ -14,7 +17,10 @@ type CollaborativeActionEvent =
| { type: "sendMessageToServer"; message: TDocumentEventsServer }
| { type: "receivedMessageFromServer"; message: TDocumentEventsClient };
export const useCollaborativePageActions = (editorRef: EditorRefApi | EditorReadOnlyRefApi | null, page: IPage) => {
export const useCollaborativePageActions = (
editorRef: EditorRefApi | EditorReadOnlyRefApi | null,
page: TPageInstance
) => {
// currentUserAction local state to track if the current action is being processed, a
// local action is basically the action performed by the current user to avoid double operations
const [currentActionBeingProcessed, setCurrentActionBeingProcessed] = useState<TDocumentEventsClient | null>(null);

View File

@@ -8,7 +8,7 @@ import {
// helpers
import { getPageName } from "@/helpers/page.helper";
// hooks
import { useProject, usePage, useProjectView, useCycle, useModule } from "@/hooks/store";
import { useProject, useProjectPage, useProjectView, useCycle, useModule } from "@/hooks/store";
export const useFavoriteItemDetails = (workspaceSlug: string, favorite: IFavorite) => {
const favoriteItemId = favorite?.entity_data?.id;
@@ -23,7 +23,7 @@ export const useFavoriteItemDetails = (workspaceSlug: string, favorite: IFavorit
const { getModuleById } = useModule();
// derived values
const pageDetail = usePage(favoriteItemId ?? "");
const pageDetail = useProjectPage(favoriteItemId ?? "");
const viewDetails = getViewById(favoriteItemId ?? "");
const cycleDetail = getCycleById(favoriteItemId ?? "");
const moduleDetail = getModuleById(favoriteItemId ?? "");