feat: show model size in model list

Author: Kevin Turner

Diff for: invokeai/frontend/web/public/locales/en.json

@@ -841,6 +841,7 @@
         "selectModel": "Select Model",
         "settings": "Settings",
         "simpleModelPlaceholder": "URL or path to a local file or diffusers folder",
+      "size": "Size",
         "source": "Source",
         "sigLip": "SigLIP",
         "spandrelImageToImage": "Image to Image (Spandrel)",

Diff for: invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelManagerPanel/ModelListItem.tsx

@@ -108,6 +108,9 @@ const ModelListItem = ({ model }: ModelListItemProps) => {
           <ModelBaseBadge base={model.base} />
           <ModelFormatBadge format={model.format} />
         </Flex>
+        <Text>
+          {Intl.NumberFormat(undefined, { maximumFractionDigits: 2 }).format(model.size / (1024 ** 3))} GB
+        </Text>
       </Flex>
       <IconButton
         onClick={onClickDeleteButton}

Diff for: invokeai/frontend/web/src/features/modelManagerV2/subpanels/ModelPanel/ModelView.tsx

@@ -50,6 +50,8 @@ export const ModelView = memo(({ modelConfig }: Props) => {
             <ModelAttrView label={t('modelManager.modelType')} value={modelConfig.type} />
             <ModelAttrView label={t('common.format')} value={modelConfig.format} />
             <ModelAttrView label={t('modelManager.path')} value={modelConfig.path} />
+            <ModelAttrView label={t('modelManager.size')}
+                           value={Intl.NumberFormat(undefined, { maximumFractionDigits: 2 }).format(modelConfig.size / (1024 ** 3)) + ' GB'} />
             {modelConfig.type === 'main' && (
               <ModelAttrView label={t('modelManager.variant')} value={modelConfig.variant} />
             )}