feat(ui): address feedback

Author: psychedelicious

invokeai/frontend/web/src/features/controlLayers/store/lorasSlice.ts

@@ -1,14 +1,24 @@
 import { createSelector, createSlice, type PayloadAction } from '@reduxjs/toolkit';
 import type { RootState } from 'app/store/store';
 import type { SliceConfig } from 'app/store/types';
+import type { NumericalParameterConfig } from 'app/types/invokeai';
 import { paramsReset } from 'features/controlLayers/store/paramsSlice';
 import { type LoRA, zLoRA } from 'features/controlLayers/store/types';
 import { zModelIdentifierField } from 'features/nodes/types/common';
-import { DEFAULT_LORA_WEIGHT_CONFIG } from 'features/system/store/configSlice';
 import type { LoRAModelConfig } from 'services/api/types';
 import { v4 as uuidv4 } from 'uuid';
 import z from 'zod';
 
+export const DEFAULT_LORA_WEIGHT_CONFIG: NumericalParameterConfig = {
+  initial: 0.75,
+  sliderMin: -1,
+  sliderMax: 2,
+  numberInputMin: -10,
+  numberInputMax: 10,
+  fineStep: 0.01,
+  coarseStep: 0.05,
+};
+
 const zLoRAsState = z.object({
   loras: z.array(zLoRA),
 });

invokeai/frontend/web/src/features/lora/components/LoRACard.tsx

@@ -13,16 +13,18 @@ import { useAppDispatch, useAppSelector } from 'app/store/storeHooks';
 import { InformationalPopover } from 'common/components/InformationalPopover/InformationalPopover';
 import {
   buildSelectLoRA,
+  DEFAULT_LORA_WEIGHT_CONFIG,
   loraDeleted,
   loraIsEnabledChanged,
   loraWeightChanged,
 } from 'features/controlLayers/store/lorasSlice';
 import type { LoRA } from 'features/controlLayers/store/types';
-import { DEFAULT_LORA_WEIGHT_CONFIG } from 'features/system/store/configSlice';
 import { memo, useCallback, useMemo } from 'react';
 import { PiTrashSimpleBold } from 'react-icons/pi';
 import { useGetModelConfigQuery } from 'services/api/endpoints/models';
 
+const MARKS = [-1, 0, 1, 2];
+
 export const LoRACard = memo((props: { id: string }) => {
   const selectLoRA = useMemo(() => buildSelectLoRA(props.id), [props.id]);
   const lora = useAppSelector(selectLoRA);
@@ -80,8 +82,9 @@ const LoRAContent = memo(({ lora }: { lora: LoRA }) => {
             onChange={handleChange}
             min={DEFAULT_LORA_WEIGHT_CONFIG.sliderMin}
             max={DEFAULT_LORA_WEIGHT_CONFIG.sliderMax}
-            step={DEFAULT_LORA_WEIGHT_CONFIG.fineStep}
-            marks={DEFAULT_LORA_WEIGHT_CONFIG.marks.slice()}
+            step={DEFAULT_LORA_WEIGHT_CONFIG.coarseStep}
+            fineStep={DEFAULT_LORA_WEIGHT_CONFIG.fineStep}
+            marks={MARKS}
             defaultValue={DEFAULT_LORA_WEIGHT_CONFIG.initial}
             isDisabled={!lora.isEnabled}
           />
@@ -90,7 +93,8 @@ const LoRAContent = memo(({ lora }: { lora: LoRA }) => {
             onChange={handleChange}
             min={DEFAULT_LORA_WEIGHT_CONFIG.numberInputMin}
             max={DEFAULT_LORA_WEIGHT_CONFIG.numberInputMax}
-            step={DEFAULT_LORA_WEIGHT_CONFIG.fineStep}
+            step={DEFAULT_LORA_WEIGHT_CONFIG.coarseStep}
+            fineStep={DEFAULT_LORA_WEIGHT_CONFIG.fineStep}
             w={20}
             flexShrink={0}
             defaultValue={DEFAULT_LORA_WEIGHT_CONFIG.initial}

invokeai/frontend/web/src/features/modelManagerV2/hooks/useLoRAModelDefaultSettings.ts

@@ -1,5 +1,5 @@
 import { isNil } from 'es-toolkit/compat';
-import { DEFAULT_LORA_WEIGHT_CONFIG } from 'features/system/store/configSlice';
+import { DEFAULT_LORA_WEIGHT_CONFIG } from 'features/controlLayers/store/lorasSlice';
 import { useMemo } from 'react';
 import type { LoRAModelConfig } from 'services/api/types';
 

invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/LoRAModelDefaultSettings/DefaultWeight.tsx

@@ -1,14 +1,16 @@
 import { CompositeNumberInput, CompositeSlider, Flex, FormControl, FormLabel } from '@invoke-ai/ui-library';
 import { InformationalPopover } from 'common/components/InformationalPopover/InformationalPopover';
+import { DEFAULT_LORA_WEIGHT_CONFIG } from 'features/controlLayers/store/lorasSlice';
 import { SettingToggle } from 'features/modelManagerV2/subpanels/ModelPanel/SettingToggle';
-import { DEFAULT_LORA_WEIGHT_CONFIG } from 'features/system/store/configSlice';
 import { memo, useCallback, useMemo } from 'react';
 import type { UseControllerProps } from 'react-hook-form';
 import { useController } from 'react-hook-form';
 import { useTranslation } from 'react-i18next';
 
 import type { LoRAModelDefaultSettingsFormData } from './LoRAModelDefaultSettings';
 
+const MARKS = [-1, 0, 1, 2];
+
 type DefaultWeight = LoRAModelDefaultSettingsFormData['weight'];
 
 export const DefaultWeight = memo((props: UseControllerProps<LoRAModelDefaultSettingsFormData, 'weight'>) => {
@@ -51,7 +53,7 @@ export const DefaultWeight = memo((props: UseControllerProps<LoRAModelDefaultSet
           step={DEFAULT_LORA_WEIGHT_CONFIG.coarseStep}
           fineStep={DEFAULT_LORA_WEIGHT_CONFIG.fineStep}
           onChange={onChange}
-          marks={DEFAULT_LORA_WEIGHT_CONFIG.marks.slice()}
+          marks={MARKS}
           isDisabled={isDisabled}
         />
         <CompositeNumberInput

invokeai/frontend/web/src/features/system/store/configSlice.ts

@@ -2,21 +2,11 @@ import type { PayloadAction, Selector } from '@reduxjs/toolkit';
 import { createSelector, createSlice } from '@reduxjs/toolkit';
 import type { RootState } from 'app/store/store';
 import type { SliceConfig } from 'app/store/types';
-import { getDefaultAppConfig, type PartialAppConfig, zAppConfig } from 'app/types/invokeai';
+import type { PartialAppConfig } from 'app/types/invokeai';
+import { getDefaultAppConfig, zAppConfig } from 'app/types/invokeai';
 import { merge } from 'es-toolkit/compat';
 import z from 'zod';
 
-export const DEFAULT_LORA_WEIGHT_CONFIG = {
-  initial: 0.75,
-  sliderMin: -1,
-  sliderMax: 2,
-  marks: [-1, 0, 1, 2],
-  numberInputMin: -10,
-  numberInputMax: 10,
-  fineStep: 0.01,
-  coarseStep: 0.05,
-} as const;
-
 const zConfigState = z.object({
   ...zAppConfig.shape,
   didLoad: z.boolean(),