diff --git a/packages/types/src/dashboard.d.ts b/packages/types/src/dashboard.d.ts index d96523280f..19d09bd92e 100644 --- a/packages/types/src/dashboard.d.ts +++ b/packages/types/src/dashboard.d.ts @@ -4,11 +4,6 @@ import { TIssue } from "./issues/issue"; import { TStateGroups } from "./state"; import { TIssueRelationTypes } from "@/plane-web/types"; -export type WidgetProps = { - dashboardId: string; - workspaceSlug: string; -}; - export type TWidgetKeys = | "overview_stats" | "assigned_issues" @@ -22,7 +17,6 @@ export type TWidgetKeys = export type TIssuesListTypes = "pending" | "upcoming" | "overdue" | "completed"; // widget filters -export type TRecentActivityWidgetFilters = "all" | "projects" | "pages" | "issues"; export type TAssignedIssuesWidgetFilters = { custom_dates?: string[]; @@ -186,41 +180,3 @@ export type THomeDashboardResponse = { dashboard: TDashboard; widgets: TWidget[]; }; - -// home -type TPageEntityData = { - id: string; - name: string; - logo_props: TLogoProps; - project_id: string; - owned_by: string; - project_identifier: string; -}; - -type TProjectEntityData = { - id: string; - name: string; - logo_props: TLogoProps; - project_members: ProjectMember[]; - identifier: string; -}; - -type TIssueEntityData = { - id: string; - name: string; - state: string; - priority: TIssuePriorities; - assignees: string[]; - type: string | null; - sequence_id: number; - project_id: string; - project_identifier: string; -}; - -type TActivityEntityData = { - id: string; - entity_name: "page" | "project" | "issue"; - entity_identifier: string; - visited_at: string; - entity_data: TPageEntityData | TProjectEntityData | TIssueEntityData; -}; diff --git a/packages/types/src/home.d.ts b/packages/types/src/home.d.ts new file mode 100644 index 0000000000..1723dafd2b --- /dev/null +++ b/packages/types/src/home.d.ts @@ -0,0 +1,46 @@ +import { TLogoProps } from "./common"; +import { TIssuePriorities } from "./issues"; + +export type TRecentActivityFilterKeys = "all item" | "issue" | "page" | "project"; +export type THomeWidgetKeys = "quick_links" | "recent_activity" | "stickies"; + +export type THomeWidgetProps = { + workspaceSlug: string; +}; + +export type TPageEntityData = { + id: string; + name: string; + logo_props: TLogoProps; + project_id: string; + owned_by: string; + project_identifier: string; +}; + +export type TProjectEntityData = { + id: string; + name: string; + logo_props: TLogoProps; + project_members: string[]; + identifier: string; +}; + +export type TIssueEntityData = { + id: string; + name: string; + state: string; + priority: TIssuePriorities; + assignees: string[]; + type: string | null; + sequence_id: number; + project_id: string; + project_identifier: string; +}; + +export type TActivityEntityData = { + id: string; + entity_name: "page" | "project" | "issue"; + entity_identifier: string; + visited_at: string; + entity_data: TPageEntityData | TProjectEntityData | TIssueEntityData; +}; diff --git a/packages/types/src/index.d.ts b/packages/types/src/index.d.ts index 169478f657..e26856263b 100644 --- a/packages/types/src/index.d.ts +++ b/packages/types/src/index.d.ts @@ -40,3 +40,4 @@ export * from "./timezone"; export * from "./activity"; export * from "./epics"; export * from "./charts"; +export * from "./home"; diff --git a/web/core/components/home/home-dashboard-widgets.tsx b/web/core/components/home/home-dashboard-widgets.tsx index 1e910082ca..57940d0fca 100644 --- a/web/core/components/home/home-dashboard-widgets.tsx +++ b/web/core/components/home/home-dashboard-widgets.tsx @@ -1,11 +1,10 @@ import { observer } from "mobx-react"; import { useParams } from "next/navigation"; // types -import { TWidgetKeys, WidgetProps } from "@plane/types"; -// components +import { THomeWidgetKeys, THomeWidgetProps, TWidgetKeys } from "@plane/types"; // hooks -import { useDashboard, useProject } from "@/hooks/store"; import { useHome } from "@/hooks/store/use-home"; +// components import { HomePageHeader } from "@/plane-web/components/home/header"; import { RecentActivityWidget } from "./widgets"; import { DashboardQuickLinks } from "./widgets/links"; @@ -13,8 +12,9 @@ import { ManageWidgetsModal } from "./widgets/manage"; import { StickiesWidget } from "@/plane-web/components/stickies"; const WIDGETS_LIST: { - [key: string]: { component: React.FC; fullWidth: boolean }; + [key in THomeWidgetKeys]: { component: React.FC; fullWidth: boolean }; } = { + quick_links: { component: DashboardQuickLinks, fullWidth: false }, recent_activity: { component: RecentActivityWidget, fullWidth: false }, stickies: { component: StickiesWidget, fullWidth: false }, }; @@ -22,15 +22,10 @@ const WIDGETS_LIST: { export const DashboardWidgets = observer(() => { // router const { workspaceSlug } = useParams(); - const { totalProjectIds } = useProject(); // store hooks const { toggleWidgetSettings, showWidgetSettings } = useHome(); - const { homeDashboardId, homeDashboardWidgets } = useDashboard(); - const doesWidgetExist = (widgetKey: TWidgetKeys) => - Boolean(homeDashboardWidgets?.find((widget) => widget.key === widgetKey)); - - if (!workspaceSlug || !homeDashboardId) return null; + if (!workspaceSlug) return null; return (
@@ -40,21 +35,16 @@ export const DashboardWidgets = observer(() => { isModalOpen={showWidgetSettings} handleOnClose={() => toggleWidgetSettings(false)} /> - {Object.entries(WIDGETS_LIST).map(([key, widget]) => { const WidgetComponent = widget.component; - // if the widget doesn't exist, return null - // if (!doesWidgetExist(key as TWidgetKeys)) return null; - // if the widget is full width, return it in a 2 column grid if (widget.fullWidth) return (
- +
); - else - return ; + else return ; })}
); diff --git a/web/core/components/home/widgets/links/root.tsx b/web/core/components/home/widgets/links/root.tsx index 1b2b389709..e10c642e40 100644 --- a/web/core/components/home/widgets/links/root.tsx +++ b/web/core/components/home/widgets/links/root.tsx @@ -4,11 +4,9 @@ import { useHome } from "@/hooks/store/use-home"; import { LinkCreateUpdateModal } from "./create-update-link-modal"; import { ProjectLinkList } from "./links"; import { useLinks } from "./use-links"; +import { THomeWidgetProps } from "@plane/types"; -type TProps = { - workspaceSlug: string; -}; -export const DashboardQuickLinks = observer((props: TProps) => { +export const DashboardQuickLinks = observer((props: THomeWidgetProps) => { const { workspaceSlug } = props; const { linkOperations } = useLinks(workspaceSlug); const { diff --git a/web/core/components/home/widgets/manage/widget-item.tsx b/web/core/components/home/widgets/manage/widget-item.tsx index d9c4523b85..fb101a093f 100644 --- a/web/core/components/home/widgets/manage/widget-item.tsx +++ b/web/core/components/home/widgets/manage/widget-item.tsx @@ -122,7 +122,7 @@ export const WidgetItem: FC = observer((props) => {
{widget.title}
- + {/* */} {isLastChild && } diff --git a/web/core/components/home/widgets/recents/filters.tsx b/web/core/components/home/widgets/recents/filters.tsx index 61edc80885..84391775b1 100644 --- a/web/core/components/home/widgets/recents/filters.tsx +++ b/web/core/components/home/widgets/recents/filters.tsx @@ -5,12 +5,13 @@ import { observer } from "mobx-react"; import { ChevronDown } from "lucide-react"; import { CustomMenu } from "@plane/ui"; import { cn } from "@plane/utils"; +import { TRecentActivityFilterKeys } from "@plane/types"; export type TFiltersDropdown = { className?: string; - activeFilter: string; - setActiveFilter: (filter: string) => void; - filters: { name: string; icon?: React.ReactNode }[]; + activeFilter: TRecentActivityFilterKeys; + setActiveFilter: (filter: TRecentActivityFilterKeys) => void; + filters: { name: TRecentActivityFilterKeys; icon?: React.ReactNode }[]; }; export const FiltersDropdown: FC = observer((props) => { diff --git a/web/core/components/home/widgets/recents/index.tsx b/web/core/components/home/widgets/recents/index.tsx index 9ba0862b31..9773f7bc7f 100644 --- a/web/core/components/home/widgets/recents/index.tsx +++ b/web/core/components/home/widgets/recents/index.tsx @@ -2,9 +2,8 @@ import { useRef, useState } from "react"; import { observer } from "mobx-react"; -import { WidgetProps } from "@/components/dashboard/widgets"; // types -import { TActivityEntityData } from "@plane/types"; +import { TActivityEntityData, THomeWidgetProps, TRecentActivityFilterKeys } from "@plane/types"; // components import { FiltersDropdown } from "./filters"; import { RecentIssue } from "./issue"; @@ -19,17 +18,19 @@ import { EmptyWorkspace } from "../empty-states"; const WIDGET_KEY = EWidgetKeys.RECENT_ACTIVITY; const workspaceService = new WorkspaceService(); -const filters = [ +const filters: { name: TRecentActivityFilterKeys; icon?: React.ReactNode }[] = [ { name: "all item" }, { name: "issue", icon: }, { name: "page", icon: }, { name: "project", icon: }, ]; -export const RecentActivityWidget: React.FC = observer((props) => { +export const RecentActivityWidget: React.FC = observer((props) => { const { workspaceSlug } = props; + // state + const [filter, setFilter] = useState(filters[0].name); + // ref const ref = useRef(null); - const [filter, setFilter] = useState(filters[0].name); const { data: recents, isLoading } = useSWR( workspaceSlug ? `WORKSPACE_RECENT_ACTIVITY_${workspaceSlug}_${filter}` : null,