mirror of
https://github.com/invoke-ai/InvokeAI.git
synced 2026-02-14 20:45:02 -05:00
e8335fe7c4
- Canvas generation mode is replace with a boolean `sendToCanvas` flag. When off, images generated on the canvas go to the gallery. When on, they get added to the staging area. - When an image result is received, if its destination is the canvas, staging is automatically started. - Updated queue list to show the destination column. - Added `IconSwitch` component to represent binary choices, used for the new `sendToCanvas` flag and image viewer toggle. - Remove the queue actions menu in `QueueControls`. Move the queue count badge to the cancel button. - Redo layout of `QueueControls` to prevent duplicate queue count badges. - Fix issue where gallery and options panels could show thru transparent regions of queue tab. - Disable panel hotkeys when on mm/queue tabs.
36 lines
1.1 KiB
TypeScript
36 lines
1.1 KiB
TypeScript
import { IconButton, Tooltip } from '@invoke-ai/ui-library';
|
|
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
|
|
import { selectActiveTab } from 'features/ui/store/uiSelectors';
|
|
import { setActiveTab } from 'features/ui/store/uiSlice';
|
|
import type { TabName } from 'features/ui/store/uiTypes';
|
|
import { forwardRef, memo, type ReactElement, useCallback } from 'react';
|
|
|
|
export const TabButton = memo(
|
|
forwardRef(({ tab, icon, label }: { tab: TabName; icon: ReactElement; label: string }, ref) => {
|
|
const dispatch = useAppDispatch();
|
|
const activeTabName = useAppSelector(selectActiveTab);
|
|
const onClick = useCallback(() => {
|
|
dispatch(setActiveTab(tab));
|
|
}, [dispatch, tab]);
|
|
|
|
return (
|
|
<Tooltip label={label} placement="end">
|
|
<IconButton
|
|
ref={ref}
|
|
p={0}
|
|
onClick={onClick}
|
|
icon={icon}
|
|
size="md"
|
|
fontSize="24px"
|
|
variant="appTab"
|
|
data-selected={activeTabName === tab}
|
|
aria-label={label}
|
|
data-testid={label}
|
|
/>
|
|
</Tooltip>
|
|
);
|
|
})
|
|
);
|
|
|
|
TabButton.displayName = 'TabButton';
|