github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-02-14 23:45:07 -05:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): simple session initial state

Browse Source
This commit is contained in:
psychedelicious
2025-06-06 20:05:02 +10:00
parent 9df69496e4
commit 2531366386
16 changed files with 291 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

32
invokeai/frontend/web/src/features/queue/components/DeleteAllExceptCurrentButton.tsx Normal file
View File

@@ -0,0 +1,32 @@
import type { ButtonProps } from '@invoke-ai/ui-library';
import { Button } from '@invoke-ai/ui-library';
import { useDeleteAllExceptCurrentQueueItemDialog } from 'features/queue/components/DeleteAllExceptCurrentQueueItemConfirmationAlertDialog';
import { memo } from 'react';
import { useTranslation } from 'react-i18next';
import { PiXCircle } from 'react-icons/pi';
type Props = ButtonProps;
export const DeleteAllExceptCurrentButton = memo((props: Props) => {
const { t } = useTranslation();
const deleteAllExceptCurrent = useDeleteAllExceptCurrentQueueItemDialog();
return (
<>
<Button
onClick={deleteAllExceptCurrent.openDialog}
isLoading={deleteAllExceptCurrent.isLoading}
isDisabled={deleteAllExceptCurrent.isDisabled}
tooltip={t('queue.cancelAllExceptCurrentTooltip')}
leftIcon={<PiXCircle />}
colorScheme="error"
data-testid={t('queue.clear')}
{...props}
>
{t('queue.clear')}
</Button>
</>
);
});
DeleteAllExceptCurrentButton.displayName = 'DeleteAllExceptCurrentButton';

25
invokeai/frontend/web/src/features/queue/components/DeleteAllExceptCurrentIconButton.tsx Normal file
View File

@@ -0,0 +1,25 @@
import { IconButton } from '@invoke-ai/ui-library';
import { useDeleteAllExceptCurrentQueueItemDialog } from 'features/queue/components/DeleteAllExceptCurrentQueueItemConfirmationAlertDialog';
import { memo } from 'react';
import { useTranslation } from 'react-i18next';
import { PiXCircle } from 'react-icons/pi';
export const DeleteAllExceptCurrentIconButton = memo(() => {
const { t } = useTranslation();
const deleteAllExceptCurrent = useDeleteAllExceptCurrentQueueItemDialog();
return (
<IconButton
size="lg"
isDisabled={deleteAllExceptCurrent.isDisabled}
isLoading={deleteAllExceptCurrent.isLoading}
aria-label={t('queue.clear')}
tooltip={t('queue.cancelAllExceptCurrentTooltip')}
icon={<PiXCircle />}
colorScheme="error"
onClick={deleteAllExceptCurrent.openDialog}
/>
);
});
DeleteAllExceptCurrentIconButton.displayName = 'DeleteAllExceptCurrentIconButton';

4
invokeai/frontend/web/src/features/queue/components/QueueControls.tsx
View File

@@ -1,5 +1,5 @@
import { Flex, Spacer, useShiftModifier } from '@invoke-ai/ui-library';
import { DeleteAllExceptCurrentQueueItemConfirmationAlertDialog } from 'features/queue/components/DeleteAllExceptCurrentQueueItemConfirmationAlertDialog';
import { DeleteAllExceptCurrentIconButton } from 'features/queue/components/DeleteAllExceptCurrentIconButton';
import { DeleteCurrentQueueItemIconButton } from 'features/queue/components/DeleteCurrentQueueItemIconButton';
import { QueueActionsMenuButton } from 'features/queue/components/QueueActionsMenuButton';
import ProgressBar from 'features/system/components/ProgressBar';
@@ -30,7 +30,7 @@ export const DeleteIconButton = memo(() => {
return <DeleteCurrentQueueItemIconButton />;
}
return <DeleteAllExceptCurrentQueueItemConfirmationAlertDialog />;
return <DeleteAllExceptCurrentIconButton />;
});
DeleteIconButton.displayName = 'DeleteIconButton';

5
invokeai/frontend/web/src/features/queue/components/QueueTabQueueControls.tsx
View File

@@ -1,6 +1,5 @@
/* eslint-disable i18next/no-literal-string */
import { ButtonGroup, Flex } from '@invoke-ai/ui-library';
import { DeleteAllExceptCurrentQueueItemConfirmationAlertDialog } from 'features/queue/components/DeleteAllExceptCurrentQueueItemConfirmationAlertDialog';
import { DeleteAllExceptCurrentButton } from 'features/queue/components/DeleteAllExceptCurrentButton';
import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
import { memo } from 'react';
@@ -24,7 +23,7 @@ const QueueTabQueueControls = () => {
)}
<ButtonGroup w={28} orientation="vertical" size="sm">
<PruneQueueButton />
<DeleteAllExceptCurrentQueueItemConfirmationAlertDialog />
<DeleteAllExceptCurrentButton />
</ButtonGroup>
</Flex>
<ClearModelCacheButton />