Merge branch 'main' into ryan/flux-ip-adapter-cfg-2

invokeai/app/invocations/flux_denoise.py

@@ -121,6 +121,7 @@ class FluxDenoiseInvocation(BaseInvocation, WithMetadata, WithBoard):
         default=None, input=Input.Connection, description="ControlNet models."
     )
     controlnet_vae: VAEField | None = InputField(
+        default=None,
         description=FieldDescriptions.vae,
         input=Input.Connection,
     )

invokeai/app/services/image_files/image_files_disk.py

@@ -110,15 +110,26 @@ class DiskImageFileStorage(ImageFileStorageBase):
         except Exception as e:
             raise ImageFileDeleteException from e
 
-    # TODO: make this a bit more flexible for e.g. cloud storage
     def get_path(self, image_name: str, thumbnail: bool = False) -> Path:
-        path = self.__output_folder / image_name
+        base_folder = self.__thumbnails_folder if thumbnail else self.__output_folder
+        filename = get_thumbnail_name(image_name) if thumbnail else image_name
 
-        if thumbnail:
-            thumbnail_name = get_thumbnail_name(image_name)
-            path = self.__thumbnails_folder / thumbnail_name
+        # Strip any path information from the filename
+        basename = Path(filename).name
 
-        return path
+        if basename != filename:
+            raise ValueError("Invalid image name, potential directory traversal detected")
+
+        image_path = base_folder / basename
+
+        # Ensure the image path is within the base folder to prevent directory traversal
+        resolved_base = base_folder.resolve()
+        resolved_image_path = image_path.resolve()
+
+        if not resolved_image_path.is_relative_to(resolved_base):
+            raise ValueError("Image path outside outputs folder, potential directory traversal detected")
+
+        return resolved_image_path
 
     def validate_path(self, path: Union[str, Path]) -> bool:
         """Validates the path given for an image or thumbnail."""

invokeai/backend/model_manager/starter_models.py

@@ -196,6 +196,16 @@ dreamshaper_sdxl = StarterModel(
     type=ModelType.Main,
     dependencies=[sdxl_fp16_vae_fix],
 )
+
+archvis_sdxl = StarterModel(
+    name="Architecture (RealVisXL5)",
+    base=BaseModelType.StableDiffusionXL,
+    source="SG161222/RealVisXL_V5.0",
+    description="A photorealistic model, with architecture among its many use cases",
+    type=ModelType.Main,
+    dependencies=[sdxl_fp16_vae_fix],
+)
+
 sdxl_refiner = StarterModel(
     name="SDXL Refiner",
     base=BaseModelType.StableDiffusionXLRefiner,
@@ -563,6 +573,7 @@ STARTER_MODELS: list[StarterModel] = [
     deliberate_inpainting_sd1,
     juggernaut_sdxl,
     dreamshaper_sdxl,
+    archvis_sdxl,
     sdxl_refiner,
     sdxl_fp16_vae_fix,
     flux_vae,

invokeai/frontend/web/src/app/components/App.tsx

@@ -4,6 +4,7 @@ import type { StudioInitAction } from 'app/hooks/useStudioInitAction';
 import { useStudioInitAction } from 'app/hooks/useStudioInitAction';
 import { useSyncQueueStatus } from 'app/hooks/useSyncQueueStatus';
 import { useLogger } from 'app/logging/useLogger';
+import { useSyncLoggingConfig } from 'app/logging/useSyncLoggingConfig';
 import { appStarted } from 'app/store/middleware/listenerMiddleware/listeners/appStarted';
 import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import type { PartialAppConfig } from 'app/types/invokeai';
@@ -59,6 +60,7 @@ const App = ({ config = DEFAULT_CONFIG, studioInitAction }: Props) => {
   useGlobalModifiersInit();
   useGlobalHotkeys();
   useGetOpenAPISchemaQuery();
+  useSyncLoggingConfig();
 
   const { dropzone, isHandlingUpload, setIsHandlingUpload } = useFullscreenDropzone();
 

invokeai/frontend/web/src/app/components/InvokeAIUI.tsx

@@ -2,6 +2,8 @@ import 'i18n';
 
 import type { Middleware } from '@reduxjs/toolkit';
 import type { StudioInitAction } from 'app/hooks/useStudioInitAction';
+import type { LoggingOverrides } from 'app/logging/logger';
+import { $loggingOverrides, configureLogging } from 'app/logging/logger';
 import { $authToken } from 'app/store/nanostores/authToken';
 import { $baseUrl } from 'app/store/nanostores/baseUrl';
 import { $customNavComponent } from 'app/store/nanostores/customNavComponent';
@@ -20,7 +22,7 @@ import Loading from 'common/components/Loading/Loading';
 import AppDndContext from 'features/dnd/components/AppDndContext';
 import type { WorkflowCategory } from 'features/nodes/types/workflow';
 import type { PropsWithChildren, ReactNode } from 'react';
-import React, { lazy, memo, useEffect, useMemo } from 'react';
+import React, { lazy, memo, useEffect, useLayoutEffect, useMemo } from 'react';
 import { Provider } from 'react-redux';
 import { addMiddleware, resetMiddlewares } from 'redux-dynamic-middlewares';
 import { $socketOptions } from 'services/events/stores';
@@ -46,6 +48,7 @@ interface Props extends PropsWithChildren {
   isDebugging?: boolean;
   logo?: ReactNode;
   workflowCategories?: WorkflowCategory[];
+  loggingOverrides?: LoggingOverrides;
 }
 
 const InvokeAIUI = ({
@@ -65,7 +68,26 @@ const InvokeAIUI = ({
   isDebugging = false,
   logo,
   workflowCategories,
+  loggingOverrides,
 }: Props) => {
+  useLayoutEffect(() => {
+    /*
+     * We need to configure logging before anything else happens - useLayoutEffect ensures we set this at the first
+     * possible opportunity.
+     *
+     * Once redux initializes, we will check the user's settings and update the logging config accordingly. See
+     * `useSyncLoggingConfig`.
+     */
+    $loggingOverrides.set(loggingOverrides);
+
+    // Until we get the user's settings, we will use the overrides OR default values.
+    configureLogging(
+      loggingOverrides?.logIsEnabled ?? true,
+      loggingOverrides?.logLevel ?? 'debug',
+      loggingOverrides?.logNamespaces ?? '*'
+    );
+  }, [loggingOverrides]);
+
   useEffect(() => {
     // configure API client token
     if (token) {

invokeai/frontend/web/src/app/logging/logger.ts

@@ -9,11 +9,10 @@ const serializeMessage: MessageSerializer = (message) => {
 };
 
 ROARR.serializeMessage = serializeMessage;
-ROARR.write = createLogWriter();
 
-export const BASE_CONTEXT = {};
+const BASE_CONTEXT = {};
 
-export const $logger = atom<Logger>(Roarr.child(BASE_CONTEXT));
+const $logger = atom<Logger>(Roarr.child(BASE_CONTEXT));
 
 export const zLogNamespace = z.enum([
   'canvas',
@@ -35,8 +34,22 @@ export const zLogLevel = z.enum(['trace', 'debug', 'info', 'warn', 'error', 'fat
 export type LogLevel = z.infer<typeof zLogLevel>;
 export const isLogLevel = (v: unknown): v is LogLevel => zLogLevel.safeParse(v).success;
 
+/**
+ * Override logging settings.
+ * @property logIsEnabled Override the enabled log state. Omit to use the user's settings.
+ * @property logNamespaces Override the enabled log namespaces. Use `"*"` for all namespaces. Omit to use the user's settings.
+ * @property logLevel Override the log level. Omit to use the user's settings.
+ */
+export type LoggingOverrides = {
+  logIsEnabled?: boolean;
+  logNamespaces?: LogNamespace[] | '*';
+  logLevel?: LogLevel;
+};
+
+export const $loggingOverrides = atom<LoggingOverrides | undefined>();
+
 // Translate human-readable log levels to numbers, used for log filtering
-export const LOG_LEVEL_MAP: Record<LogLevel, number> = {
+const LOG_LEVEL_MAP: Record<LogLevel, number> = {
   trace: 10,
   debug: 20,
   info: 30,
@@ -44,3 +57,40 @@ export const LOG_LEVEL_MAP: Record<LogLevel, number> = {
   error: 50,
   fatal: 60,
 };
+
+/**
+ * Configure logging, pushing settings to local storage.
+ *
+ * @param logIsEnabled Whether logging is enabled
+ * @param logLevel The log level
+ * @param logNamespaces A list of log namespaces to enable, or '*' to enable all
+ */
+export const configureLogging = (
+  logIsEnabled: boolean = true,
+  logLevel: LogLevel = 'warn',
+  logNamespaces: LogNamespace[] | '*'
+): void => {
+  if (!logIsEnabled) {
+    // Disable console log output
+    localStorage.setItem('ROARR_LOG', 'false');
+  } else {
+    // Enable console log output
+    localStorage.setItem('ROARR_LOG', 'true');
+
+    // Use a filter to show only logs of the given level
+    let filter = `context.logLevel:>=${LOG_LEVEL_MAP[logLevel]}`;
+
+    const namespaces = logNamespaces === '*' ? zLogNamespace.options : logNamespaces;
+
+    if (namespaces.length > 0) {
+      filter += ` AND (${namespaces.map((ns) => `context.namespace:${ns}`).join(' OR ')})`;
+    } else {
+      // This effectively hides all logs because we use namespaces for all logs
+      filter += ' AND context.namespace:undefined';
+    }
+
+    localStorage.setItem('ROARR_FILTER', filter);
+  }
+
+  ROARR.write = createLogWriter();
+};

invokeai/frontend/web/src/app/logging/useLogger.ts

@@ -1,53 +1,9 @@
-import { createLogWriter } from '@roarr/browser-log-writer';
-import { useAppSelector } from 'app/store/storeHooks';
-import {
-  selectSystemLogIsEnabled,
-  selectSystemLogLevel,
-  selectSystemLogNamespaces,
-} from 'features/system/store/systemSlice';
-import { useEffect, useMemo } from 'react';
-import { ROARR, Roarr } from 'roarr';
+import { useMemo } from 'react';
 
 import type { LogNamespace } from './logger';
-import { $logger, BASE_CONTEXT, LOG_LEVEL_MAP, logger } from './logger';
+import { logger } from './logger';
 
 export const useLogger = (namespace: LogNamespace) => {
-  const logLevel = useAppSelector(selectSystemLogLevel);
-  const logNamespaces = useAppSelector(selectSystemLogNamespaces);
-  const logIsEnabled = useAppSelector(selectSystemLogIsEnabled);
-
-  // The provided Roarr browser log writer uses localStorage to config logging to console
-  useEffect(() => {
-    if (logIsEnabled) {
-      // Enable console log output
-      localStorage.setItem('ROARR_LOG', 'true');
-
-      // Use a filter to show only logs of the given level
-      let filter = `context.logLevel:>=${LOG_LEVEL_MAP[logLevel]}`;
-      if (logNamespaces.length > 0) {
-        filter += ` AND (${logNamespaces.map((ns) => `context.namespace:${ns}`).join(' OR ')})`;
-      } else {
-        filter += ' AND context.namespace:undefined';
-      }
-      localStorage.setItem('ROARR_FILTER', filter);
-    } else {
-      // Disable console log output
-      localStorage.setItem('ROARR_LOG', 'false');
-    }
-    ROARR.write = createLogWriter();
-  }, [logLevel, logIsEnabled, logNamespaces]);
-
-  // Update the module-scoped logger context as needed
-  useEffect(() => {
-    // TODO: type this properly
-    //eslint-disable-next-line @typescript-eslint/no-explicit-any
-    const newContext: Record<string, any> = {
-      ...BASE_CONTEXT,
-    };
-
-    $logger.set(Roarr.child(newContext));
-  }, []);
-
   const log = useMemo(() => logger(namespace), [namespace]);
 
   return log;

invokeai/frontend/web/src/app/logging/useSyncLoggingConfig.ts

@@ -0,0 +1,43 @@
+import { useStore } from '@nanostores/react';
+import { $loggingOverrides, configureLogging } from 'app/logging/logger';
+import { useAppSelector } from 'app/store/storeHooks';
+import { useAssertSingleton } from 'common/hooks/useAssertSingleton';
+import {
+  selectSystemLogIsEnabled,
+  selectSystemLogLevel,
+  selectSystemLogNamespaces,
+} from 'features/system/store/systemSlice';
+import { useLayoutEffect } from 'react';
+
+/**
+ * This hook synchronizes the logging configuration stored in Redux with the logging system, which uses localstorage.
+ *
+ * The sync is one-way: from Redux to localstorage. This means that changes made in the UI will be reflected in the
+ * logging system, but changes made directly to localstorage will not be reflected in the UI.
+ *
+ * See {@link configureLogging}
+ */
+export const useSyncLoggingConfig = () => {
+  useAssertSingleton('useSyncLoggingConfig');
+
+  const loggingOverrides = useStore($loggingOverrides);
+
+  const logLevel = useAppSelector(selectSystemLogLevel);
+  const logNamespaces = useAppSelector(selectSystemLogNamespaces);
+  const logIsEnabled = useAppSelector(selectSystemLogIsEnabled);
+
+  useLayoutEffect(() => {
+    configureLogging(
+      loggingOverrides?.logIsEnabled ?? logIsEnabled,
+      loggingOverrides?.logLevel ?? logLevel,
+      loggingOverrides?.logNamespaces ?? logNamespaces
+    );
+  }, [
+    logIsEnabled,
+    logLevel,
+    logNamespaces,
+    loggingOverrides?.logIsEnabled,
+    loggingOverrides?.logLevel,
+    loggingOverrides?.logNamespaces,
+  ]);
+};

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

@@ -7,12 +7,20 @@ import { diff } from 'jsondiffpatch';
 /**
  * Super simple logger middleware. Useful for debugging when the redux devtools are awkward.
  */
-export const debugLoggerMiddleware: Middleware = (api: MiddlewareAPI) => (next) => (action) => {
-  const originalState = api.getState();
-  console.log('REDUX: dispatching', action);
-  const result = next(action);
-  const nextState = api.getState();
-  console.log('REDUX: next state', nextState);
-  console.log('REDUX: diff', diff(originalState, nextState));
-  return result;
-};
+export const getDebugLoggerMiddleware =
+  (options?: { withDiff?: boolean; withNextState?: boolean }): Middleware =>
+  (api: MiddlewareAPI) =>
+  (next) =>
+  (action) => {
+    const originalState = api.getState();
+    console.log('REDUX: dispatching', action);
+    const result = next(action);
+    const nextState = api.getState();
+    if (options?.withNextState) {
+      console.log('REDUX: next state', nextState);
+    }
+    if (options?.withDiff) {
+      console.log('REDUX: diff', diff(originalState, nextState));
+    }
+    return result;
+  };

invokeai/frontend/web/src/features/gallery/components/GalleryUploadButton.tsx

@@ -1,5 +1,7 @@
 import { IconButton } from '@invoke-ai/ui-library';
+import { useAppSelector } from 'app/store/storeHooks';
 import { useImageUploadButton } from 'common/hooks/useImageUploadButton';
+import { selectMaxImageUploadCount } from 'features/system/store/configSlice';
 import { t } from 'i18next';
 import { PiUploadBold } from 'react-icons/pi';
 
@@ -7,14 +9,23 @@ const options = { postUploadAction: { type: 'TOAST' }, allowMultiple: true } as
 
 export const GalleryUploadButton = () => {
   const uploadApi = useImageUploadButton(options);
+  const maxImageUploadCount = useAppSelector(selectMaxImageUploadCount);
   return (
     <>
       <IconButton
         size="sm"
         alignSelf="stretch"
         variant="link"
-        aria-label={t('accessibility.uploadImages')}
-        tooltip={t('accessibility.uploadImages')}
+        aria-label={
+          maxImageUploadCount === undefined || maxImageUploadCount > 1
+            ? t('accessibility.uploadImages')
+            : t('accessibility.uploadImage')
+        }
+        tooltip={
+          maxImageUploadCount === undefined || maxImageUploadCount > 1
+            ? t('accessibility.uploadImages')
+            : t('accessibility.uploadImage')
+        }
         icon={<PiUploadBold />}
         {...uploadApi.getUploadButtonProps()}
       />

invokeai/frontend/web/src/features/nodes/components/sidePanel/WorkflowListMenu/ShareWorkflowModal.tsx

@@ -43,7 +43,7 @@ export const ShareWorkflowModal = () => {
     if (!workflowToShare || !projectUrl) {
       return null;
     }
-    return `${window.location.origin}/${projectUrl}/studio?selectedWorkflowId=${workflowToShare.workflow_id}`;
+    return `${window.location.origin}${projectUrl}/studio?selectedWorkflowId=${workflowToShare.workflow_id}`;
   }, [projectUrl, workflowToShare]);
 
   const handleCopy = useCallback(() => {

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

@@ -27,7 +27,6 @@ import { SettingsDeveloperLogNamespaces } from 'features/system/components/Setti
 import { useClearIntermediates } from 'features/system/components/SettingsModal/useClearIntermediates';
 import { StickyScrollable } from 'features/system/components/StickyScrollable';
 import {
-  logIsEnabledChanged,
   selectSystemShouldAntialiasProgressImage,
   selectSystemShouldConfirmOnDelete,
   selectSystemShouldConfirmOnNewSession,
@@ -76,12 +75,6 @@ const SettingsModal = ({ config = defaultConfig, children }: SettingsModalProps)
   const dispatch = useAppDispatch();
   const { t } = useTranslation();
 
-  useEffect(() => {
-    if (!config?.shouldShowDeveloperSettings) {
-      dispatch(logIsEnabledChanged(false));
-    }
-  }, [dispatch, config?.shouldShowDeveloperSettings]);
-
   const { isNSFWCheckerAvailable, isWatermarkerAvailable } = useGetAppConfigQuery(undefined, {
     selectFromResult: ({ data }) => ({
       isNSFWCheckerAvailable: data?.nsfw_methods.includes('nsfw_checker') ?? false,

invokeai/frontend/web/src/index.ts

@@ -1,5 +1,6 @@
 export { default as InvokeAIUI } from './app/components/InvokeAIUI';
 export type { StudioInitAction } from './app/hooks/useStudioInitAction';
+export type { LoggingOverrides } from './app/logging/logger';
 export type { PartialAppConfig } from './app/types/invokeai';
 export { default as ParamMainModelSelect } from './features/parameters/components/MainModel/ParamMainModelSelect';
 export { default as HotkeysModal } from './features/system/components/HotkeysModal/HotkeysModal';

invokeai/version/invokeai_version.py

@@ -1 +1 @@
-__version__ = "5.2.0rc2"
+__version__ = "5.2.0"