add optional config for settings modal

invokeai/frontend/web/src/features/system/components/SettingsModal/SettingsModal.tsx

@@ -35,7 +35,13 @@ import {
 } from 'features/ui/store/uiSlice';
 import { UIState } from 'features/ui/store/uiTypes';
 import { isEqual } from 'lodash-es';
-import { ChangeEvent, cloneElement, ReactElement, useCallback } from 'react';
+import {
+  ChangeEvent,
+  cloneElement,
+  ReactElement,
+  useCallback,
+  useEffect,
+} from 'react';
 import { useTranslation } from 'react-i18next';
 import { VALID_LOG_LEVELS } from 'app/logging/useLogger';
 import { LogLevelName } from 'roarr';
@@ -85,15 +91,33 @@ const modalSectionStyles: ChakraProps['sx'] = {
   borderRadius: 'base',
 };
 
+type ConfigOptions = {
+  shouldShowDeveloperSettings: boolean;
+  shouldShowResetWebUiText: boolean;
+  shouldShowBetaLayout: boolean;
+};
+
 type SettingsModalProps = {
   /* The button to open the Settings Modal */
   children: ReactElement;
+  config?: ConfigOptions;
 };
 
-const SettingsModal = ({ children }: SettingsModalProps) => {
+const SettingsModal = ({ children, config }: SettingsModalProps) => {
   const dispatch = useAppDispatch();
   const { t } = useTranslation();
 
+  const shouldShowBetaLayout = config?.shouldShowBetaLayout ?? true;
+  const shouldShowDeveloperSettings =
+    config?.shouldShowDeveloperSettings ?? true;
+  const shouldShowResetWebUiText = config?.shouldShowResetWebUiText ?? true;
+
+  useEffect(() => {
+    if (!shouldShowDeveloperSettings) {
+      dispatch(shouldLogToConsoleChanged(false));
+    }
+  }, [shouldShowDeveloperSettings, dispatch]);
+
   const {
     isOpen: isSettingsModalOpen,
     onOpen: onSettingsModalOpen,
@@ -189,6 +213,7 @@ const SettingsModal = ({ children }: SettingsModalProps) => {
                     dispatch(setShouldDisplayGuides(e.target.checked))
                   }
                 />
+                {shouldShowBetaLayout && (
                   <IAISwitch
                     label={t('settings.useCanvasBeta')}
                     isChecked={shouldUseCanvasBetaLayout}
@@ -196,6 +221,7 @@ const SettingsModal = ({ children }: SettingsModalProps) => {
                       dispatch(setShouldUseCanvasBetaLayout(e.target.checked))
                     }
                   />
+                )}
                 <IAISwitch
                   label={t('settings.useSlidersForAll')}
                   isChecked={shouldUseSliders}
@@ -221,6 +247,7 @@ const SettingsModal = ({ children }: SettingsModalProps) => {
                 />
               </Flex>
 
+              {shouldShowDeveloperSettings && (
                 <Flex sx={modalSectionStyles}>
                   <Heading size="sm">{t('settings.developer')}</Heading>
                   <IAISwitch
@@ -245,14 +272,19 @@ const SettingsModal = ({ children }: SettingsModalProps) => {
                     }
                   />
                 </Flex>
+              )}
 
               <Flex sx={modalSectionStyles}>
                 <Heading size="sm">{t('settings.resetWebUI')}</Heading>
                 <IAIButton colorScheme="error" onClick={handleClickResetWebUI}>
                   {t('settings.resetWebUI')}
                 </IAIButton>
+                {shouldShowResetWebUiText && (
+                  <>
                     <Text>{t('settings.resetWebUIDesc1')}</Text>
                     <Text>{t('settings.resetWebUIDesc2')}</Text>
+                  </>
+                )}
               </Flex>
             </Flex>
           </ModalBody>