Add back button

web/src/types/frigateConfig.ts

@@ -282,6 +282,7 @@ export type CameraStreamingSettings = {
 export type CustomClassificationModelConfig = {
   enabled: boolean;
   name: string;
+  threshold: number;
   object_config: null | {
     objects: string[];
   };
@@ -289,7 +290,6 @@ export type CustomClassificationModelConfig = {
     cameras: {
       [cameraName: string]: {
         crop: [number, number, number, number];
-        threshold: number;
       };
     };
     motion: boolean;

web/src/views/classification/ModelTrainingView.tsx

@@ -48,12 +48,15 @@ import { TbCategoryPlus } from "react-icons/tb";
 import { useModelState } from "@/api/ws";
 import { ModelState } from "@/types/ws";
 import ActivityIndicator from "@/components/indicators/activity-indicator";
+import { useNavigate } from "react-router-dom";
+import { IoMdArrowRoundBack } from "react-icons/io";
 
 type ModelTrainingViewProps = {
   model: CustomClassificationModelConfig;
 };
 export default function ModelTrainingView({ model }: ModelTrainingViewProps) {
   const { t } = useTranslation(["views/classificationModel"]);
+  const navigate = useNavigate();
   const [page, setPage] = useState<string>("train");
   const [pageToggle, setPageToggle] = useOptimisticState(page, setPage, 100);
 
@@ -294,14 +297,28 @@ export default function ModelTrainingView({ model }: ModelTrainingViewProps) {
       </AlertDialog>
 
       <div className="flex flex-row justify-between gap-2 p-2 align-middle">
-        <LibrarySelector
-          pageToggle={pageToggle}
-          dataset={dataset || {}}
-          trainImages={trainImages || []}
-          setPageToggle={setPageToggle}
-          onDelete={onDelete}
-          onRename={() => {}}
-        />
+        <div className="flex flex-row items-center justify-center gap-2">
+          <Button
+            className="flex items-center gap-2.5 rounded-lg"
+            aria-label={t("label.back", { ns: "common" })}
+            onClick={() => navigate(-1)}
+          >
+            <IoMdArrowRoundBack className="size-5 text-secondary-foreground" />
+            {isDesktop && (
+              <div className="text-primary">
+                {t("button.back", { ns: "common" })}
+              </div>
+            )}
+          </Button>
+          <LibrarySelector
+            pageToggle={pageToggle}
+            dataset={dataset || {}}
+            trainImages={trainImages || []}
+            setPageToggle={setPageToggle}
+            onDelete={onDelete}
+            onRename={() => {}}
+          />
+        </div>
         {selectedImages?.length > 0 ? (
           <div className="flex items-center justify-center gap-2">
             <div className="mx-1 flex w-48 items-center justify-center text-sm text-muted-foreground">