feat(ui): do not require root ref to focus on prompt

This commit is contained in:
psychedelicious
2025-07-04 16:02:32 +10:00
parent 56873f6936
commit 69a56aafed
2 changed files with 6 additions and 14 deletions

View File

@@ -1,5 +1,4 @@
import { Button, Flex, Grid, Heading, Text } from '@invoke-ai/ui-library';
import { useAutoLayoutContext } from 'features/ui/layouts/auto-layout-context';
import { navigationApi } from 'features/ui/layouts/navigation-api';
import { WORKSPACE_PANEL_ID } from 'features/ui/layouts/shared';
import { memo, useCallback } from 'react';
@@ -13,10 +12,9 @@ import { LaunchpadUseALayoutImageButton } from './LaunchpadUseALayoutImageButton
export const CanvasLaunchpadPanel = memo(() => {
const { t } = useTranslation();
const { tab } = useAutoLayoutContext();
const focusCanvas = useCallback(() => {
navigationApi.focusPanel(tab, WORKSPACE_PANEL_ID);
}, [tab]);
navigationApi.focusPanel('canvas', WORKSPACE_PANEL_ID);
}, []);
return (
<Flex flexDir="column" h="full" w="full" alignItems="center" gap={2}>
<Flex flexDir="column" w="full" gap={4} px={14} maxW={768} pt="20vh">

View File

@@ -1,11 +1,10 @@
import { Flex, Heading, Icon, Text } from '@invoke-ai/ui-library';
import { LaunchpadButton } from 'features/controlLayers/components/SimpleSession/LaunchpadButton';
import { useAutoLayoutContext } from 'features/ui/layouts/auto-layout-context';
import { memo, useCallback } from 'react';
import { PiCursorTextBold, PiTextAaBold } from 'react-icons/pi';
const focusOnPrompt = (el: HTMLElement) => {
const promptElement = el.querySelector('.positive-prompt-textarea');
const focusOnPrompt = () => {
const promptElement = document.querySelector('.positive-prompt-textarea');
if (promptElement instanceof HTMLTextAreaElement) {
promptElement.focus();
promptElement.select();
@@ -13,15 +12,10 @@ const focusOnPrompt = (el: HTMLElement) => {
};
export const LaunchpadGenerateFromTextButton = memo((props: { extraAction?: () => void }) => {
const { rootRef } = useAutoLayoutContext();
const onClick = useCallback(() => {
const el = rootRef.current;
if (!el) {
return;
}
focusOnPrompt(el);
focusOnPrompt();
props.extraAction?.();
}, [props, rootRef]);
}, [props]);
return (
<LaunchpadButton onClick={onClick} position="relative" gap={8}>
<Icon as={PiTextAaBold} boxSize={8} color="base.500" />