feat(ui): invert logic to be disabled

invokeai/frontend/web/src/app/store.ts

@@ -5,28 +5,16 @@ import storage from 'redux-persist/lib/storage'; // defaults to localStorage for
 
 import { getPersistConfig } from 'redux-deep-persist';
 
-import canvasReducer, { canvasSlice } from 'features/canvas/store/canvasSlice';
+import canvasReducer from 'features/canvas/store/canvasSlice';
-import galleryReducer, {
+import galleryReducer from 'features/gallery/store/gallerySlice';
-  gallerySlice,
+import resultsReducer from 'features/gallery/store/resultsSlice';
-} from 'features/gallery/store/gallerySlice';
+import uploadsReducer from 'features/gallery/store/uploadsSlice';
-import resultsReducer, {
+import lightboxReducer from 'features/lightbox/store/lightboxSlice';
-  resultsSlice,
+import generationReducer from 'features/parameters/store/generationSlice';
-} from 'features/gallery/store/resultsSlice';
+import postprocessingReducer from 'features/parameters/store/postprocessingSlice';
-import uploadsReducer, {
+import systemReducer from 'features/system/store/systemSlice';
-  uploadsSlice,
-} from 'features/gallery/store/uploadsSlice';
-import lightboxReducer, {
-  lightboxSlice,
-} from 'features/lightbox/store/lightboxSlice';
-import generationReducer, {
-  generationSlice,
-} from 'features/parameters/store/generationSlice';
-import postprocessingReducer, {
-  postprocessingSlice,
-} from 'features/parameters/store/postprocessingSlice';
-import systemReducer, { systemSlice } from 'features/system/store/systemSlice';
 import uiReducer, { uiSlice } from 'features/ui/store/uiSlice';
-import apiReducer, { apiSlice } from 'services/apiSlice';
+import apiReducer from 'services/apiSlice';
 
 import { socketioMiddleware } from './socketio/middleware';
 import { socketioMiddleware as nodesSocketioMiddleware } from './nodesSocketio/middleware';
@@ -129,21 +117,6 @@ interface InitializeStore {
   disabledPanels?: string[];
 }
 
-const disablePanels = ({
-  disabledPanels,
-  enabledParameterPanels,
-}: {
-  disabledPanels: string[];
-  enabledParameterPanels: { [key: string]: boolean };
-}) => {
-  const updatedParameterPanels: { [key: string]: boolean } = {};
-  Object.keys(enabledParameterPanels).forEach(function (key, index) {
-    updatedParameterPanels[key] =
-      disabledPanels.indexOf(key) >= 0 ? false : true;
-  });
-  return updatedParameterPanels;
-};
-
 // Continue with store setup
 export const initializeStore = ({ disabledPanels = [] }: InitializeStore) =>
   configureStore({
@@ -156,11 +129,7 @@ export const initializeStore = ({ disabledPanels = [] }: InitializeStore) =>
     preloadedState: {
       ui: {
         ...uiSlice.getInitialState(),
-        enabledParameterPanels: disablePanels({
+        disabledParameterPanels: disabledPanels,
-          disabledPanels,
-          enabledParameterPanels:
-            uiSlice.getInitialState().enabledParameterPanels,
-        }),
       },
     },
     devTools: {

invokeai/frontend/web/src/features/parameters/components/ParametersAccordion.tsx

@@ -24,7 +24,7 @@ const ParametersAccordion = (props: ParametersAccordionsType) => {
   const { system, ui } = useAppSelector((state: RootState) => state);
 
   const { openAccordions } = system;
-  const { enabledParameterPanels } = ui;
+  const { disabledParameterPanels } = ui;
 
   const dispatch = useAppDispatch();
 
@@ -42,7 +42,7 @@ const ParametersAccordion = (props: ParametersAccordionsType) => {
           accordionInfo[key];
 
         // do not render if panel is disabled in global state
-        if (enabledParameterPanels[key] !== false) {
+        if (disabledParameterPanels.indexOf(key) > -1) {
           accordionsToRender.push(
             <InvokeAccordionItem
               key={key}

invokeai/frontend/web/src/features/ui/components/tabs/ImageToImage/ImageToImageParameters.tsx

@@ -44,7 +44,7 @@ const ImageToImageParameters = () => {
       content: <VariationsSettings />,
       additionalHeaderComponents: <GenerateVariationsToggle />,
     },
-    faceRestore: {
+    face_restore: {
       header: `${t('parameters.faceRestoration')}`,
       feature: Feature.FACE_CORRECTION,
       content: <FaceRestoreSettings />,

invokeai/frontend/web/src/features/ui/components/tabs/TextToImage/TextToImageParameters.tsx

@@ -38,7 +38,7 @@ const TextToImageParameters = () => {
       content: <VariationsSettings />,
       additionalHeaderComponents: <GenerateVariationsToggle />,
     },
-    faceRestore: {
+    face_restore: {
       header: `${t('parameters.faceRestoration')}`,
       feature: Feature.FACE_CORRECTION,
       content: <FaceRestoreSettings />,

invokeai/frontend/web/src/features/ui/store/uiSlice.ts

@@ -16,16 +16,7 @@ const initialtabsState: UIState = {
   addNewModelUIOption: null,
   shouldPinGallery: true,
   shouldShowGallery: true,
-  enabledParameterPanels: {
+  disabledParameterPanels: [],
-    general: true,
-    seed: true,
-    variations: true,
-    faceRestore: true,
-    upscale: true,
-    symmetry: true,
-    other: true,
-    imageToImage: true,
-  },
 };
 
 const initialState: UIState = initialtabsState;

invokeai/frontend/web/src/features/ui/store/uiTypes.ts

@@ -13,5 +13,5 @@ export interface UIState {
   addNewModelUIOption: AddNewModelType;
   shouldPinGallery: boolean;
   shouldShowGallery: boolean;
-  enabledParameterPanels: { [key: string]: boolean };
+  disabledParameterPanels: string[];
 }