github/InvokeAI
1
1
Fork 0
mirror of https://github.com/invoke-ai/InvokeAI.git synced 2026-02-18 22:24:34 -05:00
Code Issues Packages Projects Releases Wiki Activity

fix(ui): tidy remaining selectors

Browse Source 
These were just using overly verbose syntax - like explicitly typing `state: RootState`, which is unnecessary.
This commit is contained in:
psychedelicious
2024-01-05 20:33:10 +11:00
parent f5f378d04b
commit 367de44a8b
43 changed files with 91 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
invokeai/frontend/web/src/features/canvas/components/IAICanvasToolbar/IAICanvasUndoButton.tsx
View File

@@ -1,7 +1,7 @@
import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvIconButton } from 'common/components/InvIconButton/InvIconButton';
import { selectCanvasSlice,undo } from 'features/canvas/store/canvasSlice';
import { selectCanvasSlice, undo } from 'features/canvas/store/canvasSlice';
import { activeTabNameSelector } from 'features/ui/store/uiSelectors';
import { memo, useCallback } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';

4
invokeai/frontend/web/src/features/controlAdapters/hooks/useAddControlAdapter.ts
View File

@@ -6,9 +6,7 @@ import { useCallback, useMemo } from 'react';
import { useControlAdapterModels } from './useControlAdapterModels';
export const useAddControlAdapter = (type: ControlAdapterType) => {
const baseModel = useAppSelector(
(s) => s.generation.model?.base_model
);
const baseModel = useAppSelector((s) => s.generation.model?.base_model);
const dispatch = useAppDispatch();
const models = useControlAdapterModels(type);

4
invokeai/frontend/web/src/features/dynamicPrompts/components/ParamDynamicPromptsSeedBehaviour.tsx
View File

@@ -15,9 +15,7 @@ import { useTranslation } from 'react-i18next';
const ParamDynamicPromptsSeedBehaviour = () => {
const dispatch = useAppDispatch();
const { t } = useTranslation();
const seedBehaviour = useAppSelector(
(s) => s.dynamicPrompts.seedBehaviour
);
const seedBehaviour = useAppSelector((s) => s.dynamicPrompts.seedBehaviour);
const options = useMemo<InvSelectOption[]>(() => {
return [

8
invokeai/frontend/web/src/features/gallery/components/Boards/BoardAutoAddSelect.tsx
View File

@@ -5,9 +5,7 @@ import type {
InvSelectOnChange,
InvSelectOption,
} from 'common/components/InvSelect/types';
import {
autoAddBoardIdChanged,
} from 'features/gallery/store/gallerySlice';
import { autoAddBoardIdChanged } from 'features/gallery/store/gallerySlice';
import { memo, useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
import { useListAllBoardsQuery } from 'services/api/endpoints/boards';
@@ -15,9 +13,7 @@ import { useListAllBoardsQuery } from 'services/api/endpoints/boards';
const BoardAutoAddSelect = () => {
const dispatch = useAppDispatch();
const { t } = useTranslation();
const autoAddBoardId = useAppSelector(
(s) => s.gallery.autoAddBoardId
);
const autoAddBoardId = useAppSelector((s) => s.gallery.autoAddBoardId);
const autoAssignBoardOnClick = useAppSelector(
(s) => s.gallery.autoAssignBoardOnClick
);

8
invokeai/frontend/web/src/features/gallery/components/Boards/BoardsList/BoardsList.tsx
View File

@@ -24,12 +24,8 @@ type Props = {
const BoardsList = (props: Props) => {
const { isOpen } = props;
const selectedBoardId = useAppSelector(
(s) => s.gallery.selectedBoardId
);
const boardSearchText = useAppSelector(
(s) => s.gallery.boardSearchText
);
const selectedBoardId = useAppSelector((s) => s.gallery.selectedBoardId);
const boardSearchText = useAppSelector((s) => s.gallery.boardSearchText);
const { data: boards } = useListAllBoardsQuery();
const filteredBoards = boardSearchText
? boards?.filter((board) =>

3
invokeai/frontend/web/src/features/gallery/components/CurrentImage/CurrentImageDisplay.tsx
View File

@@ -2,6 +2,7 @@ import { Flex } from '@chakra-ui/react';
import { memo } from 'react';
import CurrentImageButtons from './CurrentImageButtons';
import CurrentImagePreview from './CurrentImagePreview';
const CurrentImageDisplay = () => {
return (
@@ -15,7 +16,7 @@ const CurrentImageDisplay = () => {
justifyContent="center"
>
<CurrentImageButtons />
{/* <CurrentImagePreview /> */}
<CurrentImagePreview />
</Flex>
);
};

4
invokeai/frontend/web/src/features/gallery/components/ImageGrid/GalleryImageGrid.tsx
View File

@@ -44,9 +44,7 @@ const GalleryImageGrid = () => {
const [initialize, osInstance] = useOverlayScrollbars(
overlayScrollbarsParams
);
const selectedBoardId = useAppSelector(
(s) => s.gallery.selectedBoardId
);
const selectedBoardId = useAppSelector((s) => s.gallery.selectedBoardId);
const { currentViewTotal } = useBoardTotal(selectedBoardId);
const queryArgs = useAppSelector(selectListImagesBaseQueryArgs);

3
invokeai/frontend/web/src/features/gallery/components/ImageGrid/ImageGridListContainer.tsx
View File

@@ -1,6 +1,5 @@
import type { FlexProps } from '@chakra-ui/react';
import { forwardRef, Grid } from '@chakra-ui/react';
import type { RootState } from 'app/store/store';
import { useAppSelector } from 'app/store/storeHooks';
import type { PropsWithChildren } from 'react';
import { memo } from 'react';
@@ -8,7 +7,7 @@ import { memo } from 'react';
type ListContainerProps = PropsWithChildren & FlexProps;
const ListContainer = forwardRef((props: ListContainerProps, ref) => {
const galleryImageMinimumWidth = useAppSelector(
(state: RootState) => state.gallery.galleryImageMinimumWidth
(s) => s.gallery.galleryImageMinimumWidth
);
return (

5
invokeai/frontend/web/src/features/gallery/hooks/useMultiselect.ts
View File

@@ -1,7 +1,10 @@
import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { selectListImagesBaseQueryArgs } from 'features/gallery/store/gallerySelectors';
import { selectGallerySlice, selectionChanged } from 'features/gallery/store/gallerySlice';
import {
selectGallerySlice,
selectionChanged,
} from 'features/gallery/store/gallerySlice';
import { useFeatureStatus } from 'features/system/hooks/useFeatureStatus';
import type { MouseEvent } from 'react';
import { useCallback, useMemo } from 'react';

3
invokeai/frontend/web/src/features/hrf/components/ParamHrfToggle.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import type { InvLabelProps } from 'common/components/InvControl/types';
@@ -12,7 +11,7 @@ const ParamHrfToggle = () => {
const dispatch = useAppDispatch();
const { t } = useTranslation();
const hrfEnabled = useAppSelector((state: RootState) => state.hrf.hrfEnabled);
const hrfEnabled = useAppSelector((s) => s.hrf.hrfEnabled);
const handleHrfEnabled = useCallback(
(e: ChangeEvent<HTMLInputElement>) =>

5
invokeai/frontend/web/src/features/modelManager/subpanels/AddModelsPanel/FoundModelsList.tsx
View File

@@ -1,5 +1,4 @@
import { Flex } from '@chakra-ui/react';
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvButton } from 'common/components/InvButton/InvButton';
import { InvControl } from 'common/components/InvControl/InvControl';
@@ -22,9 +21,7 @@ import {
} from 'services/api/endpoints/models';
const FoundModelsList = () => {
const searchFolder = useAppSelector(
(state: RootState) => state.modelmanager.searchFolder
);
const searchFolder = useAppSelector((s) => s.modelmanager.searchFolder);
const [nameFilter, setNameFilter] = useState<string>('');
// Get paths of models that are already installed

3
invokeai/frontend/web/src/features/modelManager/subpanels/AddModelsPanel/ScanAdvancedAddModels.tsx
View File

@@ -1,5 +1,4 @@
import { Box, Flex } from '@chakra-ui/react';
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvIconButton } from 'common/components/InvIconButton/InvIconButton';
@@ -21,7 +20,7 @@ import { isManualAddMode } from './AdvancedAddModels';
const ScanAdvancedAddModels = () => {
const advancedAddScanModel = useAppSelector(
(state: RootState) => state.modelmanager.advancedAddScanModel
(s) => s.modelmanager.advancedAddScanModel
);
const { t } = useTranslation();

5
invokeai/frontend/web/src/features/modelManager/subpanels/AddModelsPanel/SearchFolderForm.tsx
View File

@@ -1,6 +1,5 @@
import { Flex } from '@chakra-ui/react';
import { useForm } from '@mantine/form';
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvIconButton } from 'common/components/InvIconButton/InvIconButton';
import { InvInput } from 'common/components/InvInput/InvInput';
@@ -23,9 +22,7 @@ function SearchFolderForm() {
const dispatch = useAppDispatch();
const { t } = useTranslation();
const searchFolder = useAppSelector(
(state: RootState) => state.modelmanager.searchFolder
);
const searchFolder = useAppSelector((s) => s.modelmanager.searchFolder);
const { refetch: refetchFoundModels } = useGetModelsInFolderQuery({
search_path: searchFolder ? searchFolder : '',

7
invokeai/frontend/web/src/features/nodes/components/flow/AddNodePopover/AddNodePopover.tsx
View File

@@ -20,7 +20,8 @@ import { useBuildNode } from 'features/nodes/hooks/useBuildNode';
import {
addNodePopoverClosed,
addNodePopoverOpened,
nodeAdded } from 'features/nodes/store/nodesSlice';
nodeAdded,
} from 'features/nodes/store/nodesSlice';
import { selectNodeTemplatesSlice } from 'features/nodes/store/nodeTemplatesSlice';
import { validateSourceAndTargetTypes } from 'features/nodes/store/util/validateSourceAndTargetTypes';
import { filter, map, memoize, some } from 'lodash-es';
@@ -66,9 +67,7 @@ const AddNodePopover = () => {
const selectRef = useRef<SelectInstance<InvSelectOption> | null>(null);
const inputRef = useRef<HTMLInputElement>(null);
const fieldFilter = useAppSelector(
(s) => s.nodes.connectionStartFieldType
);
const fieldFilter = useAppSelector((s) => s.nodes.connectionStartFieldType);
const handleFilter = useAppSelector(
(s) => s.nodes.connectionStartParams?.handleType
);

4
invokeai/frontend/web/src/features/nodes/components/flow/Flow.tsx
View File

@@ -74,9 +74,7 @@ export const Flow = memo(() => {
const nodes = useAppSelector((s) => s.nodes.nodes);
const edges = useAppSelector((s) => s.nodes.edges);
const viewport = useAppSelector((s) => s.nodes.viewport);
const shouldSnapToGrid = useAppSelector(
(s) => s.nodes.shouldSnapToGrid
);
const shouldSnapToGrid = useAppSelector((s) => s.nodes.shouldSnapToGrid);
const selectionMode = useAppSelector((s) => s.nodes.selectionMode);
const flowWrapper = useRef<HTMLDivElement>(null);
const cursorPosition = useRef<XYPosition | null>(null);

5
invokeai/frontend/web/src/features/nodes/components/flow/nodes/common/NodeWrapper.tsx
View File

@@ -5,7 +5,10 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import NodeSelectionOverlay from 'common/components/NodeSelectionOverlay';
import { useGlobalMenuCloseTrigger } from 'common/hooks/useGlobalMenuCloseTrigger';
import { useMouseOverNode } from 'features/nodes/hooks/useMouseOverNode';
import { nodeExclusivelySelected , selectNodesSlice } from 'features/nodes/store/nodesSlice';
import {
nodeExclusivelySelected,
selectNodesSlice,
} from 'features/nodes/store/nodesSlice';
import {
DRAG_HANDLE_CLASSNAME,
NODE_WIDTH,

3
invokeai/frontend/web/src/features/nodes/components/flow/panels/MinimapPanel/MinimapPanel.tsx
View File

@@ -1,6 +1,5 @@
import type { SystemStyleObject } from '@chakra-ui/react';
import { chakra, Flex } from '@chakra-ui/react';
import type { RootState } from 'app/store/store';
import { useAppSelector } from 'app/store/storeHooks';
import { memo } from 'react';
import { MiniMap } from 'reactflow';
@@ -18,7 +17,7 @@ const minimapStyles: SystemStyleObject = {
const MinimapPanel = () => {
const shouldShowMinimapPanel = useAppSelector(
(state: RootState) => state.nodes.shouldShowMinimapPanel
(s) => s.nodes.shouldShowMinimapPanel
);
return (

6
invokeai/frontend/web/src/features/nodes/components/flow/panels/TopRightPanel/WorkflowEditorSettings.tsx
View File

@@ -14,10 +14,12 @@ import { InvSwitch } from 'common/components/InvSwitch/wrapper';
import ReloadNodeTemplatesButton from 'features/nodes/components/flow/panels/TopRightPanel/ReloadSchemaButton';
import {
selectionModeChanged,
selectNodesSlice, shouldAnimateEdgesChanged,
selectNodesSlice,
shouldAnimateEdgesChanged,
shouldColorEdgesChanged,
shouldSnapToGridChanged,
shouldValidateGraphChanged } from 'features/nodes/store/nodesSlice';
shouldValidateGraphChanged,
} from 'features/nodes/store/nodesSlice';
import type { ChangeEvent, ReactNode } from 'react';
import { memo, useCallback } from 'react';
import { useTranslation } from 'react-i18next';

6
invokeai/frontend/web/src/features/nodes/components/sidePanel/workflow/WorkflowGeneralTab.tsx
View File

@@ -7,13 +7,15 @@ import { InvInput } from 'common/components/InvInput/InvInput';
import { InvTextarea } from 'common/components/InvTextarea/InvTextarea';
import ScrollableContent from 'common/components/OverlayScrollbars/ScrollableContent';
import {
selectWorkflowSlice, workflowAuthorChanged,
selectWorkflowSlice,
workflowAuthorChanged,
workflowContactChanged,
workflowDescriptionChanged,
workflowNameChanged,
workflowNotesChanged,
workflowTagsChanged,
workflowVersionChanged } from 'features/nodes/store/workflowSlice';
workflowVersionChanged,
} from 'features/nodes/store/workflowSlice';
import type { ChangeEvent } from 'react';
import { memo, useCallback } from 'react';
import { useTranslation } from 'react-i18next';

4
invokeai/frontend/web/src/features/nodes/hooks/useBuildNode.ts
View File

@@ -19,9 +19,7 @@ export const SHARED_NODE_PROPERTIES: Partial<Node> = {
};
export const useBuildNode = () => {
const nodeTemplates = useAppSelector(
(s) => s.nodeTemplates.templates
);
const nodeTemplates = useAppSelector((s) => s.nodeTemplates.templates);
const flow = useReactFlow();

7
invokeai/frontend/web/src/features/parameters/components/Advanced/ParamClipSkip.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSlider } from 'common/components/InvSlider/InvSlider';
@@ -8,11 +7,9 @@ import { memo, useCallback, useMemo } from 'react';
import { useTranslation } from 'react-i18next';
const ParamClipSkip = () => {
const clipSkip = useAppSelector(
(state: RootState) => state.generation.clipSkip
);
const clipSkip = useAppSelector((s) => s.generation.clipSkip);
const { model } = useAppSelector((state: RootState) => state.generation);
const { model } = useAppSelector((s) => s.generation);
const dispatch = useAppDispatch();
const { t } = useTranslation();

3
invokeai/frontend/web/src/features/parameters/components/Canvas/Compositing/CoherencePass/ParamCanvasCoherenceMode.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSelect } from 'common/components/InvSelect/InvSelect';
@@ -14,7 +13,7 @@ import { useTranslation } from 'react-i18next';
const ParamCanvasCoherenceMode = () => {
const dispatch = useAppDispatch();
const canvasCoherenceMode = useAppSelector(
(state: RootState) => state.generation.canvasCoherenceMode
(s) => s.generation.canvasCoherenceMode
);
const { t } = useTranslation();

3
invokeai/frontend/web/src/features/parameters/components/Canvas/Compositing/CoherencePass/ParamCanvasCoherenceSteps.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSlider } from 'common/components/InvSlider/InvSlider';
@@ -9,7 +8,7 @@ import { useTranslation } from 'react-i18next';
const ParamCanvasCoherenceSteps = () => {
const dispatch = useAppDispatch();
const canvasCoherenceSteps = useAppSelector(
(state: RootState) => state.generation.canvasCoherenceSteps
(s) => s.generation.canvasCoherenceSteps
);
const { t } = useTranslation();

3
invokeai/frontend/web/src/features/parameters/components/Canvas/Compositing/CoherencePass/ParamCanvasCoherenceStrength.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSlider } from 'common/components/InvSlider/InvSlider';
@@ -9,7 +8,7 @@ import { useTranslation } from 'react-i18next';
const ParamCanvasCoherenceStrength = () => {
const dispatch = useAppDispatch();
const canvasCoherenceStrength = useAppSelector(
(state: RootState) => state.generation.canvasCoherenceStrength
(s) => s.generation.canvasCoherenceStrength
);
const { t } = useTranslation();

5
invokeai/frontend/web/src/features/parameters/components/Canvas/Compositing/MaskAdjustment/ParamMaskBlur.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSlider } from 'common/components/InvSlider/InvSlider';
@@ -8,9 +7,7 @@ import { useTranslation } from 'react-i18next';
const ParamMaskBlur = () => {
const dispatch = useAppDispatch();
const maskBlur = useAppSelector(
(state: RootState) => state.generation.maskBlur
);
const maskBlur = useAppSelector((s) => s.generation.maskBlur);
const { t } = useTranslation();
const handleChange = useCallback(

5
invokeai/frontend/web/src/features/parameters/components/Canvas/Compositing/MaskAdjustment/ParamMaskBlurMethod.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSelect } from 'common/components/InvSelect/InvSelect';
@@ -17,9 +16,7 @@ const options: InvSelectOption[] = [
];
const ParamMaskBlurMethod = () => {
const maskBlurMethod = useAppSelector(
(state: RootState) => state.generation.maskBlurMethod
);
const maskBlurMethod = useAppSelector((s) => s.generation.maskBlurMethod);
const dispatch = useAppDispatch();
const { t } = useTranslation();

3
invokeai/frontend/web/src/features/parameters/components/Core/ParamPositivePrompt.tsx
View File

@@ -16,8 +16,7 @@ import { useTranslation } from 'react-i18next';
export const ParamPositivePrompt = memo(() => {
const dispatch = useAppDispatch();
const prompt = useAppSelector((s) => s.generation.positivePrompt);
const baseModel = useAppSelector((s) => s.generation.model)
?.base_model;
const baseModel = useAppSelector((s) => s.generation.model)?.base_model;
const textareaRef = useRef<HTMLTextAreaElement>(null);
const { t } = useTranslation();

3
invokeai/frontend/web/src/features/parameters/components/Seed/ParamSeedRandomize.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSwitch } from 'common/components/InvSwitch/wrapper';
@@ -12,7 +11,7 @@ export const ParamSeedRandomize = memo(() => {
const { t } = useTranslation();
const shouldRandomizeSeed = useAppSelector(
(state: RootState) => state.generation.shouldRandomizeSeed
(s) => s.generation.shouldRandomizeSeed
);
const handleChangeShouldRandomizeSeed = useCallback(

3
invokeai/frontend/web/src/features/parameters/components/Seed/ParamSeedShuffle.tsx
View File

@@ -1,5 +1,4 @@
import { NUMPY_RAND_MAX, NUMPY_RAND_MIN } from 'app/constants';
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvButton } from 'common/components/InvButton/InvButton';
import randomInt from 'common/util/randomInt';
@@ -11,7 +10,7 @@ import { FaShuffle } from 'react-icons/fa6';
export const ParamSeedShuffle = memo(() => {
const dispatch = useAppDispatch();
const shouldRandomizeSeed = useAppSelector(
(state: RootState) => state.generation.shouldRandomizeSeed
(s) => s.generation.shouldRandomizeSeed
);
const { t } = useTranslation();

5
invokeai/frontend/web/src/features/parameters/components/Symmetry/ParamSymmetryHorizontal.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSlider } from 'common/components/InvSlider/InvSlider';
@@ -8,10 +7,10 @@ import { useTranslation } from 'react-i18next';
const ParamSymmetryHorizontal = () => {
const horizontalSymmetrySteps = useAppSelector(
(state: RootState) => state.generation.horizontalSymmetrySteps
(s) => s.generation.horizontalSymmetrySteps
);
const steps = useAppSelector((state: RootState) => state.generation.steps);
const steps = useAppSelector((s) => s.generation.steps);
const dispatch = useAppDispatch();

3
invokeai/frontend/web/src/features/parameters/components/Symmetry/ParamSymmetryToggle.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSwitch } from 'common/components/InvSwitch/wrapper';
@@ -8,7 +7,7 @@ import { memo, useCallback } from 'react';
const ParamSymmetryToggle = () => {
const shouldUseSymmetry = useAppSelector(
(state: RootState) => state.generation.shouldUseSymmetry
(s) => s.generation.shouldUseSymmetry
);
const dispatch = useAppDispatch();

5
invokeai/frontend/web/src/features/parameters/components/Symmetry/ParamSymmetryVertical.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvControl } from 'common/components/InvControl/InvControl';
import { InvSlider } from 'common/components/InvSlider/InvSlider';
@@ -8,10 +7,10 @@ import { useTranslation } from 'react-i18next';
const ParamSymmetryVertical = () => {
const verticalSymmetrySteps = useAppSelector(
(state: RootState) => state.generation.verticalSymmetrySteps
(s) => s.generation.verticalSymmetrySteps
);
const steps = useAppSelector((state: RootState) => state.generation.steps);
const steps = useAppSelector((s) => s.generation.steps);
const dispatch = useAppDispatch();

3
invokeai/frontend/web/src/features/parameters/components/Upscale/ParamRealESRGANModel.tsx
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import type { GroupBase } from 'chakra-react-select';
import { InvControl } from 'common/components/InvControl/InvControl';
@@ -52,7 +51,7 @@ const ParamESRGANModel = () => {
const { t } = useTranslation();
const esrganModelName = useAppSelector(
(state: RootState) => state.postprocessing.esrganModelName
(s) => s.postprocessing.esrganModelName
);
const dispatch = useAppDispatch();

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

@@ -6,7 +6,10 @@ import { InvButton } from 'common/components/InvButton/InvButton';
import { InvNumberInput } from 'common/components/InvNumberInput/InvNumberInput';
import type { InvNumberInputFieldProps } from 'common/components/InvNumberInput/types';
import { selectDynamicPromptsSlice } from 'features/dynamicPrompts/store/dynamicPromptsSlice';
import { selectGenerationSlice, setIterations } from 'features/parameters/store/generationSlice';
import {
selectGenerationSlice,
setIterations,
} from 'features/parameters/store/generationSlice';
import { useQueueBack } from 'features/queue/hooks/useQueueBack';
import { selectConfigSlice } from 'features/system/store/configSlice';
import { memo, useCallback } from 'react';

4
invokeai/frontend/web/src/features/sdxl/components/SDXLRefiner/ParamSDXLRefinerScheduler.tsx
View File

@@ -11,9 +11,7 @@ import { useTranslation } from 'react-i18next';
const ParamSDXLRefinerScheduler = () => {
const dispatch = useAppDispatch();
const { t } = useTranslation();
const refinerScheduler = useAppSelector(
(s) => s.sdxl.refinerScheduler
);
const refinerScheduler = useAppSelector((s) => s.sdxl.refinerScheduler);
const onChange = useCallback<InvSelectOnChange>(
(v) => {

4
invokeai/frontend/web/src/features/settingsAccordions/ImageSettingsAccordion/ImageSizeLinear.tsx
View File

@@ -14,9 +14,7 @@ export const ImageSizeLinear = memo(() => {
const dispatch = useAppDispatch();
const width = useAppSelector((s) => s.generation.width);
const height = useAppSelector((s) => s.generation.height);
const aspectRatioState = useAppSelector(
(s) => s.generation.aspectRatio
);
const aspectRatioState = useAppSelector((s) => s.generation.aspectRatio);
const onChangeWidth = useCallback(
(width: number) => {

8
invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsLogLevelSelect.tsx
View File

@@ -10,12 +10,8 @@ import { useTranslation } from 'react-i18next';
export const SettingsLogLevelSelect = memo(() => {
const { t } = useTranslation();
const dispatch = useAppDispatch();
const consoleLogLevel = useAppSelector(
(s) => s.system.consoleLogLevel
);
const shouldLogToConsole = useAppSelector(
(s) => s.system.shouldLogToConsole
);
const consoleLogLevel = useAppSelector((s) => s.system.consoleLogLevel);
const shouldLogToConsole = useAppSelector((s) => s.system.shouldLogToConsole);
const options = useMemo(
() => zLogLevel.options.map((o) => ({ label: o, value: o })),
[]

13
invokeai/frontend/web/src/features/system/hooks/useFeatureStatus.ts
View File

@@ -1,4 +1,3 @@
import type { RootState } from 'app/store/store';
import { useAppSelector } from 'app/store/storeHooks';
import type { AppFeature, SDFeature } from 'app/types/invokeai';
import type { InvokeTabName } from 'features/ui/store/tabMap';
@@ -7,17 +6,11 @@ import { useMemo } from 'react';
export const useFeatureStatus = (
feature: AppFeature | SDFeature | InvokeTabName
) => {
const disabledTabs = useAppSelector(
(state: RootState) => state.config.disabledTabs
);
const disabledTabs = useAppSelector((s) => s.config.disabledTabs);
const disabledFeatures = useAppSelector(
(state: RootState) => state.config.disabledFeatures
);
const disabledFeatures = useAppSelector((s) => s.config.disabledFeatures);
const disabledSDFeatures = useAppSelector(
(state: RootState) => state.config.disabledSDFeatures
);
const disabledSDFeatures = useAppSelector((s) => s.config.disabledSDFeatures);
const isFeatureDisabled = useMemo(
() =>

3
invokeai/frontend/web/src/features/ui/components/ParametersPanel.tsx
View File

@@ -1,5 +1,4 @@
import { Box, Flex } from '@chakra-ui/react';
import type { RootState } from 'app/store/store';
import { useAppSelector } from 'app/store/storeHooks';
import { overlayScrollbarsParams } from 'common/components/OverlayScrollbars/constants';
import { Prompts } from 'features/parameters/components/Prompts/Prompts';
@@ -24,7 +23,7 @@ const overlayScrollbarsStyles: CSSProperties = {
const ParametersPanel = () => {
const activeTabName = useAppSelector(activeTabNameSelector);
const isSDXL = useAppSelector(
(state: RootState) => state.generation.model?.base_model === 'sdxl'
(s) => s.generation.model?.base_model === 'sdxl'
);
return (