fix(ui): localize text

Author: rohinish404

invokeai/frontend/web/public/locales/en.json

@@ -1435,9 +1435,17 @@
         "undo": "Undo"
     },
     "workflows": {
+        "ascending": "Ascending",
+        "created": "Created",
+        "desceding": "Descending",
         "workflows": "Workflows",
         "workflowLibrary": "Library",
+        "userWorkflows": "My Workflows",
+        "defaultWorkflows": "Default Workflows",
+        "projectWorkflows": "Project Workflows",
+        "opened": "Opened",
         "openWorkflow": "Open Workflow",
+        "updated": "Updated",
         "uploadWorkflow": "Load from File",
         "deleteWorkflow": "Delete Workflow",
         "unnamedWorkflow": "Unnamed Workflow",
@@ -1448,6 +1456,9 @@
         "savingWorkflow": "Saving Workflow...",
         "problemSavingWorkflow": "Problem Saving Workflow",
         "workflowSaved": "Workflow Saved",
+        "name": "Name",
+        "noRecentWorkflows": "No Recent Workflows",
+        "noUserWorkflows": "No User Workflows",
         "noWorkflows": "No Workflows",
         "problemLoading": "Problem Loading Workflows",
         "loading": "Loading Workflows",

invokeai/frontend/web/src/features/nodes/components/sidePanel/inspector/InspectorDataTab.tsx

@@ -3,8 +3,8 @@ import { useAppSelector } from 'app/store/storeHooks';
 import { IAINoContentFallback } from 'common/components/IAIImageFallback';
 import DataViewer from 'features/gallery/components/ImageMetadataViewer/DataViewer';
 import { selectNodesSlice } from 'features/nodes/store/nodesSlice';
+import { useTranslation } from 'react-i18next';
 import { memo } from 'react';
-
 const selector = createMemoizedSelector(selectNodesSlice, (nodes) => {
   const lastSelectedNodeId = nodes.selectedNodes[nodes.selectedNodes.length - 1];
 
@@ -16,10 +16,11 @@ const selector = createMemoizedSelector(selectNodesSlice, (nodes) => {
 });
 
 const InspectorDataTab = () => {
+  const { t } = useTranslation();
   const { data } = useAppSelector(selector);
 
   if (!data) {
-    return <IAINoContentFallback label="No node selected" icon={null} />;
+    return <IAINoContentFallback label={t('nodes.noNodeSelected')} icon={null} />;
   }
 
   return <DataViewer data={data} label="Node Data" />;

invokeai/frontend/web/src/features/parameters/components/Canvas/InfillAndScaling/ParamScaleBeforeProcessing.tsx

@@ -8,18 +8,21 @@ import { selectOptimalDimension } from 'features/parameters/store/generationSlic
 import { memo, useCallback, useMemo } from 'react';
 import { useTranslation } from 'react-i18next';
 
-const OPTIONS: ComboboxOption[] = [
-  { label: 'None', value: 'none' },
-  { label: 'Auto', value: 'auto' },
-  { label: 'Manual', value: 'manual' },
-];
 
 const ParamScaleBeforeProcessing = () => {
   const dispatch = useAppDispatch();
   const { t } = useTranslation();
   const boundingBoxScaleMethod = useAppSelector((s) => s.canvas.boundingBoxScaleMethod);
   const optimalDimension = useAppSelector(selectOptimalDimension);
 
+  const OPTIONS: ComboboxOption[] = useMemo(() => [
+    { label: t('modelManager.none'), value: 'none' },
+    { label: t('common.auto'), value: 'auto' },
+    { label: t('modelManager.manual'), value: 'manual' },
+  ],
+  [t]
+  );
+
   const onChange = useCallback<ComboboxOnChange>(
     (v) => {
       if (!isBoundingBoxScaleMethod(v?.value)) {

invokeai/frontend/web/src/features/workflowLibrary/components/WorkflowLibraryList.tsx

@@ -37,20 +37,11 @@ const PER_PAGE = 10;
 const zOrderBy = z.enum(['opened_at', 'created_at', 'updated_at', 'name']);
 type OrderBy = z.infer<typeof zOrderBy>;
 const isOrderBy = (v: unknown): v is OrderBy => zOrderBy.safeParse(v).success;
-const ORDER_BY_OPTIONS: ComboboxOption[] = [
-  { value: 'opened_at', label: 'Opened' },
-  { value: 'created_at', label: 'Created' },
-  { value: 'updated_at', label: 'Updated' },
-  { value: 'name', label: 'Name' },
-];
 
 const zDirection = z.enum(['ASC', 'DESC']);
 type Direction = z.infer<typeof zDirection>;
 const isDirection = (v: unknown): v is Direction => zDirection.safeParse(v).success;
-const DIRECTION_OPTIONS: ComboboxOption[] = [
-  { value: 'ASC', label: 'Ascending' },
-  { value: 'DESC', label: 'Descending' },
-];
+
 
 const WorkflowLibraryList = () => {
   const { t } = useTranslation();
@@ -60,6 +51,22 @@ const WorkflowLibraryList = () => {
   const [query, setQuery] = useState('');
   const projectId = useStore($projectId);
 
+  const ORDER_BY_OPTIONS: ComboboxOption[] = useMemo(() => [
+    { value: 'opened_at', label: t('workflows.opened') },
+    { value: 'created_at', label: t('workflows.created') },
+    { value: 'updated_at', label: t('workflows.updated') },
+    { value: 'name', label: t('workflows.name') },
+  ],
+  [t]
+  );
+
+  const DIRECTION_OPTIONS: ComboboxOption[] = useMemo(() => [
+    { value: 'ASC', label: t('workflows.ascending') },
+    { value: 'DESC', label: t('workflows.descending') },
+  ],
+  [t]
+  );
+
   const orderByOptions = useMemo(() => {
     return projectId ? ORDER_BY_OPTIONS.filter((option) => option.value !== 'opened_at') : ORDER_BY_OPTIONS;
   }, [projectId]);