From 1abd3c68ecb7a1339ebc6efb0b758cb795dc8666 Mon Sep 17 00:00:00 2001
From: leccelecce <24962424+leccelecce@users.noreply.github.com>
Date: Thu, 17 Apr 2025 15:48:56 +0100
Subject: [PATCH] Plus Settings: add base model and name (#17738)

* Plus Settings: add base model and name

* I18n change user model to fine-tuned model

* Move fields in drop-down for mobile

* Missed commit

* remove unused i18n key

* Add base/FTM to model Type, reorder Model Information fields

* fix missing availableModels for now

* shorten Fine-Tuned Model to Fine-Tuned

* isBaseModel is already available in config, use that

* Change Base Model to Default

* minor tweaks

* Revert "Change Base Model to Default"

This reverts commit 0191aa34f60dcde806ec7b00cc687aada6161657.
---
 web/public/locales/en/views/settings.json     |  5 +-
 web/src/types/frigateConfig.ts                |  1 +
 .../settings/FrigatePlusSettingsView.tsx      | 92 ++++++++++++++-----
 3 files changed, 72 insertions(+), 26 deletions(-)

diff --git a/web/public/locales/en/views/settings.json b/web/public/locales/en/views/settings.json
index a76c09254..bab58a7a4 100644
--- a/web/public/locales/en/views/settings.json
+++ b/web/public/locales/en/views/settings.json
@@ -571,8 +571,11 @@
       "modelType": "Model Type",
       "trainDate": "Train Date",
       "baseModel": "Base Model",
+      "plusModelType": {
+        "baseModel": "Base Model",
+        "userModel": "Fine-Tuned"
+      },
       "supportedDetectors": "Supported Detectors",
-      "dimensions": "Dimensions",
       "cameras": "Cameras",
       "loading": "Loading model information...",
       "error": "Failed to load model information",
diff --git a/web/src/types/frigateConfig.ts b/web/src/types/frigateConfig.ts
index 6c7c6adf6..a6784e559 100644
--- a/web/src/types/frigateConfig.ts
+++ b/web/src/types/frigateConfig.ts
@@ -408,6 +408,7 @@ export interface FrigateConfig {
       id: string;
       trainDate: string;
       baseModel: string;
+      isBaseModel: boolean;
       supportedDetectors: string[];
       width: number;
       height: number;
diff --git a/web/src/views/settings/FrigatePlusSettingsView.tsx b/web/src/views/settings/FrigatePlusSettingsView.tsx
index 49426bbe9..8b2061a23 100644
--- a/web/src/views/settings/FrigatePlusSettingsView.tsx
+++ b/web/src/views/settings/FrigatePlusSettingsView.tsx
@@ -26,6 +26,8 @@ import {
 type FrigatePlusModel = {
   id: string;
   type: string;
+  name: string;
+  isBaseModel: boolean;
   supportedDetectors: string[];
   trainDate: string;
   baseModel: string;
@@ -273,13 +275,17 @@ export default function FrigatePlusSettingsView({
                       <div className="grid grid-cols-2 gap-4">
                         <div>
                           <Label className="text-muted-foreground">
-                            {t("frigatePlus.modelInfo.modelType")}
+                            {t("frigatePlus.modelInfo.baseModel")}
                           </Label>
                           <p>
-                            {config.model.plus.name} (
-                            {config.model.plus.width +
-                              "x" +
-                              config.model.plus.height}
+                            {config.model.plus.baseModel} (
+                            {config.model.plus.isBaseModel
+                              ? t(
+                                  "frigatePlus.modelInfo.plusModelType.baseModel",
+                                )
+                              : t(
+                                  "frigatePlus.modelInfo.plusModelType.userModel",
+                                )}
                             )
                           </p>
                         </div>
@@ -295,9 +301,15 @@ export default function FrigatePlusSettingsView({
                         </div>
                         <div>
                           <Label className="text-muted-foreground">
-                            {t("frigatePlus.modelInfo.baseModel")}
+                            {t("frigatePlus.modelInfo.modelType")}
                           </Label>
-                          <p>{config.model.plus.baseModel}</p>
+                          <p>
+                            {config.model.plus.name} (
+                            {config.model.plus.width +
+                              "x" +
+                              config.model.plus.height}
+                            )
+                          </p>
                         </div>
                         <div>
                           <Label className="text-muted-foreground">
@@ -328,25 +340,45 @@ export default function FrigatePlusSettingsView({
                               })
                             }
                           >
-                            <SelectTrigger>
-                              {frigatePlusSettings.model.id &&
-                              availableModels?.[frigatePlusSettings.model.id]
-                                ? new Date(
-                                    availableModels[
-                                      frigatePlusSettings.model.id
-                                    ].trainDate,
-                                  ).toLocaleString() +
+                            {frigatePlusSettings.model.id &&
+                            availableModels?.[frigatePlusSettings.model.id] ? (
+                              <SelectTrigger>
+                                {new Date(
+                                  availableModels[
+                                    frigatePlusSettings.model.id
+                                  ].trainDate,
+                                ).toLocaleString() +
+                                  " " +
+                                  availableModels[frigatePlusSettings.model.id]
+                                    .baseModel +
+                                  " (" +
+                                  (availableModels[frigatePlusSettings.model.id]
+                                    .isBaseModel
+                                    ? t(
+                                        "frigatePlus.modelInfo.plusModelType.baseModel",
+                                      )
+                                    : t(
+                                        "frigatePlus.modelInfo.plusModelType.userModel",
+                                      )) +
+                                  ") " +
+                                  availableModels[frigatePlusSettings.model.id]
+                                    .name +
                                   " (" +
                                   availableModels[frigatePlusSettings.model.id]
                                     .width +
                                   "x" +
                                   availableModels[frigatePlusSettings.model.id]
                                     .height +
-                                  ")"
-                                : t(
-                                    "frigatePlus.modelInfo.loadingAvailableModels",
-                                  )}
-                            </SelectTrigger>
+                                  ")"}
+                              </SelectTrigger>
+                            ) : (
+                              <SelectTrigger>
+                                {t(
+                                  "frigatePlus.modelInfo.loadingAvailableModels",
+                                )}
+                              </SelectTrigger>
+                            )}
+
                             <SelectContent>
                               <SelectGroup>
                                 {Object.entries(availableModels || {}).map(
@@ -366,17 +398,27 @@ export default function FrigatePlusSettingsView({
                                       {new Date(
                                         model.trainDate,
                                       ).toLocaleString()}{" "}
-                                      ({model.baseModel})
+                                      <div>
+                                        {model.baseModel} {" ("}
+                                        {model.isBaseModel
+                                          ? t(
+                                              "frigatePlus.modelInfo.plusModelType.baseModel",
+                                            )
+                                          : t(
+                                              "frigatePlus.modelInfo.plusModelType.userModel",
+                                            )}
+                                        {")"}
+                                      </div>
+                                      <div>
+                                        {model.name} (
+                                        {model.width + "x" + model.height})
+                                      </div>
                                       <div>
                                         {t(
                                           "frigatePlus.modelInfo.supportedDetectors",
                                         )}
                                         : {model.supportedDetectors.join(", ")}
                                       </div>
-                                      <div>
-                                        {t("frigatePlus.modelInfo.dimensions")}:{" "}
-                                        {model.width + "x" + model.height}
-                                      </div>
                                       <div className="text-xs text-muted-foreground">
                                         {id}
                                       </div>