fix(ui): fix model edit button disabled status

This commit is contained in:
psychedelicious 2023-07-14 17:36:10 +10:00
parent 48a8bd4985
commit 6d7fb49a7a
3 changed files with 11 additions and 15 deletions

View File

@ -6,13 +6,13 @@ import { Divider, Flex, Text } from '@chakra-ui/react';
import { useForm } from '@mantine/form';
import { useTranslation } from 'react-i18next';
import type { RootState } from 'app/store/store';
import IAIButton from 'common/components/IAIButton';
import IAIMantineSelect from 'common/components/IAIMantineSelect';
import { makeToast } from 'app/components/Toaster';
import IAIMantineTextInput from 'common/components/IAIMantineInput';
import { MODEL_TYPE_MAP } from 'features/parameters/types/constants';
import { selectIsBusy } from 'features/system/store/systemSelectors';
import { addToast } from 'features/system/store/systemSlice';
import { useUpdateMainModelsMutation } from 'services/api/endpoints/models';
import { components } from 'services/api/schema';
@ -39,9 +39,7 @@ type CheckpointModelEditProps = {
};
export default function CheckpointModelEdit(props: CheckpointModelEditProps) {
const isProcessing = useAppSelector(
(state: RootState) => state.system.isProcessing
);
const isBusy = useAppSelector(selectIsBusy);
const { modelToEdit, retrievedModel } = props;
@ -153,8 +151,8 @@ export default function CheckpointModelEdit(props: CheckpointModelEditProps) {
{...checkpointEditForm.getInputProps('config')}
/>
<IAIButton
disabled={isProcessing}
type="submit"
isDisabled={isBusy || isLoading}
isLoading={isLoading}
>
{t('modelManager.updateModel')}

View File

@ -7,12 +7,12 @@ import { useTranslation } from 'react-i18next';
import { useForm } from '@mantine/form';
import { makeToast } from 'app/components/Toaster';
import type { RootState } from 'app/store/store';
import IAIButton from 'common/components/IAIButton';
import IAIMantineTextInput from 'common/components/IAIMantineInput';
import IAIMantineSelect from 'common/components/IAIMantineSelect';
import { MODEL_TYPE_MAP } from 'features/parameters/types/constants';
import { selectIsBusy } from 'features/system/store/systemSelectors';
import { addToast } from 'features/system/store/systemSlice';
import { useUpdateMainModelsMutation } from 'services/api/endpoints/models';
import { components } from 'services/api/schema';
@ -38,9 +38,8 @@ const variantSelectData = [
];
export default function DiffusersModelEdit(props: DiffusersModelEditProps) {
const isProcessing = useAppSelector(
(state: RootState) => state.system.isProcessing
);
const isBusy = useAppSelector(selectIsBusy);
const { retrievedModel, modelToEdit } = props;
const [updateMainModel, { isLoading, error }] = useUpdateMainModelsMutation();
@ -138,8 +137,8 @@ export default function DiffusersModelEdit(props: DiffusersModelEditProps) {
{...diffusersEditForm.getInputProps('vae')}
/>
<IAIButton
disabled={isProcessing}
type="submit"
isDisabled={isBusy || isLoading}
isLoading={isLoading}
>
{t('modelManager.updateModel')}

View File

@ -13,6 +13,7 @@ import { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import IAIAlertDialog from 'common/components/IAIAlertDialog';
import IAIIconButton from 'common/components/IAIIconButton';
import { selectIsBusy } from 'features/system/store/systemSelectors';
import { setOpenModel } from 'features/system/store/systemSlice';
import { useTranslation } from 'react-i18next';
import { useDeleteMainModelsMutation } from 'services/api/endpoints/models';
@ -26,9 +27,7 @@ type ModelListItemProps = {
};
export default function ModelListItem(props: ModelListItemProps) {
const { isProcessing, isConnected } = useAppSelector(
(state: RootState) => state.system
);
const isBusy = useAppSelector(selectIsBusy);
const { colorMode } = useColorMode();
@ -89,7 +88,7 @@ export default function ModelListItem(props: ModelListItemProps) {
size="sm"
onClick={openModelHandler}
aria-label={t('accessibility.modifyConfig')}
isDisabled={status === 'active' || isProcessing || !isConnected}
isDisabled={isBusy}
/>
<IAIAlertDialog
title={t('modelManager.deleteModel')}
@ -100,7 +99,7 @@ export default function ModelListItem(props: ModelListItemProps) {
icon={<DeleteIcon />}
size="sm"
aria-label={t('modelManager.deleteConfig')}
isDisabled={status === 'active' || isProcessing || !isConnected}
isDisabled={isBusy}
colorScheme="error"
/>
}