feat(ui): update canvas session state handling for new staging strat

This commit is contained in:
psychedelicious
2025-06-05 18:46:45 +10:00
parent e3fc244126
commit 3a08ea799a
24 changed files with 117 additions and 272 deletions

View File

@@ -2,7 +2,7 @@ import { ButtonGroup, Flex, Icon, IconButton, spinAnimation, Tooltip, useShiftMo
import { useAppSelector } from 'app/store/storeHooks';
import { ToolChooser } from 'features/controlLayers/components/Tool/ToolChooser';
import { CanvasManagerProviderGate } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
import { selectCanvasSession } from 'features/controlLayers/store/canvasStagingAreaSlice';
import { selectCanvasSessionType } from 'features/controlLayers/store/canvasStagingAreaSlice';
import { useCancelAllExceptCurrentQueueItemDialog } from 'features/queue/components/CancelAllExceptCurrentQueueItemConfirmationAlertDialog';
import { InvokeButtonTooltip } from 'features/queue/components/InvokeButtonTooltip/InvokeButtonTooltip';
import { useCancelCurrentQueueItem } from 'features/queue/hooks/useCancelCurrentQueueItem';
@@ -22,11 +22,11 @@ import { useGetQueueStatusQuery } from 'services/api/endpoints/queue';
export const FloatingLeftPanelButtons = memo((props: { onToggle: () => void }) => {
const tab = useAppSelector(selectActiveTab);
const session = useAppSelector(selectCanvasSession);
const type = useAppSelector(selectCanvasSessionType);
return (
<Flex pos="absolute" transform="translate(0, -50%)" top="50%" insetInlineStart={2} direction="column" gap={2}>
{tab === 'canvas' && session?.type === 'advanced' && (
{tab === 'canvas' && type === 'advanced' && (
<CanvasManagerProviderGate>
<ToolChooser />
</CanvasManagerProviderGate>

View File

@@ -4,7 +4,7 @@ import { useAppSelector } from 'app/store/storeHooks';
import { FocusRegionWrapper } from 'common/components/FocusRegionWrapper';
import { CanvasLayersPanelContent } from 'features/controlLayers/components/CanvasLayersPanelContent';
import { CanvasManagerProviderGate } from 'features/controlLayers/contexts/CanvasManagerProviderGate';
import { selectCanvasSession } from 'features/controlLayers/store/canvasStagingAreaSlice';
import { selectCanvasSessionType } from 'features/controlLayers/store/canvasStagingAreaSlice';
import { BoardsListPanelContent } from 'features/gallery/components/BoardsListPanelContent';
import { Gallery } from 'features/gallery/components/Gallery';
import { GalleryTopBar } from 'features/gallery/components/GalleryTopBar';
@@ -28,7 +28,7 @@ export const RightPanelContent = memo(() => {
const boardSearchText = useAppSelector(selectBoardSearchText);
const boardSearchDisclosure = useDisclosure({ defaultIsOpen: !!boardSearchText.length });
const imperativePanelGroupRef = useRef<ImperativePanelGroupHandle>(null);
const session = useAppSelector(selectCanvasSession);
const type = useAppSelector(selectCanvasSessionType);
const boardsListPanelOptions = useMemo<UsePanelOptions>(
() => ({
@@ -77,7 +77,7 @@ export const RightPanelContent = memo(() => {
<Panel order={1} id="gallery-wrapper-panel" collapsible {...galleryPanel.panelProps}>
<Gallery />
</Panel>
{session?.type === 'advanced' && (
{type === 'advanced' && (
<>
<HorizontalResizeHandle id="gallery-panel-to-layers-handle" {...galleryPanel.resizeHandleProps} />
<Panel order={2} id="canvas-layers-panel" collapsible {...canvasLayersPanel.panelProps}>