add queue status to UI
This commit is contained in:
parent
237accc973
commit
0f11873773
|
@ -83,17 +83,18 @@ export function selectActions(state: OnnxState) {
|
|||
};
|
||||
}
|
||||
|
||||
export const IMAGE_ERROR = 'error.image.';
|
||||
export const ANY_ERROR = 'error.';
|
||||
export const IMAGE_ERROR = `${ANY_ERROR}image.`;
|
||||
export const UNKNOWN_ERROR = `${IMAGE_ERROR}unknown`;
|
||||
|
||||
export function getImageErrorReason(image: FailedJobResponse | UnknownJobResponse) {
|
||||
if (image.status === JobStatus.FAILED) {
|
||||
const error = image.error;
|
||||
if (doesExist(error) && error.startsWith(IMAGE_ERROR)) {
|
||||
if (doesExist(error) && error.startsWith(ANY_ERROR)) {
|
||||
return error;
|
||||
}
|
||||
|
||||
return `${IMAGE_ERROR}.${error}`;
|
||||
return `${IMAGE_ERROR}${error}`;
|
||||
}
|
||||
|
||||
return UNKNOWN_ERROR;
|
||||
|
|
|
@ -3,7 +3,7 @@ import { Box, Button, Card, CardContent, CircularProgress, Typography } from '@m
|
|||
import { Stack } from '@mui/system';
|
||||
import { useMutation, useQuery } from '@tanstack/react-query';
|
||||
import * as React from 'react';
|
||||
import { useContext, useEffect } from 'react';
|
||||
import { useContext, useEffect, useMemo } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import { useStore } from 'zustand';
|
||||
import { shallow } from 'zustand/shallow';
|
||||
|
@ -58,6 +58,8 @@ export function LoadingCard(props: LoadingCardProps) {
|
|||
}
|
||||
}, [ready.status, getStatus(ready.data), getProgress(ready.data)]);
|
||||
|
||||
const status = useMemo(() => getStatus(ready.data), [ready.data]);
|
||||
|
||||
return <Card sx={{ maxWidth: params.width.default }}>
|
||||
<CardContent sx={{ height: params.height.default }}>
|
||||
<Box sx={{
|
||||
|
@ -72,7 +74,11 @@ export function LoadingCard(props: LoadingCardProps) {
|
|||
sx={{ alignItems: 'center' }}
|
||||
>
|
||||
{renderProgress()}
|
||||
{
|
||||
status === JobStatus.PENDING ?
|
||||
<Typography>{t('loading.queue', getQueue(ready.data))}</Typography> :
|
||||
<Typography>{t('loading.progress', selectStatus(ready.data, image))}</Typography>
|
||||
}
|
||||
<Button onClick={() => cancel.mutate()}>{t('loading.cancel')}</Button>
|
||||
</Stack>
|
||||
</Box>
|
||||
|
@ -138,3 +144,14 @@ function getStatus(data: Maybe<Array<JobResponse>>) {
|
|||
|
||||
return JobStatus.PENDING;
|
||||
}
|
||||
|
||||
function getQueue(data: Maybe<Array<JobResponse>>) {
|
||||
if (doesExist(data) && data[0].status === JobStatus.PENDING) {
|
||||
return data[0].queue;
|
||||
}
|
||||
|
||||
return {
|
||||
current: 0,
|
||||
total: 0,
|
||||
};
|
||||
}
|
||||
|
|
|
@ -80,6 +80,7 @@ export const I18N_STRINGS_DE = {
|
|||
loading: {
|
||||
cancel: 'Stornieren',
|
||||
progress: '{{current}} von {{total}} Schritten',
|
||||
queue: '',
|
||||
server: 'Verbindung zum Server...',
|
||||
unknown: 'vielen',
|
||||
},
|
||||
|
|
|
@ -72,6 +72,7 @@ export const I18N_STRINGS_EN = {
|
|||
loading: {
|
||||
cancel: 'Cancel',
|
||||
progress: '{{steps.current}} of {{steps.total}} steps, {{tiles.current}} of {{tiles.total}} tiles, {{stages.current}} of {{stages.total}} stages',
|
||||
queue: '{{current}} of {{total}} in queue',
|
||||
server: 'Connecting to server...',
|
||||
unknown: 'many',
|
||||
},
|
||||
|
|
|
@ -80,6 +80,7 @@ export const I18N_STRINGS_ES = {
|
|||
loading: {
|
||||
cancel: 'Cancelar',
|
||||
progress: '{{current}} de {{total}} pasos',
|
||||
queue: '',
|
||||
server: 'Conectando al servidor...',
|
||||
unknown: 'muchos',
|
||||
},
|
||||
|
|
|
@ -80,6 +80,7 @@ export const I18N_STRINGS_FR = {
|
|||
loading: {
|
||||
cancel: 'Annuler',
|
||||
progress: '{{current}} des {{total}} étapes',
|
||||
queue: '',
|
||||
server: 'Connexion au serveur...',
|
||||
unknown: 'nombreuses',
|
||||
},
|
||||
|
|
|
@ -75,7 +75,8 @@ export interface CancelledJobResponse extends BaseJobResponse {
|
|||
*/
|
||||
export interface FailedJobResponse extends BaseJobResponse {
|
||||
status: JobStatus.FAILED;
|
||||
error: string;
|
||||
|
||||
error?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -83,6 +84,7 @@ export interface FailedJobResponse extends BaseJobResponse {
|
|||
*/
|
||||
export interface PendingJobResponse extends BaseJobResponse {
|
||||
status: JobStatus.PENDING;
|
||||
|
||||
queue: Progress;
|
||||
}
|
||||
|
||||
|
|
Loading…
Reference in New Issue