feat(ui): clean up a few selectors that do not need to be memoized

This commit is contained in:
psychedelicious 2024-01-05 20:39:13 +11:00
parent 367de44a8b
commit 2c049a3b94
4 changed files with 12 additions and 60 deletions

View File

@ -1,23 +1,14 @@
import { createLogWriter } from '@roarr/browser-log-writer';
import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
import { useAppSelector } from 'app/store/storeHooks';
import { selectSystemSlice } from 'features/system/store/systemSlice';
import { useEffect, useMemo } from 'react';
import { ROARR, Roarr } from 'roarr';
import type { LoggerNamespace } from './logger';
import { $logger, BASE_CONTEXT, LOG_LEVEL_MAP, logger } from './logger';
const selector = createMemoizedSelector(selectSystemSlice, (system) => {
const { consoleLogLevel, shouldLogToConsole } = system;
return {
consoleLogLevel,
shouldLogToConsole,
};
});
export const useLogger = (namespace: LoggerNamespace) => {
const { consoleLogLevel, shouldLogToConsole } = useAppSelector(selector);
const consoleLogLevel = useAppSelector((s) => s.system.consoleLogLevel);
const shouldLogToConsole = useAppSelector((s) => s.system.shouldLogToConsole);
// The provided Roarr browser log writer uses localStorage to config logging to console
useEffect(() => {

View File

@ -1,28 +1,16 @@
import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import { InvIconButton } from 'common/components/InvIconButton/InvIconButton';
import { redo, selectCanvasSlice } from 'features/canvas/store/canvasSlice';
import { redo } from 'features/canvas/store/canvasSlice';
import { activeTabNameSelector } from 'features/ui/store/uiSelectors';
import { memo, useCallback } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import { useTranslation } from 'react-i18next';
import { FaRedo } from 'react-icons/fa';
const canvasRedoSelector = createMemoizedSelector(
[selectCanvasSlice, activeTabNameSelector],
(canvas, activeTabName) => {
const { futureLayerStates } = canvas;
return {
canRedo: futureLayerStates.length > 0,
activeTabName,
};
}
);
const IAICanvasRedoButton = () => {
const dispatch = useAppDispatch();
const { canRedo, activeTabName } = useAppSelector(canvasRedoSelector);
const canRedo = useAppSelector((s) => s.canvas.futureLayerStates.length > 0);
const activeTabName = useAppSelector(activeTabNameSelector);
const { t } = useTranslation();

View File

@ -1,5 +1,4 @@
import { Box, Flex } from '@chakra-ui/react';
import { createMemoizedSelector } from 'app/store/createMemoizedSelector';
import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
import IAIColorPicker from 'common/components/IAIColorPicker';
import { InvButtonGroup } from 'common/components/InvButtonGroup/InvButtonGroup';
@ -16,7 +15,6 @@ import { isStagingSelector } from 'features/canvas/store/canvasSelectors';
import {
addEraseRect,
addFillRect,
selectCanvasSlice,
setBrushColor,
setBrushSize,
setTool,
@ -36,23 +34,12 @@ import {
FaTimes,
} from 'react-icons/fa';
export const selector = createMemoizedSelector(
[selectCanvasSlice, isStagingSelector],
(canvas, isStaging) => {
const { tool, brushColor, brushSize } = canvas;
return {
tool,
isStaging,
brushColor,
brushSize,
};
}
);
const IAICanvasToolChooserOptions = () => {
const dispatch = useAppDispatch();
const { tool, brushColor, brushSize, isStaging } = useAppSelector(selector);
const tool = useAppSelector((s) => s.canvas.tool);
const brushColor = useAppSelector((s) => s.canvas.brushColor);
const brushSize = useAppSelector((s) => s.canvas.brushSize);
const isStaging = useAppSelector(isStagingSelector);
const { t } = useTranslation();
useHotkeys(

View File

@ -1,31 +1,17 @@
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 { undo } from 'features/canvas/store/canvasSlice';
import { activeTabNameSelector } from 'features/ui/store/uiSelectors';
import { memo, useCallback } from 'react';
import { useHotkeys } from 'react-hotkeys-hook';
import { useTranslation } from 'react-i18next';
import { FaUndo } from 'react-icons/fa';
const canvasUndoSelector = createMemoizedSelector(
[selectCanvasSlice, activeTabNameSelector],
(canvas, activeTabName) => {
const { pastLayerStates } = canvas;
return {
canUndo: pastLayerStates.length > 0,
activeTabName,
};
}
);
const IAICanvasUndoButton = () => {
const dispatch = useAppDispatch();
const { t } = useTranslation();
const { canUndo, activeTabName } = useAppSelector(canvasUndoSelector);
const activeTabName = useAppSelector(activeTabNameSelector);
const canUndo = useAppSelector((s) => s.canvas.pastLayerStates.length > 0);
const handleUndo = useCallback(() => {
dispatch(undo());