From 0eee4648917f664011736cfc48a895662f2219cd Mon Sep 17 00:00:00 2001
From: Sean Sube <seansube@gmail.com>
Date: Sat, 4 Feb 2023 12:46:49 -0600
Subject: [PATCH] fix(gui): query for each loading image separately

---
 gui/src/components/LoadingCard.tsx | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/gui/src/components/LoadingCard.tsx b/gui/src/components/LoadingCard.tsx
index 2066c1f2..7cc18987 100644
--- a/gui/src/components/LoadingCard.tsx
+++ b/gui/src/components/LoadingCard.tsx
@@ -29,7 +29,7 @@ export function LoadingCard(props: LoadingCardProps) {
   const setReady = useStore(state, (s) => s.setReady);
 
   const cancel = useMutation(() => client.cancel(props.loading));
-  const ready = useQuery('ready', () => client.ready(props.loading), {
+  const ready = useQuery(`ready-${props.loading.output.key}`, () => client.ready(props.loading), {
     // data will always be ready without this, even if the API says its not
     cacheTime: 0,
     refetchInterval: POLL_TIME,
@@ -90,7 +90,7 @@ export function LoadingCard(props: LoadingCardProps) {
           sx={{ alignItems: 'center' }}
         >
           {renderProgress()}
-          <Typography>{getProgress()} of {props.loading.params.steps}</Typography>
+          <Typography>{getProgress()}/{props.loading.params.steps} steps</Typography>
           <Button onClick={() => cancel.mutate()}>Cancel</Button>
         </Stack>
       </Box>