binarybeach/bb-plane-fork
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix project issue loader and error handling (#5223)

Browse source
This commit is contained in:
rahulramesha 2024-07-25 14:15:16 +05:30 • committed by GitHub
parent 1bf8f82ccb
commit c2c2ad0d7a
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 39 additions and 39 deletions
Download patch file Download diff file Expand all files Collapse all files

7
space/app/issues/[anchor]/layout.tsx
View file

@ -6,6 +6,7 @@ import useSWR from "swr";
// components
import { LogoSpinner } from "@/components/common";
import { IssuesNavbarRoot } from "@/components/issues";
import { SomethingWentWrongError } from "@/components/issues/issue-layouts/error";
// hooks
import { useIssueFilter, usePublish, usePublishList } from "@/hooks/store";
// assets
@ -27,7 +28,7 @@ const IssuesLayout = observer((props: Props) => {
const publishSettings = usePublish(anchor);
const { updateLayoutOptions } = useIssueFilter();
// fetch publish settings
useSWR(
const { error } = useSWR(
anchor ? `PUBLISH_SETTINGS_${anchor}` : null,
anchor
? async () => {
@ -45,7 +46,9 @@ const IssuesLayout = observer((props: Props) => {
: null
);
if (!publishSettings) return <LogoSpinner />;
if (!publishSettings && !error) return <LogoSpinner />;
if (error) return <SomethingWentWrongError />;
return (
<div className="relative flex h-screen min-h-[500px] w-screen flex-col overflow-hidden">

17
space/core/components/issues/issue-layouts/error.tsx Normal file
View file

@ -0,0 +1,17 @@
import Image from "next/image";
// assets
import SomethingWentWrongImage from "public/something-went-wrong.svg";
export const SomethingWentWrongError = () => (
<div className="grid h-full w-full place-items-center p-6">
<div className="text-center">
<div className="mx-auto grid h-52 w-52 place-items-center rounded-full bg-custom-background-80">
<div className="grid h-32 w-32 place-items-center">
<Image src={SomethingWentWrongImage} alt="Oops! Something went wrong" />
</div>
</div>
<h1 className="mt-12 text-3xl font-semibold">Oops! Something went wrong.</h1>
<p className="mt-4 text-custom-text-300">The public board does not exist. Please check the URL.</p>
</div>
</div>
);

54
space/core/components/issues/issue-layouts/root.tsx
View file

@ -2,7 +2,6 @@
import { FC, useEffect } from "react";
import { observer } from "mobx-react";
import Image from "next/image";
import useSWR from "swr";
// components
import { IssueKanbanLayoutRoot, IssuesListLayoutRoot } from "@/components/issues";
@ -13,7 +12,7 @@ import { useIssue, useIssueDetails, useIssueFilter } from "@/hooks/store";
// store
import { PublishStore } from "@/store/publish/publish.store";
// assets
import SomethingWentWrongImage from "public/something-went-wrong.svg";
import { SomethingWentWrongError } from "./error";
type Props = {
peekId: string | undefined;
@ -24,7 +23,7 @@ export const IssuesLayoutsRoot: FC<Props> = observer((props) => {
const { peekId, publishSettings } = props;
// store hooks
const { getIssueFilters } = useIssueFilter();
const { loader, groupedIssueIds, fetchPublicIssues } = useIssue();
const { fetchPublicIssues } = useIssue();
const issueDetailStore = useIssueDetails();
// derived values
const { anchor } = publishSettings;
@ -48,46 +47,27 @@ export const IssuesLayoutsRoot: FC<Props> = observer((props) => {
if (!anchor) return null;
if (error) return <SomethingWentWrongError />;
return (
<div className="relative h-full w-full overflow-hidden">
{peekId && <IssuePeekOverview anchor={anchor} peekId={peekId} />}
{activeLayout && (
<div className="relative flex h-full w-full flex-col overflow-hidden">
{/* applied filters */}
<IssueAppliedFilters anchor={anchor} />
{loader && !groupedIssueIds ? (
<div className="py-10 text-center text-sm text-custom-text-100">Loading...</div>
) : (
<>
{error ? (
<div className="grid h-full w-full place-items-center p-6">
<div className="text-center">
<div className="mx-auto grid h-52 w-52 place-items-center rounded-full bg-custom-background-80">
<div className="grid h-32 w-32 place-items-center">
<Image src={SomethingWentWrongImage} alt="Oops! Something went wrong" />
</div>
</div>
<h1 className="mt-12 text-3xl font-semibold">Oops! Something went wrong.</h1>
<p className="mt-4 text-custom-text-300">The public board does not exist. Please check the URL.</p>
</div>
{activeLayout === "list" && (
<div className="relative h-full w-full overflow-y-auto">
<IssuesListLayoutRoot anchor={anchor} />
</div>
) : (
activeLayout && (
<div className="relative flex h-full w-full flex-col overflow-hidden">
{/* applied filters */}
<IssueAppliedFilters anchor={anchor} />
{activeLayout === "list" && (
<div className="relative h-full w-full overflow-y-auto">
<IssuesListLayoutRoot anchor={anchor} />
</div>
)}
{activeLayout === "kanban" && (
<div className="relative mx-auto h-full w-full p-5">
<IssueKanbanLayoutRoot anchor={anchor} />
</div>
)}
</div>
)
)}
</>
{activeLayout === "kanban" && (
<div className="relative mx-auto h-full w-full p-5">
<IssueKanbanLayoutRoot anchor={anchor} />
</div>
)}
</div>
)}
</div>
);