Skip to content

Commit ec6a84d

Browse files
ErwanDecosterErwanDecoster
committed
feat: better error and loading handling logic in preview tables for apps, datasets, deals, tasks, and workerpools
1 parent 960cf5d commit ec6a84d

File tree

5 files changed

+46
-95
lines changed

5 files changed

+46
-95
lines changed

‎src/modules/apps/AppsPreviewTable.tsx‎

Lines changed: 9 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -36,30 +36,20 @@ export function AppsPreviewTable({ className }: { className?: string }) {
3636
(outdated)
3737
</span>
3838
)}
39-
{apps.isFetching && !apps.isPending && (
40-
<LoaderCircle className="animate-spin" />
41-
)}
39+
{apps.isFetching && <LoaderCircle className="animate-spin" />}
4240
</h2>
4341
<Button variant="link" className="-mr-4" asChild>
4442
<Link to="/apps">View all</Link>
4543
</Button>
4644
</div>
47-
{apps.isPending ||
48-
(apps.isError && !apps.data) ||
49-
!apps.data?.apps.length ? (
50-
apps.isPending ? (
51-
<CircularLoader />
52-
) : apps.isError ? (
53-
<Alert variant="destructive" className="mx-auto w-fit text-left">
54-
<Terminal className="h-4 w-4" />
55-
<AlertTitle>Error</AlertTitle>
56-
<AlertDescription>
57-
A error occurred during apps loading.
58-
</AlertDescription>
59-
</Alert>
60-
) : (
61-
<p>No apps to display.</p>
62-
)
45+
{(apps.isError || apps.errorUpdateCount > 0) && !apps.data ? (
46+
<Alert variant="destructive" className="mx-auto w-fit text-left">
47+
<Terminal className="h-4 w-4" />
48+
<AlertTitle>Error</AlertTitle>
49+
<AlertDescription>
50+
A error occurred during apps loading.
51+
</AlertDescription>
52+
</Alert>
6353
) : (
6454
<DataTable
6555
columns={columns}

‎src/modules/datasets/DatasetsPreviewTable.tsx‎

Lines changed: 9 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -36,30 +36,20 @@ export function DatasetsPreviewTable({ className }: { className?: string }) {
3636
(outdated)
3737
</span>
3838
)}
39-
{datasets.isFetching && !datasets.isPending && (
40-
<LoaderCircle className="animate-spin" />
41-
)}
39+
{datasets.isFetching && <LoaderCircle className="animate-spin" />}
4240
</h2>
4341
<Button variant="link" className="-mr-4" asChild>
4442
<Link to="/datasets">View all</Link>
4543
</Button>
4644
</div>
47-
{datasets.isPending ||
48-
(datasets.isError && !datasets.data) ||
49-
!datasets.data?.datasets.length ? (
50-
datasets.isPending ? (
51-
<CircularLoader />
52-
) : datasets.isError ? (
53-
<Alert variant="destructive" className="mx-auto w-fit text-left">
54-
<Terminal className="h-4 w-4" />
55-
<AlertTitle>Error</AlertTitle>
56-
<AlertDescription>
57-
A error occurred during datasets loading.
58-
</AlertDescription>
59-
</Alert>
60-
) : (
61-
<p>No datasets to display.</p>
62-
)
45+
{(datasets.isError || datasets.errorUpdateCount > 0) && !datasets.data ? (
46+
<Alert variant="destructive" className="mx-auto w-fit text-left">
47+
<Terminal className="h-4 w-4" />
48+
<AlertTitle>Error</AlertTitle>
49+
<AlertDescription>
50+
A error occurred during datasets loading.
51+
</AlertDescription>
52+
</Alert>
6353
) : (
6454
<DataTable
6555
columns={columns}

‎src/modules/deals/DealsPreviewTable.tsx‎

Lines changed: 9 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -36,30 +36,20 @@ export function DealsPreviewTable({ className }: { className?: string }) {
3636
(outdated)
3737
</span>
3838
)}
39-
{deals.isFetching && !deals.isPending && (
40-
<LoaderCircle className="animate-spin" />
41-
)}
39+
{deals.isFetching && <LoaderCircle className="animate-spin" />}
4240
</h2>
4341
<Button variant="link" className="-mr-4" asChild>
4442
<Link to="/deals">View all</Link>
4543
</Button>
4644
</div>
47-
{deals.isPending ||
48-
(deals.isError && !deals.data) ||
49-
!deals.data?.deals.length ? (
50-
deals.isPending ? (
51-
<CircularLoader />
52-
) : deals.isError ? (
53-
<Alert variant="destructive" className="mx-auto w-fit text-left">
54-
<Terminal className="h-4 w-4" />
55-
<AlertTitle>Error</AlertTitle>
56-
<AlertDescription>
57-
A error occurred during deals loading.
58-
</AlertDescription>
59-
</Alert>
60-
) : (
61-
<p>No deals to display.</p>
62-
)
45+
{(deals.isError || deals.errorUpdateCount > 0) && !deals.data ? (
46+
<Alert variant="destructive" className="mx-auto w-fit text-left">
47+
<Terminal className="h-4 w-4" />
48+
<AlertTitle>Error</AlertTitle>
49+
<AlertDescription>
50+
A error occurred during deals loading.
51+
</AlertDescription>
52+
</Alert>
6353
) : (
6454
<DataTable
6555
columns={columns}

‎src/modules/tasks/TasksPreviewTable.tsx‎

Lines changed: 9 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -36,30 +36,20 @@ export function TasksPreviewTable({ className }: { className?: string }) {
3636
(outdated)
3737
</span>
3838
)}
39-
{tasks.isFetching && !tasks.isPending && (
40-
<LoaderCircle className="animate-spin" />
41-
)}
39+
{tasks.isFetching && <LoaderCircle className="animate-spin" />}
4240
</h2>
4341
<Button variant="link" className="-mr-4" asChild>
4442
<Link to="/tasks">View all</Link>
4543
</Button>
4644
</div>
47-
{tasks.isPending ||
48-
(tasks.isError && !tasks.data) ||
49-
!tasks.data?.tasks.length ? (
50-
tasks.isPending ? (
51-
<CircularLoader />
52-
) : tasks.isError ? (
53-
<Alert variant="destructive" className="mx-auto w-fit text-left">
54-
<Terminal className="h-4 w-4" />
55-
<AlertTitle>Error</AlertTitle>
56-
<AlertDescription>
57-
A error occurred during tasks loading.
58-
</AlertDescription>
59-
</Alert>
60-
) : (
61-
<p>No tasks to display.</p>
62-
)
45+
{(tasks.isError || tasks.errorUpdateCount > 0) && !tasks.data ? (
46+
<Alert variant="destructive" className="mx-auto w-fit text-left">
47+
<Terminal className="h-4 w-4" />
48+
<AlertTitle>Error</AlertTitle>
49+
<AlertDescription>
50+
A error occurred during tasks loading.
51+
</AlertDescription>
52+
</Alert>
6353
) : (
6454
<DataTable
6555
columns={columns}

‎src/modules/workerpools/WorkerpoolsPreviewTable.tsx‎

Lines changed: 10 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -36,30 +36,21 @@ export function WorkerpoolsPreviewTable({ className }: { className?: string }) {
3636
(outdated)
3737
</span>
3838
)}
39-
{workerpools.isFetching && !workerpools.isPending && (
40-
<LoaderCircle className="animate-spin" />
41-
)}
39+
{workerpools.isFetching && <LoaderCircle className="animate-spin" />}
4240
</h2>
4341
<Button variant="link" className="-mr-4" asChild>
4442
<Link to="/workerpools">View all</Link>
4543
</Button>
4644
</div>
47-
{workerpools.isPending ||
48-
(workerpools.isError && !workerpools.data) ||
49-
!workerpools.data?.workerpools.length ? (
50-
workerpools.isPending ? (
51-
<CircularLoader />
52-
) : workerpools.isError ? (
53-
<Alert variant="destructive" className="mx-auto w-fit text-left">
54-
<Terminal className="h-4 w-4" />
55-
<AlertTitle>Error</AlertTitle>
56-
<AlertDescription>
57-
A error occurred during workerpools loading.
58-
</AlertDescription>
59-
</Alert>
60-
) : (
61-
<p>No workerpools to display.</p>
62-
)
45+
{(workerpools.isError || workerpools.errorUpdateCount > 0) &&
46+
!workerpools.data ? (
47+
<Alert variant="destructive" className="mx-auto w-fit text-left">
48+
<Terminal className="h-4 w-4" />
49+
<AlertTitle>Error</AlertTitle>
50+
<AlertDescription>
51+
A error occurred during workerpools loading.
52+
</AlertDescription>
53+
</Alert>
6354
) : (
6455
<DataTable
6556
columns={columns}

0 commit comments

Comments
 (0)