From 6e0909156cfb9f582626081e4757e39fc21da5b7 Mon Sep 17 00:00:00 2001 From: gakshita Date: Thu, 14 Nov 2024 13:37:41 +0530 Subject: [PATCH 1/2] feat: issue empty state + project side menu --- packages/types/src/ai.d.ts | 6 +++ web/ce/components/issues/index.ts | 1 + .../issue-layouts/empty-states/index.ts | 1 + .../empty-states/project-issues.tsx | 43 +++++++++++++++++++ web/ce/components/project-planner/index.ts | 2 + .../project-planner/planner-custom-menu.tsx | 1 + .../project-planner/planner-modal.tsx | 1 + .../empty-states/project-issues.tsx | 24 ++++------- .../workspace/sidebar/projects-list-item.tsx | 16 ++----- 9 files changed, 68 insertions(+), 27 deletions(-) create mode 100644 web/ce/components/issues/issue-layouts/empty-states/index.ts create mode 100644 web/ce/components/issues/issue-layouts/empty-states/project-issues.tsx create mode 100644 web/ce/components/project-planner/index.ts create mode 100644 web/ce/components/project-planner/planner-custom-menu.tsx create mode 100644 web/ce/components/project-planner/planner-modal.tsx diff --git a/packages/types/src/ai.d.ts b/packages/types/src/ai.d.ts index ce8bcbadb2f..53671d64bdc 100644 --- a/packages/types/src/ai.d.ts +++ b/packages/types/src/ai.d.ts @@ -7,3 +7,9 @@ export interface IGptResponse { project_detail: IProjectLite; workspace_detail: IWorkspaceLite; } + +export type TProjectPlannerInput = { + data: string; + workspace_id: string; + project_id: string; +}; diff --git a/web/ce/components/issues/index.ts b/web/ce/components/issues/index.ts index 97b57af4b0c..c41d46e45bf 100644 --- a/web/ce/components/issues/index.ts +++ b/web/ce/components/issues/index.ts @@ -4,3 +4,4 @@ export * from "./issue-modal"; export * from "./issue-details"; export * from "./quick-add"; export * from "./filters"; +export * from "./issue-layouts/empty-states"; diff --git a/web/ce/components/issues/issue-layouts/empty-states/index.ts b/web/ce/components/issues/issue-layouts/empty-states/index.ts new file mode 100644 index 00000000000..2cc2e571eee --- /dev/null +++ b/web/ce/components/issues/issue-layouts/empty-states/index.ts @@ -0,0 +1 @@ +export * from "./project-issues"; diff --git a/web/ce/components/issues/issue-layouts/empty-states/project-issues.tsx b/web/ce/components/issues/issue-layouts/empty-states/project-issues.tsx new file mode 100644 index 00000000000..14526da042e --- /dev/null +++ b/web/ce/components/issues/issue-layouts/empty-states/project-issues.tsx @@ -0,0 +1,43 @@ +import { observer } from "mobx-react"; +// components +import { EmptyState } from "@/components/empty-state"; +// constants +import { EmptyStateType } from "@/constants/empty-state"; +import { EIssuesStoreType, TCreateModalStoreTypes } from "@/constants/issue"; + +type TProps = { + issueFilterCount: number; + additionalPath?: string; + handleClearAllFilters: () => void; + toggleCreateIssueModal: (value?: boolean | undefined, storeType?: TCreateModalStoreTypes | undefined) => void; + setTrackElement: (element: string) => void; + emptyStateType?: EmptyStateType; +}; +export const ResolvedProjectEmptyState: React.FC = observer((props) => { + const { + issueFilterCount, + additionalPath, + handleClearAllFilters, + toggleCreateIssueModal, + setTrackElement, + emptyStateType, + } = props; + + return ( +
+ 0 + ? undefined + : () => { + setTrackElement("Project issue empty state"); + toggleCreateIssueModal(true, EIssuesStoreType.PROJECT); + } + } + secondaryButtonOnClick={issueFilterCount > 0 ? handleClearAllFilters : undefined} + /> +
+ ); +}); diff --git a/web/ce/components/project-planner/index.ts b/web/ce/components/project-planner/index.ts new file mode 100644 index 00000000000..20052cc742c --- /dev/null +++ b/web/ce/components/project-planner/index.ts @@ -0,0 +1,2 @@ +export * from "./planner-modal"; +export * from "./planner-custom-menu"; diff --git a/web/ce/components/project-planner/planner-custom-menu.tsx b/web/ce/components/project-planner/planner-custom-menu.tsx new file mode 100644 index 00000000000..8d5f5797e44 --- /dev/null +++ b/web/ce/components/project-planner/planner-custom-menu.tsx @@ -0,0 +1 @@ +export const PlannerCustomMenu = () => null; diff --git a/web/ce/components/project-planner/planner-modal.tsx b/web/ce/components/project-planner/planner-modal.tsx new file mode 100644 index 00000000000..a1e92f2dd6e --- /dev/null +++ b/web/ce/components/project-planner/planner-modal.tsx @@ -0,0 +1 @@ +export const ProjectPlannerModal = () => <>; diff --git a/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx b/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx index 5ec86340d79..1abefe5070b 100644 --- a/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx +++ b/web/core/components/issues/issue-layouts/empty-states/project-issues.tsx @@ -3,13 +3,13 @@ import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // types import { IIssueFilterOptions } from "@plane/types"; -// components -import { EmptyState } from "@/components/empty-state"; // constants import { EmptyStateType } from "@/constants/empty-state"; import { EIssueFilterType, EIssuesStoreType } from "@/constants/issue"; // hooks import { useCommandPalette, useEventTracker, useIssues } from "@/hooks/store"; +// components +import { ResolvedProjectEmptyState } from "@/plane-web/components/issues"; export const ProjectEmptyState: React.FC = observer(() => { // router @@ -40,23 +40,17 @@ export const ProjectEmptyState: React.FC = observer(() => { }); }; - const emptyStateType = issueFilterCount > 0 ? EmptyStateType.PROJECT_EMPTY_FILTER : EmptyStateType.PROJECT_NO_ISSUES; - const additionalPath = issueFilterCount > 0 ? activeLayout ?? "list" : undefined; + const additionalPath = issueFilterCount > 0 ? (activeLayout ?? "list") : undefined; return (
- 0 - ? undefined - : () => { - setTrackElement("Project issue empty state"); - toggleCreateIssueModal(true, EIssuesStoreType.PROJECT); - } - } - secondaryButtonOnClick={issueFilterCount > 0 ? handleClearAllFilters : undefined} + handleClearAllFilters={handleClearAllFilters} + toggleCreateIssueModal={toggleCreateIssueModal} + setTrackElement={setTrackElement} + emptyStateType={issueFilterCount > 0 ? EmptyStateType.PROJECT_EMPTY_FILTER : undefined} />
); diff --git a/web/core/components/workspace/sidebar/projects-list-item.tsx b/web/core/components/workspace/sidebar/projects-list-item.tsx index faa85a82607..61bceb78532 100644 --- a/web/core/components/workspace/sidebar/projects-list-item.tsx +++ b/web/core/components/workspace/sidebar/projects-list-item.tsx @@ -10,18 +10,7 @@ import { observer } from "mobx-react"; import Link from "next/link"; import { useParams, usePathname, useRouter } from "next/navigation"; import { createRoot } from "react-dom/client"; -import { - PenSquare, - LinkIcon, - Star, - FileText, - Settings, - Share2, - LogOut, - MoreHorizontal, - ChevronRight, - Layers, -} from "lucide-react"; +import { LinkIcon, Star, FileText, Settings, Share2, LogOut, MoreHorizontal, ChevronRight, Layers } from "lucide-react"; import { Disclosure, Transition } from "@headlessui/react"; // plane helpers import { useOutsideClickDetector } from "@plane/helpers"; @@ -49,6 +38,7 @@ import { cn } from "@/helpers/common.helper"; import { useAppTheme, useEventTracker, useProject, useUserPermissions } from "@/hooks/store"; import { usePlatformOS } from "@/hooks/use-platform-os"; // constants +import { PlannerCustomMenu } from "@/plane-web/components/project-planner"; import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions"; import { HIGHLIGHT_CLASS, highlightIssueOnDrop } from "../../issues/issue-layouts/utils"; @@ -461,6 +451,8 @@ export const SidebarProjectsListItem: React.FC = observer((props) => { + + {/* leave project */} {!isAuthorized && ( From dde814288eeb79e6dc6e49f06ce89de3262235d7 Mon Sep 17 00:00:00 2001 From: gakshita Date: Thu, 14 Nov 2024 13:52:10 +0530 Subject: [PATCH 2/2] fix: removed extras --- web/ce/components/project-planner/index.ts | 2 -- .../project-planner/planner-custom-menu.tsx | 1 - .../components/project-planner/planner-modal.tsx | 1 - .../workspace/sidebar/projects-list-item.tsx | 16 ++++++++++++---- 4 files changed, 12 insertions(+), 8 deletions(-) delete mode 100644 web/ce/components/project-planner/index.ts delete mode 100644 web/ce/components/project-planner/planner-custom-menu.tsx delete mode 100644 web/ce/components/project-planner/planner-modal.tsx diff --git a/web/ce/components/project-planner/index.ts b/web/ce/components/project-planner/index.ts deleted file mode 100644 index 20052cc742c..00000000000 --- a/web/ce/components/project-planner/index.ts +++ /dev/null @@ -1,2 +0,0 @@ -export * from "./planner-modal"; -export * from "./planner-custom-menu"; diff --git a/web/ce/components/project-planner/planner-custom-menu.tsx b/web/ce/components/project-planner/planner-custom-menu.tsx deleted file mode 100644 index 8d5f5797e44..00000000000 --- a/web/ce/components/project-planner/planner-custom-menu.tsx +++ /dev/null @@ -1 +0,0 @@ -export const PlannerCustomMenu = () => null; diff --git a/web/ce/components/project-planner/planner-modal.tsx b/web/ce/components/project-planner/planner-modal.tsx deleted file mode 100644 index a1e92f2dd6e..00000000000 --- a/web/ce/components/project-planner/planner-modal.tsx +++ /dev/null @@ -1 +0,0 @@ -export const ProjectPlannerModal = () => <>; diff --git a/web/core/components/workspace/sidebar/projects-list-item.tsx b/web/core/components/workspace/sidebar/projects-list-item.tsx index 61bceb78532..faa85a82607 100644 --- a/web/core/components/workspace/sidebar/projects-list-item.tsx +++ b/web/core/components/workspace/sidebar/projects-list-item.tsx @@ -10,7 +10,18 @@ import { observer } from "mobx-react"; import Link from "next/link"; import { useParams, usePathname, useRouter } from "next/navigation"; import { createRoot } from "react-dom/client"; -import { LinkIcon, Star, FileText, Settings, Share2, LogOut, MoreHorizontal, ChevronRight, Layers } from "lucide-react"; +import { + PenSquare, + LinkIcon, + Star, + FileText, + Settings, + Share2, + LogOut, + MoreHorizontal, + ChevronRight, + Layers, +} from "lucide-react"; import { Disclosure, Transition } from "@headlessui/react"; // plane helpers import { useOutsideClickDetector } from "@plane/helpers"; @@ -38,7 +49,6 @@ import { cn } from "@/helpers/common.helper"; import { useAppTheme, useEventTracker, useProject, useUserPermissions } from "@/hooks/store"; import { usePlatformOS } from "@/hooks/use-platform-os"; // constants -import { PlannerCustomMenu } from "@/plane-web/components/project-planner"; import { EUserPermissions, EUserPermissionsLevel } from "@/plane-web/constants/user-permissions"; import { HIGHLIGHT_CLASS, highlightIssueOnDrop } from "../../issues/issue-layouts/utils"; @@ -451,8 +461,6 @@ export const SidebarProjectsListItem: React.FC = observer((props) => { - - {/* leave project */} {!isAuthorized && (