feat: bring back refresh indicator

This commit is contained in:
bennykok 2024-02-01 16:08:50 +08:00
parent bef6ce35de
commit 4c715b815a
2 changed files with 11 additions and 5 deletions

View File

@ -13,12 +13,12 @@ export default async function Page({
const workflow_id = params.workflow_id; const workflow_id = params.workflow_id;
return ( return (
<Card className="w-full h-fit min-w-0"> <Card className="w-full h-fit min-w-0 relative">
<CardHeader className="relative"> <CardHeader>
<CardTitle>Run</CardTitle> <CardTitle>Run</CardTitle>
<div className="absolute right-6 top-6"> {/* <div className="absolute right-6 top-6">
<RouteRefresher interval={5000} autoRefresh={false} /> <RouteRefresher interval={5000} autoRefresh={false} />
</div> </div> */}
</CardHeader> </CardHeader>
<CardContent> <CardContent>

View File

@ -16,6 +16,7 @@ import {
import { PaginationControl } from "./PaginationControl"; import { PaginationControl } from "./PaginationControl";
import { RunDisplay } from "./RunDisplay"; import { RunDisplay } from "./RunDisplay";
import useSWR from "swr"; import useSWR from "swr";
import { LoadingIcon } from "@/components/LoadingIcon";
const itemPerPage = 6; const itemPerPage = 6;
const pageParser = parseAsInteger.withDefault(1); const pageParser = parseAsInteger.withDefault(1);
@ -25,7 +26,7 @@ export function RunsTable(props: {
searchParams: { [key: string]: any }; searchParams: { [key: string]: any };
}) { }) {
const page = pageParser.parse(props.searchParams?.page ?? undefined) ?? 1; const page = pageParser.parse(props.searchParams?.page ?? undefined) ?? 1;
const { data, error, isLoading } = useSWR( const { data, error, isLoading, isValidating } = useSWR(
"runs+" + page, "runs+" + page,
async () => { async () => {
const data = await getAllRunstableContent({ const data = await getAllRunstableContent({
@ -45,6 +46,11 @@ export function RunsTable(props: {
return ( return (
<div> <div>
{isValidating ? (
<div className="absolute right-8 top-8">
<LoadingIcon />
</div>
) : null}
<div className="overflow-auto h-fit w-full"> <div className="overflow-auto h-fit w-full">
<Table className=""> <Table className="">
{/* {data?.allRuns.length === 0 && ( {/* {data?.allRuns.length === 0 && (