administrator/frigate
1
0
Fork 0
mirror of https://github.com/blakeblackshear/frigate.git synced 2026-07-09 13:31:14 +03:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

add loading spinner to exports

Browse Source
This commit is contained in:
Josh Hawkins 2026-05-08 08:13:45 -05:00
parent 95e8603055
commit 7f3118f1ef
1 changed files with 13 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
web/src/pages/Exports.tsx
View File

@ -5,6 +5,7 @@ import {
CaseCard, CaseCard,
ExportCard, ExportCard,
} from "@/components/card/ExportCard"; } from "@/components/card/ExportCard";
import ActivityIndicator from "@/components/indicators/activity-indicator";
import { import {
AlertDialog, AlertDialog,
AlertDialogCancel, AlertDialogCancel,
@ -864,6 +865,7 @@ function Exports() {
search={search} search={search}
selectedExports={selectedExports} selectedExports={selectedExports}
selectionMode={selectionMode} selectionMode={selectionMode}
isLoading={cases === undefined || rawExports === undefined}
onSelectExport={onSelectExport} onSelectExport={onSelectExport}
setSelected={setSelected} setSelected={setSelected}
renameClip={onHandleRename} renameClip={onHandleRename}
@ -882,6 +884,7 @@ function Exports() {
activeJobs={activeJobsByCase["none"] || []} activeJobs={activeJobsByCase["none"] || []}
selectedExports={selectedExports} selectedExports={selectedExports}
selectionMode={selectionMode} selectionMode={selectionMode}
isLoading={cases === undefined || rawExports === undefined}
onSelectExport={onSelectExport} onSelectExport={onSelectExport}
setSelectedCaseId={setSelectedCaseId} setSelectedCaseId={setSelectedCaseId}
setSelected={setSelected} setSelected={setSelected}
@ -903,6 +906,7 @@ type AllExportsViewProps = {
activeJobs: ExportJob[]; activeJobs: ExportJob[];
selectedExports: Export[]; selectedExports: Export[];
selectionMode: boolean; selectionMode: boolean;
isLoading: boolean;
onSelectExport: (e: Export) => void; onSelectExport: (e: Export) => void;
setSelectedCaseId: (id: string) => void; setSelectedCaseId: (id: string) => void;
setSelected: (e: Export) => void; setSelected: (e: Export) => void;
@ -919,6 +923,7 @@ function AllExportsView({
activeJobs, activeJobs,
selectedExports, selectedExports,
selectionMode, selectionMode,
isLoading,
onSelectExport, onSelectExport,
setSelectedCaseId, setSelectedCaseId,
setSelected, setSelected,
@ -1027,6 +1032,8 @@ function AllExportsView({
</div> </div>
)} )}
</div> </div>
) : isLoading ? (
<ActivityIndicator className="absolute left-1/2 top-1/2 -translate-x-1/2 -translate-y-1/2" />
) : ( ) : (
<div className="absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center justify-center text-center"> <div className="absolute left-1/2 top-1/2 flex -translate-x-1/2 -translate-y-1/2 flex-col items-center justify-center text-center">
<LuFolderX className="size-16" /> <LuFolderX className="size-16" />
@ -1046,6 +1053,7 @@ type CaseViewProps = {
search: string; search: string;
selectedExports: Export[]; selectedExports: Export[];
selectionMode: boolean; selectionMode: boolean;
isLoading: boolean;
onSelectExport: (e: Export) => void; onSelectExport: (e: Export) => void;
setSelected: (e: Export) => void; setSelected: (e: Export) => void;
renameClip: (id: string, update: string) => void; renameClip: (id: string, update: string) => void;
@ -1063,6 +1071,7 @@ function CaseView({
search, search,
selectedExports, selectedExports,
selectionMode, selectionMode,
isLoading,
onSelectExport, onSelectExport,
setSelected, setSelected,
renameClip, renameClip,
@ -1201,6 +1210,10 @@ function CaseView({
/> />
))} ))}
</div> </div>
) : isLoading ? (
<div className="flex min-h-[16rem] flex-1 items-center justify-center">
<ActivityIndicator />
</div>
) : ( ) : (
<div className="flex min-h-[16rem] flex-col items-center justify-center p-6 text-center"> <div className="flex min-h-[16rem] flex-col items-center justify-center p-6 text-center">
<LuFolderX className="size-12" /> <LuFolderX className="size-12" />