Mirrored_Repos/InvokeAI
1
0
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI synced 2024-08-30 20:32:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore(ui): format

Browse Source
This commit is contained in:
psychedelicious 2024-01-19 14:50:27 +11:00
parent e03c88ce32
commit 4b1740ad19
2 changed files with 28 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

43
invokeai/frontend/web/src/features/queue/components/ClearQueueIconButton.tsx
View File

@ -5,13 +5,16 @@ import ClearQueueConfirmationAlertDialog from 'features/queue/components/ClearQu
import { useCancelCurrentQueueItem } from 'features/queue/hooks/useCancelCurrentQueueItem'; import { useCancelCurrentQueueItem } from 'features/queue/hooks/useCancelCurrentQueueItem';
import { useClearQueue } from 'features/queue/hooks/useClearQueue'; import { useClearQueue } from 'features/queue/hooks/useClearQueue';
import { useState } from 'react'; import { useState } from 'react';
import { useHotkeys } from 'react-hotkeys-hook' import { useHotkeys } from 'react-hotkeys-hook';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import { PiTrashSimpleBold } from 'react-icons/pi'; import { PiTrashSimpleBold } from 'react-icons/pi';
type Props = Omit<InvIconButtonProps, 'aria-label'>; type Props = Omit<InvIconButtonProps, 'aria-label'>;
const ClearQueueIconButton = ({ onOpen, ...props }: Props & { onOpen: () => void }) => { const ClearQueueIconButton = ({
onOpen,
...props
}: Props & { onOpen: () => void }) => {
const { t } = useTranslation(); const { t } = useTranslation();
const { isLoading, isDisabled } = useClearQueue(); const { isLoading, isDisabled } = useClearQueue();
@ -34,11 +37,8 @@ const ClearQueueIconButton = ({ onOpen, ...props }: Props & { onOpen: () => void
const ClearSingleQueueItemIconButton = (props: Props) => { const ClearSingleQueueItemIconButton = (props: Props) => {
const { t } = useTranslation(); const { t } = useTranslation();
const { const { cancelQueueItem, isLoading, isDisabled } =
cancelQueueItem, useCancelCurrentQueueItem();
isLoading,
isDisabled,
} = useCancelCurrentQueueItem();
return ( return (
<> <>
@ -55,26 +55,33 @@ const ClearSingleQueueItemIconButton = (props: Props) => {
/> />
</> </>
); );
} };
export const ClearQueueButton = (props: Props) => { export const ClearQueueButton = (props: Props) => {
// Show the single item clear button when shift is pressed // Show the single item clear button when shift is pressed
// Otherwise show the clear queue button // Otherwise show the clear queue button
const [showSingleItemClear, setShowSingleItemClear] = useState(true) const [showSingleItemClear, setShowSingleItemClear] = useState(true);
useHotkeys('shift', () => setShowSingleItemClear(false), { keydown: true, keyup: false }) useHotkeys('shift', () => setShowSingleItemClear(false), {
useHotkeys('shift', () => setShowSingleItemClear(true), { keydown: false, keyup: true }); keydown: true,
keyup: false,
});
useHotkeys('shift', () => setShowSingleItemClear(true), {
keydown: false,
keyup: true,
});
const disclosure = useDisclosure() const disclosure = useDisclosure();
return ( return (
<> <>
{showSingleItemClear {showSingleItemClear ? (
? <ClearSingleQueueItemIconButton {...props} /> <ClearSingleQueueItemIconButton {...props} />
: <ClearQueueIconButton {...props} onOpen={disclosure.onOpen} /> ) : (
} <ClearQueueIconButton {...props} onOpen={disclosure.onOpen} />
)}
<ClearQueueConfirmationAlertDialog disclosure={disclosure} /> <ClearQueueConfirmationAlertDialog disclosure={disclosure} />
</> </>
) );
} };
export default ClearQueueButton; export default ClearQueueButton;

8
invokeai/frontend/web/src/features/queue/components/QueueActionsMenuButton.tsx
View File

@ -26,7 +26,7 @@ export const QueueActionsMenuButton = memo(() => {
const { isOpen, onOpen, onClose } = useDisclosure(); const { isOpen, onOpen, onClose } = useDisclosure();
const dispatch = useAppDispatch(); const dispatch = useAppDispatch();
const { t } = useTranslation(); const { t } = useTranslation();
const clearQueueDisclosure = useDisclosure() const clearQueueDisclosure = useDisclosure();
const isPauseEnabled = useFeatureStatus('pauseQueue').isFeatureEnabled; const isPauseEnabled = useFeatureStatus('pauseQueue').isFeatureEnabled;
const isResumeEnabled = useFeatureStatus('resumeQueue').isFeatureEnabled; const isResumeEnabled = useFeatureStatus('resumeQueue').isFeatureEnabled;
const { queueSize } = useGetQueueStatusQuery(undefined, { const { queueSize } = useGetQueueStatusQuery(undefined, {
@ -36,10 +36,8 @@ export const QueueActionsMenuButton = memo(() => {
: 0, : 0,
}), }),
}); });
const { const { isLoading: isLoadingClearQueue, isDisabled: isDisabledClearQueue } =
isLoading: isLoadingClearQueue, useClearQueue();
isDisabled: isDisabledClearQueue,
} = useClearQueue();
const { const {
resumeProcessor, resumeProcessor,
isLoading: isLoadingResumeProcessor, isLoading: isLoadingResumeProcessor,