diff --git a/.github/workflows/build-test-pull-request.yml b/.github/workflows/build-test-pull-request.yml index 01ccbcf89..5b94b215a 100644 --- a/.github/workflows/build-test-pull-request.yml +++ b/.github/workflows/build-test-pull-request.yml @@ -14,10 +14,10 @@ jobs: space_changed: ${{ steps.changed-files.outputs.space_any_changed }} web_changed: ${{ steps.changed-files.outputs.web_any_changed }} steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Get changed files id: changed-files - uses: tj-actions/changed-files@v41 + uses: tj-actions/changed-files@v44 with: files_yaml: | apiserver: @@ -49,9 +49,9 @@ jobs: runs-on: ubuntu-latest if: needs.get-changed-files.outputs.apiserver_changed == 'true' steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Set up Python - uses: actions/setup-python@v4 + uses: actions/setup-python@v5 with: python-version: "3.x" # Specify the Python version you need - name: Install Pylint @@ -66,9 +66,9 @@ jobs: if: needs.get-changed-files.outputs.admin_changed == 'true' runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Setup Node.js - uses: actions/setup-node@v2 + uses: actions/setup-node@v4 with: node-version: 18.x - run: yarn install @@ -79,9 +79,9 @@ jobs: if: needs.get-changed-files.outputs.space_changed == 'true' runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Setup Node.js - uses: actions/setup-node@v2 + uses: actions/setup-node@v4 with: node-version: 18.x - run: yarn install @@ -92,9 +92,9 @@ jobs: if: needs.get-changed-files.outputs.web_changed == 'true' runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Setup Node.js - uses: actions/setup-node@v2 + uses: actions/setup-node@v4 with: node-version: 18.x - run: yarn install @@ -104,9 +104,9 @@ jobs: needs: lint-admin runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Setup Node.js - uses: actions/setup-node@v2 + uses: actions/setup-node@v4 with: node-version: 18.x - run: yarn install @@ -116,9 +116,9 @@ jobs: needs: lint-space runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Setup Node.js - uses: actions/setup-node@v2 + uses: actions/setup-node@v4 with: node-version: 18.x - run: yarn install @@ -128,9 +128,9 @@ jobs: needs: lint-web runs-on: ubuntu-latest steps: - - uses: actions/checkout@v3 + - uses: actions/checkout@v4 - name: Setup Node.js - uses: actions/setup-node@v2 + uses: actions/setup-node@v4 with: node-version: 18.x - run: yarn install diff --git a/space/app/[workspace_slug]/[project_id]/layout.tsx b/space/app/[workspace_slug]/[project_id]/layout.tsx index fdc85700c..37fc7c544 100644 --- a/space/app/[workspace_slug]/[project_id]/layout.tsx +++ b/space/app/[workspace_slug]/[project_id]/layout.tsx @@ -1,8 +1,6 @@ import Image from "next/image"; // components import IssueNavbar from "@/components/issues/navbar"; -// hooks -import { useProject } from "@/hooks/store"; // services import ProjectService from "@/services/project.service"; // assets @@ -17,7 +15,7 @@ export default async function ProjectLayout({ children, params }: { children: Re return (
- +
{children}
Project Settings not found; +} diff --git a/space/app/[workspace_slug]/[project_id]/page.tsx b/space/app/[workspace_slug]/[project_id]/page.tsx index ee262cb38..25893ed86 100644 --- a/space/app/[workspace_slug]/[project_id]/page.tsx +++ b/space/app/[workspace_slug]/[project_id]/page.tsx @@ -2,7 +2,7 @@ import { ProjectDetailsView } from "@/components/views"; export default async function WorkspaceProjectPage({ params }: { params: any }) { - const { workspace_slug, project_id, ...rest } = params; + const { workspace_slug, project_id, peekId } = params; - return ; + return ; } diff --git a/space/app/error.tsx b/space/app/error.tsx index 0c1e9d907..5b7c6ecfb 100644 --- a/space/app/error.tsx +++ b/space/app/error.tsx @@ -1,5 +1,40 @@ "use client"; +import Image from "next/image"; +import { useTheme } from "next-themes"; +import { Button } from "@plane/ui"; +// assets +import InstanceFailureDarkImage from "@/public/instance/instance-failure-dark.svg"; +import InstanceFailureImage from "@/public/instance/instance-failure.svg"; + export default function InstanceError() { - return
Instance Error
; + const { resolvedTheme } = useTheme(); + + const instanceImage = resolvedTheme === "dark" ? InstanceFailureDarkImage : InstanceFailureImage; + + const handleRetry = () => { + window.location.reload(); + }; + + return ( +
+
+
+
+ Plane Logo +

Unable to fetch instance details.

+

+ We were unable to fetch the details of the instance.
+ Fret not, it might just be a connectivity issue. +

+
+
+ +
+
+
+
+ ); } diff --git a/space/app/layout.tsx b/space/app/layout.tsx index 24e23a372..b5501957e 100644 --- a/space/app/layout.tsx +++ b/space/app/layout.tsx @@ -1,14 +1,8 @@ import { Metadata } from "next"; // styles import "@/styles/globals.css"; -// components -import { InstanceNotReady } from "@/components/instance"; -// lib -import { AppProvider } from "@/lib/app-providers"; -// services -import { InstanceService } from "@/services/instance.service"; - -const instanceService = new InstanceService(); +// helpers +import { ASSET_PREFIX } from "@/helpers/common.helper"; export const metadata: Metadata = { title: "Plane Deploy | Make your Plane boards public with one-click", @@ -26,24 +20,16 @@ export const metadata: Metadata = { }; export default async function RootLayout({ children }: { children: React.ReactNode }) { - const instanceDetails = await instanceService.getInstanceInfo(); - return ( - {/* - - - - */} + + + + + - - {!instanceDetails?.instance?.is_setup_done ? ( - - ) : ( - {children} - )} - + {children} ); } diff --git a/space/app/not-found.tsx b/space/app/not-found.tsx new file mode 100644 index 000000000..98c4f95ca --- /dev/null +++ b/space/app/not-found.tsx @@ -0,0 +1,39 @@ +"use client"; +import Image from "next/image"; +import { useTheme } from "next-themes"; +import { Button } from "@plane/ui"; +// assets +import InstanceFailureDarkImage from "@/public/instance/instance-failure-dark.svg"; +import InstanceFailureImage from "@/public/instance/instance-failure.svg"; + +export default function InstanceNotFound() { + const { resolvedTheme } = useTheme(); + + const instanceImage = resolvedTheme === "dark" ? InstanceFailureDarkImage : InstanceFailureImage; + + const handleRetry = () => { + window.location.reload(); + }; + + return ( +
+
+
+
+ Plane Logo +

Unable to fetch instance details.

+

+ We were unable to fetch the details of the instance.
+ Fret not, it might just be a connectivity issue. +

+
+
+ +
+
+
+
+ ); +} diff --git a/space/app/page.tsx b/space/app/page.tsx index bdd42c3af..b2c032287 100644 --- a/space/app/page.tsx +++ b/space/app/page.tsx @@ -1,31 +1,43 @@ // components import { UserLoggedIn } from "@/components/accounts"; +import { InstanceNotReady, InstanceFailureView } from "@/components/instance"; import { AuthView } from "@/components/views"; // helpers // import { EPageTypes } from "@/helpers/authentication.helper"; // import { useInstance, useUser } from "@/hooks/store"; // wrapper // import { AuthWrapper } from "@/lib/wrappers"; +// lib +import { AppProvider } from "@/lib/app-providers"; // services +import { InstanceService } from "@/services/instance.service"; import { UserService } from "@/services/user.service"; const userServices = new UserService(); +const instanceService = new InstanceService(); export default async function HomePage() { + const instanceDetails = await instanceService.getInstanceInfo().catch(() => undefined); const user = await userServices .currentUser() .then((user) => ({ ...user, isAuthenticated: true })) .catch(() => ({ isAuthenticated: false })); - // const { data } = useInstance(); + if (!instanceDetails) { + return ; + } - // console.log("data", data); - console.log("user", user); + if (!instanceDetails?.instance?.is_setup_done) { + ; + } if (user.isAuthenticated) { return ; } - // return <>Login View; - return ; + return ( + + + + ); } diff --git a/space/components/accounts/auth-forms/password.tsx b/space/components/accounts/auth-forms/password.tsx index bd64f24d1..b9d614155 100644 --- a/space/components/accounts/auth-forms/password.tsx +++ b/space/components/accounts/auth-forms/password.tsx @@ -3,7 +3,7 @@ import React, { useEffect, useMemo, useState } from "react"; // icons import Link from "next/link"; -import { useRouter } from "next/navigation"; +import { useParams } from "next/navigation"; import { Eye, EyeOff, XCircle } from "lucide-react"; // ui import { Button, Input, Spinner } from "@plane/ui"; @@ -47,8 +47,7 @@ export const PasswordForm: React.FC = (props) => { // hooks const { data: instance, config: instanceConfig } = useInstance(); // router - const router = useRouter(); - const { next_path } = router.query; + const { next_path } = useParams(); // derived values const isSmtpConfigured = instanceConfig?.is_smtp_configured; diff --git a/space/components/accounts/auth-forms/unique-code.tsx b/space/components/accounts/auth-forms/unique-code.tsx index bcb696a1f..fc04938bc 100644 --- a/space/components/accounts/auth-forms/unique-code.tsx +++ b/space/components/accounts/auth-forms/unique-code.tsx @@ -1,7 +1,7 @@ "use client"; import React, { useEffect, useState } from "react"; -import { useRouter } from "next/navigation"; +import { useParams } from "next/navigation"; // icons import { CircleCheck, XCircle } from "lucide-react"; // ui @@ -45,8 +45,7 @@ export const UniqueCodeForm: React.FC = (props) => { const [csrfToken, setCsrfToken] = useState(undefined); const [isSubmitting, setIsSubmitting] = useState(false); // router - const router = useRouter(); - const { next_path } = router.query; + const { next_path } = useParams(); // toast alert const { setToastAlert } = useToast(); // timer diff --git a/space/components/instance/instance-failure-view.tsx b/space/components/instance/instance-failure-view.tsx index 0b875382a..1173a6894 100644 --- a/space/components/instance/instance-failure-view.tsx +++ b/space/components/instance/instance-failure-view.tsx @@ -1,3 +1,4 @@ +"use client"; import { FC } from "react"; import Image from "next/image"; import { useTheme } from "next-themes"; @@ -7,15 +8,18 @@ import InstanceFailureDarkImage from "public/instance/instance-failure-dark.svg" import InstanceFailureImage from "public/instance/instance-failure.svg"; type InstanceFailureViewProps = { - mutate: () => void; + // mutate: () => void; }; -export const InstanceFailureView: FC = (props) => { - const { mutate } = props; +export const InstanceFailureView: FC = () => { const { resolvedTheme } = useTheme(); const instanceImage = resolvedTheme === "dark" ? InstanceFailureDarkImage : InstanceFailureImage; + const handleRetry = () => { + window.location.reload(); + }; + return (
@@ -28,7 +32,7 @@ export const InstanceFailureView: FC = (props) => {

-
diff --git a/space/components/instance/not-ready-view.tsx b/space/components/instance/not-ready-view.tsx index 5b7944671..5b94d92ed 100644 --- a/space/components/instance/not-ready-view.tsx +++ b/space/components/instance/not-ready-view.tsx @@ -4,7 +4,7 @@ import { FC } from "react"; import Image from "next/image"; // ui import { Button } from "@plane/ui"; -// helpers +// helper import { ADMIN_BASE_URL, ADMIN_BASE_PATH } from "@/helpers/common.helper"; // images import PlaneTakeOffImage from "@/public/instance/plane-takeoff.png"; diff --git a/space/components/issues/board-views/kanban/block.tsx b/space/components/issues/board-views/kanban/block.tsx index 24e6f1fb1..4ecee992c 100644 --- a/space/components/issues/board-views/kanban/block.tsx +++ b/space/components/issues/board-views/kanban/block.tsx @@ -1,53 +1,48 @@ "use client"; -// mobx react lite +import { FC } from "react"; import { observer } from "mobx-react-lite"; -import { useRouter } from "next/navigation"; +import { useRouter, useSearchParams } from "next/navigation"; +// components import { IssueBlockDueDate } from "@/components/issues/board-views/block-due-date"; import { IssueBlockPriority } from "@/components/issues/board-views/block-priority"; import { IssueBlockState } from "@/components/issues/board-views/block-state"; -import { useMobxStore } from "@/hooks/store"; - -// components +// hooks +import { useIssueDetails, useProject } from "@/hooks/store"; // interfaces -import { RootStore } from "@/store/root.store"; -import { IIssue } from "types/issue"; +import { IIssue } from "@/types/issue"; -export const IssueKanBanBlock = observer(({ issue }: { issue: IIssue }) => { - const { project: projectStore, issueDetails: issueDetailStore }: RootStore = useMobxStore(); +type IssueKanBanBlockProps = { + issue: IIssue; + workspaceSlug: string; + projectId: string; + params: any; +}; +export const IssueKanBanBlock: FC = observer((props) => { + const { workspaceSlug, projectId, params, issue } = props; + const { board, priorities, states, labels } = params; + // store + const { project } = useProject(); + const { setPeekId } = useIssueDetails(); // router const router = useRouter(); - const { workspace_slug, project_slug, board, priorities, states, labels } = router.query as { - workspace_slug: string; - project_slug: string; - board: string; - priorities: string; - states: string; - labels: string; - }; + const searchParams = useSearchParams(); const handleBlockClick = () => { - issueDetailStore.setPeekId(issue.id); + setPeekId(issue.id); const params: any = { board: board, peekId: issue.id }; if (states && states.length > 0) params.states = states; if (priorities && priorities.length > 0) params.priorities = priorities; if (labels && labels.length > 0) params.labels = labels; - router.push( - { - pathname: `/${workspace_slug}/${project_slug}`, - query: { ...params }, - }, - undefined, - { shallow: true } - ); + router.push(`/${workspaceSlug}/${projectId}?${searchParams}`); }; return (
{/* id */}
- {projectStore?.project?.identifier}-{issue?.sequence_id} + {project?.identifier}-{issue?.sequence_id}
{/* name */} diff --git a/space/components/issues/board-views/kanban/header.tsx b/space/components/issues/board-views/kanban/header.tsx index c08f89975..5a4d9a226 100644 --- a/space/components/issues/board-views/kanban/header.tsx +++ b/space/components/issues/board-views/kanban/header.tsx @@ -1,18 +1,16 @@ // mobx react lite import { observer } from "mobx-react-lite"; -// interfaces -// constants -import { StateGroupIcon } from "@plane/ui"; -import { issueGroupFilter } from "@/constants/data"; // ui +import { StateGroupIcon } from "@plane/ui"; +// constants +import { issueGroupFilter } from "@/constants/data"; // mobx hook -import { useMobxStore } from "@/hooks/store"; -import { RootStore } from "@/store/root.store"; -import { IIssueState } from "types/issue"; +import { useIssue } from "@/hooks/store"; +// interfaces +import { IIssueState } from "@/types/issue"; export const IssueKanBanHeader = observer(({ state }: { state: IIssueState }) => { - const store: RootStore = useMobxStore(); - + const { getCountOfIssuesByState } = useIssue(); const stateGroup = issueGroupFilter(state.group); if (stateGroup === null) return <>; @@ -23,9 +21,7 @@ export const IssueKanBanHeader = observer(({ state }: { state: IIssueState }) =>
{state?.name}
- - {store.issue.getCountOfIssuesByState(state.id)} - + {getCountOfIssuesByState(state.id)}
); }); diff --git a/space/components/issues/board-views/kanban/index.tsx b/space/components/issues/board-views/kanban/index.tsx index d1a9fe709..e2e4e9900 100644 --- a/space/components/issues/board-views/kanban/index.tsx +++ b/space/components/issues/board-views/kanban/index.tsx @@ -1,36 +1,47 @@ "use client"; -// mobx react lite +import { FC } from "react"; import { observer } from "mobx-react-lite"; // components import { IssueKanBanBlock } from "@/components/issues/board-views/kanban/block"; import { IssueKanBanHeader } from "@/components/issues/board-views/kanban/header"; // ui import { Icon } from "@/components/ui"; -// interfaces // mobx hook -import { useMobxStore } from "@/hooks/store"; -import { RootStore } from "@/store/root.store"; -import { IIssueState, IIssue } from "types/issue"; +import { useIssue } from "@/hooks/store"; +// interfaces +import { IIssueState, IIssue } from "@/types/issue"; -export const IssueKanbanView = observer(() => { - const store: RootStore = useMobxStore(); +type IssueKanbanViewProps = { + workspaceSlug: string; + projectId: string; +}; + +export const IssueKanbanView: FC = observer((props) => { + const { workspaceSlug, projectId } = props; + // store hooks + const { states, getFilteredIssuesByState } = useIssue(); return (
- {store?.issue?.states && - store?.issue?.states.length > 0 && - store?.issue?.states.map((_state: IIssueState) => ( + {states && + states.length > 0 && + states.map((_state: IIssueState) => (
- {store.issue.getFilteredIssuesByState(_state.id) && - store.issue.getFilteredIssuesByState(_state.id).length > 0 ? ( + {getFilteredIssuesByState(_state.id) && getFilteredIssuesByState(_state.id).length > 0 ? (
- {store.issue.getFilteredIssuesByState(_state.id).map((_issue: IIssue) => ( - + {getFilteredIssuesByState(_state.id).map((_issue: IIssue) => ( + ))}
) : ( diff --git a/space/components/issues/board-views/list/block.tsx b/space/components/issues/board-views/list/block.tsx index 60ecf53a1..e05ebcb2d 100644 --- a/space/components/issues/board-views/list/block.tsx +++ b/space/components/issues/board-views/list/block.tsx @@ -1,47 +1,40 @@ import { FC } from "react"; import { observer } from "mobx-react-lite"; -import { useRouter } from "next/navigation"; +import { useParams, useRouter, useSearchParams } from "next/navigation"; // components import { IssueBlockDueDate } from "@/components/issues/board-views/block-due-date"; import { IssueBlockLabels } from "@/components/issues/board-views/block-labels"; import { IssueBlockPriority } from "@/components/issues/board-views/block-priority"; import { IssueBlockState } from "@/components/issues/board-views/block-state"; // mobx hook -import { useMobxStore } from "@/hooks/store"; +import { useIssueDetails, useProject } from "@/hooks/store"; // interfaces -import { RootStore } from "@/store/root.store"; -import { IIssue } from "types/issue"; +import { IIssue } from "@/types/issue"; // store -export const IssueListBlock: FC<{ issue: IIssue }> = observer((props) => { - const { issue } = props; +type IssueListBlockProps = { + issue: IIssue; + workspaceSlug: string; + projectId: string; +}; + +export const IssueListBlock: FC = observer((props) => { + const { workspaceSlug, projectId, issue } = props; + const { board, states, priorities, labels } = useParams(); + const searchParams = useSearchParams(); // store - const { project: projectStore, issueDetails: issueDetailStore }: RootStore = useMobxStore(); + const { project } = useProject(); + const { setPeekId } = useIssueDetails(); // router const router = useRouter(); - const { workspace_slug, project_slug, board, priorities, states, labels } = router.query as { - workspace_slug: string; - project_slug: string; - board: string; - priorities: string; - states: string; - labels: string; - }; const handleBlockClick = () => { - issueDetailStore.setPeekId(issue.id); + setPeekId(issue.id); const params: any = { board: board, peekId: issue.id }; if (states && states.length > 0) params.states = states; if (priorities && priorities.length > 0) params.priorities = priorities; if (labels && labels.length > 0) params.labels = labels; - router.push( - { - pathname: `/${workspace_slug}/${project_slug}`, - query: { ...params }, - }, - undefined, - { shallow: true } - ); + router.push(`/${workspaceSlug}/${projectId}?${searchParams}`); // router.push(`/${workspace_slug?.toString()}/${project_slug}?board=${board?.toString()}&peekId=${issue.id}`); }; @@ -50,7 +43,7 @@ export const IssueListBlock: FC<{ issue: IIssue }> = observer((props) => {
{/* id */}
- {projectStore?.project?.identifier}-{issue?.sequence_id} + {project?.identifier}-{issue?.sequence_id}
{/* name */}
diff --git a/space/components/issues/board-views/list/header.tsx b/space/components/issues/board-views/list/header.tsx index 6266c9cef..22a902474 100644 --- a/space/components/issues/board-views/list/header.tsx +++ b/space/components/issues/board-views/list/header.tsx @@ -1,18 +1,15 @@ -// mobx react lite import { observer } from "mobx-react-lite"; -// interfaces // ui import { StateGroupIcon } from "@plane/ui"; // constants import { issueGroupFilter } from "@/constants/data"; // mobx hook -import { useMobxStore } from "@/hooks/store"; -import { RootStore } from "@/store/root.store"; -import { IIssueState } from "types/issue"; +import { useIssue } from "@/hooks/store"; +// types +import { IIssueState } from "@/types/issue"; export const IssueListHeader = observer(({ state }: { state: IIssueState }) => { - const store: RootStore = useMobxStore(); - + const { getCountOfIssuesByState } = useIssue(); const stateGroup = issueGroupFilter(state.group); if (stateGroup === null) return <>; @@ -23,7 +20,7 @@ export const IssueListHeader = observer(({ state }: { state: IIssueState }) => {
{state?.name}
-
{store.issue.getCountOfIssuesByState(state.id)}
+
{getCountOfIssuesByState(state.id)}
); }); diff --git a/space/components/issues/board-views/list/index.tsx b/space/components/issues/board-views/list/index.tsx index f5f5adb6b..7740bfd58 100644 --- a/space/components/issues/board-views/list/index.tsx +++ b/space/components/issues/board-views/list/index.tsx @@ -1,3 +1,4 @@ +import { FC } from "react"; import { observer } from "mobx-react-lite"; // components import { IssueListBlock } from "@/components/issues/board-views/list/block"; @@ -7,7 +8,14 @@ import { useIssue } from "@/hooks/store"; // types import { IIssueState, IIssue } from "@/types/issue"; -export const IssueListView = observer(() => { +type IssueListViewProps = { + workspaceSlug: string; + projectId: string; +}; + +export const IssueListView: FC = observer((props) => { + const { workspaceSlug, projectId } = props; + // store hooks const { states, getFilteredIssuesByState } = useIssue(); return ( @@ -20,7 +28,7 @@ export const IssueListView = observer(() => { {getFilteredIssuesByState(_state.id) && getFilteredIssuesByState(_state.id).length > 0 ? (
{getFilteredIssuesByState(_state.id).map((_issue: IIssue) => ( - + ))}
) : ( diff --git a/space/components/issues/filters/applied-filters/filters-list.tsx b/space/components/issues/filters/applied-filters/filters-list.tsx index e0d41341b..a0d703c2c 100644 --- a/space/components/issues/filters/applied-filters/filters-list.tsx +++ b/space/components/issues/filters/applied-filters/filters-list.tsx @@ -1,12 +1,10 @@ -// components // icons import { X } from "lucide-react"; -// helpers -import { IIssueFilterOptions } from "@/store/issues/types"; -import { IIssueLabel, IIssueState } from "types/issue"; +// types +import { IIssueLabel, IIssueState, IIssueFilterOptions } from "@/types/issue"; +// components import { AppliedPriorityFilters } from "./priority"; import { AppliedStateFilters } from "./state"; -// types type Props = { appliedFilters: IIssueFilterOptions; diff --git a/space/components/issues/filters/root.tsx b/space/components/issues/filters/root.tsx index b84e21810..1e9951236 100644 --- a/space/components/issues/filters/root.tsx +++ b/space/components/issues/filters/root.tsx @@ -1,29 +1,29 @@ import { FC, useCallback } from "react"; import { observer } from "mobx-react-lite"; -import { useRouter } from "next/navigation"; +import { useRouter, useSearchParams } from "next/navigation"; +// constants +import { ISSUE_DISPLAY_FILTERS_BY_LAYOUT } from "@/constants/issue"; +// hooks +import { useIssue, useIssueFilter, useProject } from "@/hooks/store"; +// types +import { IIssueFilterOptions } from "@/types/issue"; // components -import { useMobxStore } from "@/hooks/store"; -import { ISSUE_DISPLAY_FILTERS_BY_LAYOUT } from "@/store/issues/helpers"; -import { IIssueFilterOptions } from "@/store/issues/types"; -import { RootStore } from "@/store/root.store"; import { FiltersDropdown } from "./helpers/dropdown"; import { FilterSelection } from "./selection"; -// types -// helpers -// store -export const IssueFiltersDropdown: FC = observer(() => { +type IssueFiltersDropdownProps = { + workspaceSlug: string; + projectId: string; +}; + +export const IssueFiltersDropdown: FC = observer((props) => { + const { workspaceSlug, projectId } = props; + const searchParams = useSearchParams(); const router = useRouter(); - const { workspace_slug: workspaceSlug, project_slug: projectId } = router.query as { - workspace_slug: string; - project_slug: string; - }; - - const { - project: { activeBoard }, - issue: { states, labels }, - issuesFilter: { issueFilters, updateFilters }, - }: RootStore = useMobxStore(); + // store hooks + const { activeLayout } = useProject(); + const { states, labels } = useIssue(); + const { issueFilters, updateFilters } = useIssueFilter(); const updateRouteParams = useCallback( (key: keyof IIssueFilterOptions, value: string[]) => { @@ -31,14 +31,14 @@ export const IssueFiltersDropdown: FC = observer(() => { const priority = key === "priority" ? value : issueFilters?.filters?.priority ?? []; const labels = key === "labels" ? value : issueFilters?.filters?.labels ?? []; - let params: any = { board: activeBoard || "list" }; + let params: any = { board: activeLayout || "list" }; if (priority.length > 0) params = { ...params, priorities: priority.join(",") }; if (state.length > 0) params = { ...params, states: state.join(",") }; if (labels.length > 0) params = { ...params, labels: labels.join(",") }; - - router.push({ pathname: `/${workspaceSlug}/${projectId}`, query: { ...params } }, undefined, { shallow: true }); + console.log("params", params); + router.push(`/${workspaceSlug}/${projectId}?${searchParams}`); }, - [workspaceSlug, projectId, activeBoard, issueFilters, router] + [workspaceSlug, projectId, activeLayout, issueFilters, router] ); const handleFilters = useCallback( @@ -66,8 +66,8 @@ export const IssueFiltersDropdown: FC = observer(() => { diff --git a/space/components/issues/filters/selection.tsx b/space/components/issues/filters/selection.tsx index 71f0c5f1b..9d7d89666 100644 --- a/space/components/issues/filters/selection.tsx +++ b/space/components/issues/filters/selection.tsx @@ -1,13 +1,10 @@ import React, { useState } from "react"; import { observer } from "mobx-react-lite"; import { Search, X } from "lucide-react"; -// components // types - -// filter helpers -import { ILayoutDisplayFiltersOptions } from "@/store/issues/helpers"; -import { IIssueFilterOptions } from "@/store/issues/types"; -import { IIssueState, IIssueLabel } from "types/issue"; +import { IIssueState, IIssueLabel, IIssueFilterOptions } from "@/types/issue"; +import { ILayoutDisplayFiltersOptions } from "@/types/issue-filters"; +// components import { FilterPriority, FilterState } from "./"; type Props = { diff --git a/space/components/issues/navbar/index.tsx b/space/components/issues/navbar/index.tsx index f3efcc5d4..ff992c037 100644 --- a/space/components/issues/navbar/index.tsx +++ b/space/components/issues/navbar/index.tsx @@ -3,47 +3,50 @@ import { useEffect, FC } from "react"; import { observer } from "mobx-react-lite"; import Link from "next/link"; -import { useRouter } from "next/navigation"; -// components +import { useRouter, useParams, useSearchParams, usePathname } from "next/navigation"; import { Briefcase } from "lucide-react"; import { Avatar, Button } from "@plane/ui"; +// components import { ProjectLogo } from "@/components/common"; import { IssueFiltersDropdown } from "@/components/issues/filters"; // hooks -import { useProject, useUser } from "@/hooks/store"; -// store +import { useProject, useUser, useIssueFilter } from "@/hooks/store"; +// types +import { TIssueBoardKeys } from "@/types/issue"; +// components import { NavbarIssueBoardView } from "./issue-board-view"; import { NavbarTheme } from "./theme"; type IssueNavbarProps = { projectSettings: any; + workspaceSlug: string; + projectId: string; }; const IssueNavbar: FC = observer((props) => { - const { projectSettings } = props; + const { projectSettings, workspaceSlug, projectId } = props; const { project_details, views } = projectSettings; - - console.log("projectSettings", projectSettings); + const { board, labels, states, priorities, peekId } = useParams(); + const searchParams = useSearchParams(); + const pathName = usePathname(); // hooks const router = useRouter(); // store - const { settings, activeLayout, hydrate } = useProject(); - hydrate(projectSettings); + const { settings, activeLayout, hydrate, setActiveLayout } = useProject(); const { data: user } = useUser(); - console.log("user", user); + const { updateFilters } = useIssueFilter(); + hydrate(projectSettings); - // return <>layout; + useEffect(() => { + if (workspaceSlug && projectId && settings) { + const viewsAcceptable: string[] = []; + let currentBoard: TIssueBoardKeys | null = null; - // useEffect(() => { - // if (workspace_slug && project_slug && settings) { - // const viewsAcceptable: string[] = []; - // let currentBoard: TIssueBoardKeys | null = null; - - // if (settings?.views?.list) viewsAcceptable.push("list"); - // if (settings?.views?.kanban) viewsAcceptable.push("kanban"); - // if (settings?.views?.calendar) viewsAcceptable.push("calendar"); - // if (settings?.views?.gantt) viewsAcceptable.push("gantt"); - // if (settings?.views?.spreadsheet) viewsAcceptable.push("spreadsheet"); + if (settings?.views?.list) viewsAcceptable.push("list"); + if (settings?.views?.kanban) viewsAcceptable.push("kanban"); + if (settings?.views?.calendar) viewsAcceptable.push("calendar"); + if (settings?.views?.gantt) viewsAcceptable.push("gantt"); + if (settings?.views?.spreadsheet) viewsAcceptable.push("spreadsheet"); // if (board) { // if (viewsAcceptable.includes(board.toString())) { @@ -59,42 +62,40 @@ const IssueNavbar: FC = observer((props) => { // } // } - // if (currentBoard) { - // if (projectStore?.layout === null || projectStore?.activeBoard !== currentBoard) { - // let params: any = { board: currentBoard }; - // if (peekId && peekId.length > 0) params = { ...params, peekId: peekId }; - // if (priorities && priorities.length > 0) params = { ...params, priorities: priorities }; - // if (states && states.length > 0) params = { ...params, states: states }; - // if (labels && labels.length > 0) params = { ...params, labels: labels }; + if (currentBoard) { + if (activeLayout === null || activeLayout !== currentBoard) { + let params: any = { board: currentBoard }; + if (peekId && peekId.length > 0) params = { ...params, peekId: peekId }; + if (priorities && priorities.length > 0) params = { ...params, priorities: priorities }; + if (states && states.length > 0) params = { ...params, states: states }; + if (labels && labels.length > 0) params = { ...params, labels: labels }; + console.log("params", params); + let storeParams: any = {}; + if (priorities && priorities.length > 0) storeParams = { ...storeParams, priority: priorities.split(",") }; + if (states && states.length > 0) storeParams = { ...storeParams, state: states.split(",") }; + if (labels && labels.length > 0) storeParams = { ...storeParams, labels: labels.split(",") }; - // let storeParams: any = {}; - // if (priorities && priorities.length > 0) storeParams = { ...storeParams, priority: priorities.split(",") }; - // if (states && states.length > 0) storeParams = { ...storeParams, state: states.split(",") }; - // if (labels && labels.length > 0) storeParams = { ...storeParams, labels: labels.split(",") }; - - // if (storeParams) updateFilters(project_slug, storeParams); - - // projectStore.setActiveBoard(currentBoard); - // router.push({ - // pathname: `/${workspace_slug}/${project_slug}`, - // query: { ...params }, - // }); - // } - // } - // } - // }, [ - // board, - // workspace_slug, - // project_slug, - // router, - // projectStore, - // projectStore?.deploySettings, - // updateFilters, - // labels, - // states, - // priorities, - // peekId, - // ]); + if (storeParams) updateFilters(projectId, storeParams); + setActiveLayout(currentBoard); + router.push(`/${workspaceSlug}/${projectId}?${searchParams}`); + } + } + } + }, [ + board, + workspaceSlug, + projectId, + router, + updateFilters, + labels, + states, + priorities, + peekId, + settings, + activeLayout, + setActiveLayout, + searchParams, + ]); return (
@@ -121,7 +122,7 @@ const IssueNavbar: FC = observer((props) => { {/* issue filters */}
- +
{/* theming */} @@ -136,7 +137,7 @@ const IssueNavbar: FC = observer((props) => {
) : (
- +
diff --git a/space/components/issues/peek-overview/comment/add-comment.tsx b/space/components/issues/peek-overview/comment/add-comment.tsx index 878d2fab4..96366eadd 100644 --- a/space/components/issues/peek-overview/comment/add-comment.tsx +++ b/space/components/issues/peek-overview/comment/add-comment.tsx @@ -1,12 +1,11 @@ import React, { useRef } from "react"; import { observer } from "mobx-react-lite"; -import { useRouter } from "next/navigation"; import { useForm, Controller } from "react-hook-form"; // components import { EditorRefApi } from "@plane/lite-text-editor"; import { LiteTextEditor } from "@/components/editor/lite-text-editor"; // hooks -import { useMobxStore, useUser } from "@/hooks/store"; +import { useIssueDetails, useProject, useUser } from "@/hooks/store"; import useToast from "@/hooks/use-toast"; // types import { Comment } from "@/types/issue"; @@ -17,22 +16,21 @@ const defaultValues: Partial = { type Props = { disabled?: boolean; + workspaceSlug: string; + projectId: string; }; -export const AddComment: React.FC = observer(() => { +export const AddComment: React.FC = observer((props) => { // const { disabled = false } = props; + const { workspaceSlug, projectId } = props; // refs const editorRef = useRef(null); - // router - const router = useRouter(); - const { workspace_slug, project_slug } = router.query; // store hooks - const { project } = useMobxStore(); - const { issueDetails: issueDetailStore } = useMobxStore(); + const { workspace } = useProject(); + const { peekId: issueId, addIssueComment } = useIssueDetails(); const { data: currentUser } = useUser(); // derived values - const workspaceId = project.workspace?.id; - const issueId = issueDetailStore.peekId; + const workspaceId = workspace?.id; // form info const { handleSubmit, @@ -45,10 +43,9 @@ export const AddComment: React.FC = observer(() => { const { setToastAlert } = useToast(); const onSubmit = async (formData: Comment) => { - if (!workspace_slug || !project_slug || !issueId || isSubmitting || !formData.comment_html) return; + if (!workspaceSlug || !projectId || !issueId || isSubmitting || !formData.comment_html) return; - await issueDetailStore - .addIssueComment(workspace_slug.toString(), project_slug.toString(), issueId, formData) + await addIssueComment(workspaceSlug, projectId, issueId, formData) .then(() => { reset(defaultValues); editorRef.current?.clearEditor(); @@ -75,7 +72,7 @@ export const AddComment: React.FC = observer(() => { if (currentUser) handleSubmit(onSubmit)(e); }} workspaceId={workspaceId as string} - workspaceSlug={workspace_slug as string} + workspaceSlug={workspaceSlug} ref={editorRef} initialValue={ !value || value === "" || (typeof value === "object" && Object.keys(value).length === 0) diff --git a/space/components/issues/peek-overview/comment/comment-detail-card.tsx b/space/components/issues/peek-overview/comment/comment-detail-card.tsx index e3962c5e4..449b7883c 100644 --- a/space/components/issues/peek-overview/comment/comment-detail-card.tsx +++ b/space/components/issues/peek-overview/comment/comment-detail-card.tsx @@ -10,9 +10,7 @@ import { CommentReactions } from "@/components/issues/peek-overview"; // helpers import { timeAgo } from "@/helpers/date-time.helper"; // hooks -import { useMobxStore, useUser } from "@/hooks/store"; -// store -import { RootStore } from "@/store/root.store"; +import { useIssueDetails, useProject, useUser } from "@/hooks/store"; // types import { Comment } from "@/types/issue"; @@ -23,12 +21,13 @@ type Props = { export const CommentCard: React.FC = observer((props) => { const { comment, workspaceSlug } = props; - const { project }: RootStore = useMobxStore(); - const workspaceId = project.workspace?.id; - - // store - const { issueDetails: issueDetailStore } = useMobxStore(); + // store hooks + const { workspace } = useProject(); + const { peekId, deleteIssueComment, updateIssueComment } = useIssueDetails(); const { data: currentUser } = useUser(); + // derived values + const workspaceId = workspace?.id; + // states const [isEditing, setIsEditing] = useState(false); // refs @@ -44,15 +43,14 @@ export const CommentCard: React.FC = observer((props) => { }); const handleDelete = () => { - if (!workspaceSlug || !issueDetailStore.peekId) return; - issueDetailStore.deleteIssueComment(workspaceSlug, comment.project, issueDetailStore.peekId, comment.id); + if (!workspaceSlug || !peekId) return; + deleteIssueComment(workspaceSlug, comment.project, peekId, comment.id); }; const handleCommentUpdate = async (formData: Comment) => { - if (!workspaceSlug || !issueDetailStore.peekId) return; - issueDetailStore.updateIssueComment(workspaceSlug, comment.project, issueDetailStore.peekId, comment.id, formData); + if (!workspaceSlug || !peekId) return; + updateIssueComment(workspaceSlug, comment.project, peekId, comment.id, formData); setIsEditing(false); - editorRef.current?.setEditorValue(formData.comment_html); showEditorRef.current?.setEditorValue(formData.comment_html); }; @@ -135,7 +133,7 @@ export const CommentCard: React.FC = observer((props) => {
- +
diff --git a/space/components/issues/peek-overview/comment/comment-reactions.tsx b/space/components/issues/peek-overview/comment/comment-reactions.tsx index f6ce62fc4..a19502e53 100644 --- a/space/components/issues/peek-overview/comment/comment-reactions.tsx +++ b/space/components/issues/peek-overview/comment/comment-reactions.tsx @@ -1,58 +1,38 @@ import React from "react"; import { observer } from "mobx-react-lite"; -import { useRouter } from "next/navigation"; import { Tooltip } from "@plane/ui"; // ui import { ReactionSelector } from "@/components/ui"; // helpers import { groupReactions, renderEmoji } from "@/helpers/emoji.helper"; // hooks -import { useMobxStore, useUser } from "@/hooks/store"; +import { useIssueDetails, useUser } from "@/hooks/store"; type Props = { commentId: string; projectId: string; + workspaceSlug: string; }; export const CommentReactions: React.FC = observer((props) => { - const { commentId, projectId } = props; - - const router = useRouter(); - const { workspace_slug } = router.query; + const { commentId, projectId, workspaceSlug } = props; // hooks - const { issueDetails: issueDetailsStore } = useMobxStore(); + const { addCommentReaction, removeCommentReaction, details, peekId } = useIssueDetails(); const { data: user } = useUser(); - const peekId = issueDetailsStore.peekId; - const commentReactions = peekId - ? issueDetailsStore.details[peekId].comments.find((c) => c.id === commentId)?.comment_reactions - : []; + const commentReactions = peekId ? details[peekId].comments.find((c) => c.id === commentId)?.comment_reactions : []; const groupedReactions = peekId ? groupReactions(commentReactions ?? [], "reaction") : {}; const userReactions = commentReactions?.filter((r) => r.actor_detail.id === user?.id); const handleAddReaction = (reactionHex: string) => { - if (!workspace_slug || !projectId || !peekId) return; - - issueDetailsStore.addCommentReaction( - workspace_slug.toString(), - projectId.toString(), - peekId, - commentId, - reactionHex - ); + if (!workspaceSlug || !projectId || !peekId) return; + addCommentReaction(workspaceSlug, projectId, peekId, commentId, reactionHex); }; const handleRemoveReaction = (reactionHex: string) => { - if (!workspace_slug || !projectId || !peekId) return; - - issueDetailsStore.removeCommentReaction( - workspace_slug.toString(), - projectId.toString(), - peekId, - commentId, - reactionHex - ); + if (!workspaceSlug || !projectId || !peekId) return; + removeCommentReaction(workspaceSlug, projectId, peekId, commentId, reactionHex); }; const handleReactionClick = (reactionHex: string) => { diff --git a/space/components/issues/peek-overview/full-screen-peek-view.tsx b/space/components/issues/peek-overview/full-screen-peek-view.tsx index 617bbc687..f5918de43 100644 --- a/space/components/issues/peek-overview/full-screen-peek-view.tsx +++ b/space/components/issues/peek-overview/full-screen-peek-view.tsx @@ -14,10 +14,11 @@ type Props = { handleClose: () => void; issueDetails: IIssue | undefined; workspaceSlug: string; + projectId: string; }; export const FullScreenPeekView: React.FC = observer((props) => { - const { handleClose, issueDetails } = props; + const { handleClose, issueDetails, workspaceSlug, projectId } = props; return (
@@ -35,7 +36,11 @@ export const FullScreenPeekView: React.FC = observer((props) => {
{/* issue activity/comments */}
- +
) : ( diff --git a/space/components/issues/peek-overview/header.tsx b/space/components/issues/peek-overview/header.tsx index 17defbe36..3b8e2960f 100644 --- a/space/components/issues/peek-overview/header.tsx +++ b/space/components/issues/peek-overview/header.tsx @@ -2,19 +2,17 @@ import React from "react"; import { observer } from "mobx-react-lite"; import { MoveRight } from "lucide-react"; import { Listbox, Transition } from "@headlessui/react"; -// hooks // ui import { Icon } from "@/components/ui"; // helpers import { copyTextToClipboard } from "@/helpers/string.helper"; +// hooks +import { useIssueDetails } from "@/hooks/store"; +import useToast from "@/hooks/use-toast"; // store -import { useMobxStore } from "@/hooks/store"; import { IPeekMode } from "@/store/issue-detail.store"; -import { RootStore } from "@/store/root.store"; -// lib -import useToast from "hooks/use-toast"; // types -import { IIssue } from "types/issue"; +import { IIssue } from "@/types/issue"; type Props = { handleClose: () => void; @@ -42,7 +40,7 @@ const peekModes: { export const PeekOverviewHeader: React.FC = observer((props) => { const { handleClose } = props; - const { issueDetails: issueDetailStore }: RootStore = useMobxStore(); + const { peekMode, setPeekMode } = useIssueDetails(); const { setToastAlert } = useToast(); @@ -62,21 +60,19 @@ export const PeekOverviewHeader: React.FC = observer((props) => { <>
- {issueDetailStore.peekMode === "side" && ( + {peekMode === "side" && ( )} issueDetailStore.setPeekMode(val)} + value={peekMode} + onChange={(val) => setPeekMode(val)} className="relative flex-shrink-0 text-left" > - - m.key === issueDetailStore.peekMode)?.icon ?? ""} /> + + m.key === peekMode)?.icon ?? ""} /> = observer((props) => {
- {(issueDetailStore.peekMode === "side" || issueDetailStore.peekMode === "modal") && ( + {(peekMode === "side" || peekMode === "modal") && (
diff --git a/space/components/issues/peek-overview/issue-reaction.tsx b/space/components/issues/peek-overview/issue-reaction.tsx index 7daaa29e5..ae569a52e 100644 --- a/space/components/issues/peek-overview/issue-reaction.tsx +++ b/space/components/issues/peek-overview/issue-reaction.tsx @@ -1,13 +1,15 @@ +import { useParams } from "next/navigation"; import { IssueEmojiReactions, IssueVotes } from "@/components/issues/peek-overview"; import { useProject } from "@/hooks/store"; -type IssueReactionsProps = { - workspaceSlug: string; - projectId: string; -}; +// type IssueReactionsProps = { +// workspaceSlug: string; +// projectId: string; +// }; + +export const IssueReactions: React.FC = () => { + const { workspace_slug: workspaceSlug, project_id: projectId } = useParams(); -export const IssueReactions: React.FC = (props) => { - const { workspaceSlug, projectId } = props; const { canVote, canReact } = useProject(); return ( diff --git a/space/components/issues/peek-overview/layout.tsx b/space/components/issues/peek-overview/layout.tsx index f75f03f5f..aa4163610 100644 --- a/space/components/issues/peek-overview/layout.tsx +++ b/space/components/issues/peek-overview/layout.tsx @@ -68,7 +68,12 @@ export const IssuePeekOverview: React.FC = observer((props: any) => { leaveTo="translate-x-full" > - + @@ -102,13 +107,19 @@ export const IssuePeekOverview: React.FC = observer((props: any) => { }`} > {issueDetailStore.peekMode === "modal" && ( - + )} {issueDetailStore.peekMode === "full" && ( )}
diff --git a/space/components/issues/peek-overview/side-peek-view.tsx b/space/components/issues/peek-overview/side-peek-view.tsx index 8a8636edc..baa2b4ee5 100644 --- a/space/components/issues/peek-overview/side-peek-view.tsx +++ b/space/components/issues/peek-overview/side-peek-view.tsx @@ -7,16 +7,18 @@ import { PeekOverviewIssueDetails, PeekOverviewIssueProperties, } from "@/components/issues/peek-overview"; - -import { IIssue } from "types/issue"; +// types +import { IIssue } from "@/types/issue"; type Props = { handleClose: () => void; issueDetails: IIssue | undefined; + workspaceSlug: string; + projectId: string; }; export const SidePeekView: React.FC = observer((props) => { - const { handleClose, issueDetails } = props; + const { handleClose, issueDetails, workspaceSlug, projectId } = props; return (
@@ -37,7 +39,11 @@ export const SidePeekView: React.FC = observer((props) => {
{/* issue activity/comments */}
- +
) : ( diff --git a/space/components/views/project-details.tsx b/space/components/views/project-details.tsx index d9a9d9f59..f0fff758c 100644 --- a/space/components/views/project-details.tsx +++ b/space/components/views/project-details.tsx @@ -3,6 +3,7 @@ import { FC, useEffect } from "react"; import { observer } from "mobx-react-lite"; import Image from "next/image"; +import { useParams } from "next/navigation"; import useSWR from "swr"; // components import { IssueCalendarView } from "@/components/issues/board-views/calendar"; @@ -20,12 +21,13 @@ import SomethingWentWrongImage from "public/something-went-wrong.svg"; type ProjectDetailsViewProps = { workspaceSlug: string; projectId: string; - params: any; + peekId: string; }; export const ProjectDetailsView: FC = observer((props) => { - const { workspaceSlug, projectId, params } = props; - const { states, labels, priorities, peekId } = params; + const { workspaceSlug, projectId, peekId } = props; + // router + const params = useParams(); // store hooks const { fetchPublicIssues } = useIssue(); const { activeLayout } = useProject(); @@ -34,7 +36,7 @@ export const ProjectDetailsView: FC = observer((props) workspaceSlug && projectId ? "PROJECT_PUBLIC_ISSUES" : null, workspaceSlug && projectId ? () => fetchPublicIssues(workspaceSlug, projectId, params) : null ); - + // store hooks const issueStore = useIssue(); const issueDetailStore = useIssueDetails(); const { data: currentUser, fetchCurrentUser } = useUser(); @@ -79,12 +81,12 @@ export const ProjectDetailsView: FC = observer((props) {activeLayout === "list" && (
- +
)} {activeLayout === "kanban" && (
- +
)} {activeLayout === "calendar" && } diff --git a/space/hooks/use-editor-suggestions.tsx b/space/hooks/use-editor-suggestions.tsx deleted file mode 100644 index 937306f7b..000000000 --- a/space/hooks/use-editor-suggestions.tsx +++ /dev/null @@ -1,13 +0,0 @@ -import { useMobxStore } from "@/hooks/store"; -import { RootStore } from "@/store/root.store"; - -const useEditorSuggestions = () => { - const { mentionsStore }: RootStore = useMobxStore(); - - return { - // mentionSuggestions: mentionsStore.mentionSuggestions, - mentionHighlights: mentionsStore.mentionHighlights, - }; -}; - -export default useEditorSuggestions; diff --git a/space/lib/wrappers/index.ts b/space/lib/wrappers/index.ts index 51fab70a6..d40c4c886 100644 --- a/space/lib/wrappers/index.ts +++ b/space/lib/wrappers/index.ts @@ -1,2 +1 @@ -export * from "./instance-wrapper"; export * from "./auth-wrapper"; diff --git a/space/lib/wrappers/instance-wrapper.tsx b/space/lib/wrappers/instance-wrapper.tsx deleted file mode 100644 index 3be92ed05..000000000 --- a/space/lib/wrappers/instance-wrapper.tsx +++ /dev/null @@ -1,39 +0,0 @@ -import { FC, ReactNode } from "react"; -import { observer } from "mobx-react-lite"; -import useSWR from "swr"; -// ui -import { Spinner } from "@plane/ui"; -// components -import { InstanceNotReady, InstanceFailureView } from "@/components/instance"; -// hooks -import { useInstance } from "@/hooks/store"; - -type TInstanceWrapper = { - children: ReactNode; -}; - -export const InstanceWrapper: FC = observer((props) => { - const { children } = props; - // hooks - const { isLoading, instance, fetchInstanceInfo } = useInstance(); - - const { isLoading: isSWRLoading, mutate } = useSWR("INSTANCE_INFORMATION", () => fetchInstanceInfo(), { - revalidateOnFocus: false, - revalidateIfStale: false, - revalidateOnReconnect: false, - errorRetryCount: 0, - }); - - if (isSWRLoading || isLoading) - return ( -
- -
- ); - - if (!instance) return ; - - if (instance?.instance?.is_setup_done === false) return ; - - return <>{children}; -}); diff --git a/space/tsconfig.json b/space/tsconfig.json index f7833dff1..1305e698f 100644 --- a/space/tsconfig.json +++ b/space/tsconfig.json @@ -17,6 +17,7 @@ { "name": "next" } - ] + ], + "strictNullChecks": true } }