From 977b47d35f59f5047ae07273c22313385416fb8f Mon Sep 17 00:00:00 2001 From: Prateek Shourya Date: Fri, 5 Jul 2024 14:58:42 +0530 Subject: [PATCH] [WEB-1843] chore: minor file restructuring. (#5044) --- packages/editor/src/core/types/index.ts | 1 + packages/types/src/pages.d.ts | 2 ++ web/ce/components/pages/editor/embed/index.ts | 2 +- ...embed.tsx => issue-embed-upgrade-card.tsx} | 7 +++--- web/ce/constants/issue.ts | 1 - web/ce/hooks/use-bulk-operation-status.ts | 1 + web/ce/hooks/use-issue-embed.tsx | 24 +++++++++++++++++++ .../gantt-chart/chart/main-content.tsx | 8 ++++--- .../issue-layouts/gantt/base-gantt-root.tsx | 8 ++++--- .../issues/issue-layouts/list/default.tsx | 8 ++++--- .../spreadsheet/spreadsheet-view.tsx | 10 ++++---- .../components/pages/editor/editor-body.tsx | 21 +++++++++------- web/ee/constants/issue.ts | 1 - web/ee/hooks/use-issue-embed.tsx | 1 + 14 files changed, 66 insertions(+), 29 deletions(-) rename web/ce/components/pages/editor/embed/{issue-embed.tsx => issue-embed-upgrade-card.tsx} (78%) delete mode 100644 web/ce/constants/issue.ts create mode 100644 web/ce/hooks/use-bulk-operation-status.ts create mode 100644 web/ce/hooks/use-issue-embed.tsx delete mode 100644 web/ee/constants/issue.ts create mode 100644 web/ee/hooks/use-issue-embed.tsx diff --git a/packages/editor/src/core/types/index.ts b/packages/editor/src/core/types/index.ts index f4dd89412..9e5980531 100644 --- a/packages/editor/src/core/types/index.ts +++ b/packages/editor/src/core/types/index.ts @@ -3,3 +3,4 @@ export * from "./embed"; export * from "./image"; export * from "./mention-suggestion"; export * from "./slash-commands-suggestion"; +export * from "@/plane-editor/types"; diff --git a/packages/types/src/pages.d.ts b/packages/types/src/pages.d.ts index 9b7249bdc..ea9b8b8ea 100644 --- a/packages/types/src/pages.d.ts +++ b/packages/types/src/pages.d.ts @@ -46,3 +46,5 @@ export type TPageFilters = { sortBy: TPageFiltersSortBy; filters?: TPageFilterProps; }; + +export type TPageEmbedType = "mention" | "issue"; diff --git a/web/ce/components/pages/editor/embed/index.ts b/web/ce/components/pages/editor/embed/index.ts index f30596cb0..e16822834 100644 --- a/web/ce/components/pages/editor/embed/index.ts +++ b/web/ce/components/pages/editor/embed/index.ts @@ -1 +1 @@ -export * from "./issue-embed"; +export * from "./issue-embed-upgrade-card"; diff --git a/web/ce/components/pages/editor/embed/issue-embed.tsx b/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx similarity index 78% rename from web/ce/components/pages/editor/embed/issue-embed.tsx rename to web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx index dc06f4f9d..78aac5480 100644 --- a/web/ce/components/pages/editor/embed/issue-embed.tsx +++ b/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx @@ -2,11 +2,10 @@ import { Crown } from "lucide-react"; // ui import { Button } from "@plane/ui"; -export const IssueEmbedCard: React.FC = (props) => ( +export const IssueEmbedUpgradeCard: React.FC = (props) => (
{props.node?.attrs?.project_identifier}-{props?.node?.attrs?.sequence_id} diff --git a/web/ce/constants/issue.ts b/web/ce/constants/issue.ts deleted file mode 100644 index 68622c8fe..000000000 --- a/web/ce/constants/issue.ts +++ /dev/null @@ -1 +0,0 @@ -export const ENABLE_BULK_OPERATIONS = false; diff --git a/web/ce/hooks/use-bulk-operation-status.ts b/web/ce/hooks/use-bulk-operation-status.ts new file mode 100644 index 000000000..0bb676810 --- /dev/null +++ b/web/ce/hooks/use-bulk-operation-status.ts @@ -0,0 +1 @@ +export const useBulkOperationStatus = () => false; diff --git a/web/ce/hooks/use-issue-embed.tsx b/web/ce/hooks/use-issue-embed.tsx new file mode 100644 index 000000000..5ca4d4b02 --- /dev/null +++ b/web/ce/hooks/use-issue-embed.tsx @@ -0,0 +1,24 @@ +// editor +import { TEmbedConfig, TReadOnlyEmbedConfig } from "@plane/editor"; +// types +import { TPageEmbedType } from "@plane/types"; +// plane web components +import { IssueEmbedUpgradeCard } from "@/plane-web/components/pages"; + +// eslint-disable-next-line @typescript-eslint/no-unused-vars +export const useIssueEmbed = (workspaceSlug: string, projectId: string, queryType: TPageEmbedType = "issue") => { + const widgetCallback = () => ; + + const issueEmbedProps: TEmbedConfig["issue"] = { + widgetCallback, + }; + + const issueEmbedReadOnlyProps: TReadOnlyEmbedConfig["issue"] = { + widgetCallback, + }; + + return { + issueEmbedProps, + issueEmbedReadOnlyProps, + }; +}; diff --git a/web/core/components/gantt-chart/chart/main-content.tsx b/web/core/components/gantt-chart/chart/main-content.tsx index 8fd19cd2e..e49d19771 100644 --- a/web/core/components/gantt-chart/chart/main-content.tsx +++ b/web/core/components/gantt-chart/chart/main-content.tsx @@ -22,8 +22,8 @@ import { import { cn } from "@/helpers/common.helper"; // plane web components import { IssueBulkOperationsRoot } from "@/plane-web/components/issues"; -// plane web constants -import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue"; +// plane web hooks +import { useBulkOperationStatus } from "@/plane-web/hooks/use-bulk-operation-status"; // helpers // constants import { GANTT_SELECT_GROUP } from "../constants"; @@ -78,6 +78,8 @@ export const GanttChartMainContent: React.FC = observer((props) => { const ganttContainerRef = useRef(null); // chart hook const { currentView, currentViewData } = useGanttChart(); + // plane web hooks + const isBulkOperationsEnabled = useBulkOperationStatus(); // Enable Auto Scroll for Ganttlist useEffect(() => { @@ -126,7 +128,7 @@ export const GanttChartMainContent: React.FC = observer((props) => { entities={{ [GANTT_SELECT_GROUP]: blockIds ?? [], }} - disabled={!ENABLE_BULK_OPERATIONS} + disabled={!isBulkOperationsEnabled} > {(helpers) => ( <> diff --git a/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx b/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx index 668984496..2cc5fad14 100644 --- a/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx +++ b/web/core/components/issues/issue-layouts/gantt/base-gantt-root.tsx @@ -14,8 +14,8 @@ import { getIssueBlocksStructure } from "@/helpers/issue.helper"; import { useIssues, useUser } from "@/hooks/store"; import { useIssueStoreType } from "@/hooks/use-issue-layout-store"; import { useIssuesActions } from "@/hooks/use-issues-actions"; -// plane web constants -import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue"; +// plane web hooks +import { useBulkOperationStatus } from "@/plane-web/hooks/use-bulk-operation-status"; import { IssueLayoutHOC } from "../issue-layout-HOC"; @@ -42,6 +42,8 @@ export const BaseGanttRoot: React.FC = observer((props: IBaseGan membership: { currentProjectRole }, } = useUser(); const appliedDisplayFilters = issuesFilter.issueFilters?.displayFilters; + // plane web hooks + const isBulkOperationsEnabled = useBulkOperationStatus(); useEffect(() => { fetchIssues("init-loader", { canGroup: false, perPageCount: 100 }, viewId); @@ -99,7 +101,7 @@ export const BaseGanttRoot: React.FC = observer((props: IBaseGan enableBlockMove={isAllowed} enableReorder={appliedDisplayFilters?.order_by === "sort_order" && isAllowed} enableAddBlock={isAllowed} - enableSelection={ENABLE_BULK_OPERATIONS && isAllowed} + enableSelection={isBulkOperationsEnabled && isAllowed} quickAdd={ enableIssueCreation && isAllowed ? : undefined } diff --git a/web/core/components/issues/issue-layouts/list/default.tsx b/web/core/components/issues/issue-layouts/list/default.tsx index dafb00ed2..ad66a56c9 100644 --- a/web/core/components/issues/issue-layouts/list/default.tsx +++ b/web/core/components/issues/issue-layouts/list/default.tsx @@ -22,8 +22,8 @@ import { useCycle, useLabel, useMember, useModule, useProject, useProjectState } import { useIssueStoreType } from "@/hooks/use-issue-layout-store"; // plane web components import { IssueBulkOperationsRoot } from "@/plane-web/components/issues"; -// plane web constants -import { ENABLE_BULK_OPERATIONS } from "@/plane-web/constants/issue"; +// plane web hooks +import { useBulkOperationStatus } from "@/plane-web/hooks/use-bulk-operation-status"; // utils import { getGroupByColumns, isWorkspaceLevel, GroupDropLocation, isSubGrouped } from "../utils"; import { ListGroup } from "./list-group"; @@ -76,6 +76,8 @@ export const List: React.FC = observer((props) => { const projectState = useProjectState(); const cycle = useCycle(); const projectModule = useModule(); + // plane web hooks + const isBulkOperationsEnabled = useBulkOperationStatus(); const containerRef = useRef(null); @@ -129,7 +131,7 @@ export const List: React.FC = observer((props) => { return (
{groups && ( - + {(helpers) => ( <>
= observer((props) => { // refs const containerRef = useRef(null); const portalRef = useRef(null); - + // store hooks const { currentProjectDetails } = useProject(); + // plane web hooks + const isBulkOperationsEnabled = useBulkOperationStatus(); const isEstimateEnabled: boolean = currentProjectDetails?.estimate !== null; @@ -82,7 +84,7 @@ export const SpreadsheetView: React.FC = observer((props) => { entities={{ [SPREADSHEET_SELECT_GROUP]: issueIds, }} - disabled={!ENABLE_BULK_OPERATIONS} + disabled={!isBulkOperationsEnabled} > {(helpers) => ( <> diff --git a/web/core/components/pages/editor/editor-body.tsx b/web/core/components/pages/editor/editor-body.tsx index 2c4560004..6bc1b2e7b 100644 --- a/web/core/components/pages/editor/editor-body.tsx +++ b/web/core/components/pages/editor/editor-body.tsx @@ -18,8 +18,8 @@ import { cn } from "@/helpers/common.helper"; // hooks import { useMember, useMention, useUser, useWorkspace } from "@/hooks/store"; import { usePageFilters } from "@/hooks/use-page-filters"; -// plane web components -import { IssueEmbedCard } from "@/plane-web/components/pages"; +// plane web hooks +import { useIssueEmbed } from "@/plane-web/hooks/use-issue-embed"; // services import { FileService } from "@/services/file.service"; // store @@ -80,14 +80,21 @@ export const PageEditorBody: React.FC = observer((props) => { members: projectMemberDetails, user: currentUser ?? undefined, }); + // page filters const { isFullWidth } = usePageFilters(); + // issue-embed + const { issueEmbedProps, issueEmbedReadOnlyProps } = useIssueEmbed( + workspaceSlug?.toString() ?? "", + projectId?.toString() ?? "" + ); useEffect(() => { updateMarkings(pageDescription ?? "

"); }, [pageDescription, updateMarkings]); - if (pageId === undefined || !pageDescriptionYJS || !isDescriptionReady) return ; + if (pageId === undefined || pageDescription === undefined || !pageDescriptionYJS || !isDescriptionReady) + return ; return (
@@ -140,9 +147,7 @@ export const PageEditorBody: React.FC = observer((props) => { suggestions: mentionSuggestions, }} embedHandler={{ - issue: { - widgetCallback: () => , - }, + issue: issueEmbedProps, }} /> ) : ( @@ -156,9 +161,7 @@ export const PageEditorBody: React.FC = observer((props) => { highlights: mentionHighlights, }} embedHandler={{ - issue: { - widgetCallback: () => , - }, + issue: issueEmbedReadOnlyProps, }} /> )} diff --git a/web/ee/constants/issue.ts b/web/ee/constants/issue.ts deleted file mode 100644 index 17d60005a..000000000 --- a/web/ee/constants/issue.ts +++ /dev/null @@ -1 +0,0 @@ -export * from "ce/constants/issue"; \ No newline at end of file diff --git a/web/ee/hooks/use-issue-embed.tsx b/web/ee/hooks/use-issue-embed.tsx new file mode 100644 index 000000000..96e436e70 --- /dev/null +++ b/web/ee/hooks/use-issue-embed.tsx @@ -0,0 +1 @@ +export * from "ce/hooks/use-issue-embed";