From fc1f92797b10921f8a6cd1516b6c5bf1bbd656e8 Mon Sep 17 00:00:00 2001
From: Louis Beaumont <louis.beaumont@gmail.com>
Date: Wed, 18 Sep 2024 12:22:19 -0700
Subject: [PATCH] feat: VAD sensitivity in CLI & app ui settings

---
 .../components/log-viewer-v2.tsx              | 70 ++++++++++++++-----
 .../components/recording-settings.tsx         |  9 +--
 screenpipe-app-tauri/src-tauri/Cargo.toml     |  2 +-
 3 files changed, 54 insertions(+), 27 deletions(-)

diff --git a/screenpipe-app-tauri/components/log-viewer-v2.tsx b/screenpipe-app-tauri/components/log-viewer-v2.tsx
index 69997657..2c4306d8 100644
--- a/screenpipe-app-tauri/components/log-viewer-v2.tsx
+++ b/screenpipe-app-tauri/components/log-viewer-v2.tsx
@@ -1,28 +1,50 @@
 import React, { useEffect, useState, useRef } from "react";
 import { listen } from "@tauri-apps/api/event";
 import { cn } from "@/lib/utils";
-import Convert from 'ansi-to-html';
+import Convert from "ansi-to-html";
+import localforage from "localforage";
+import { Button } from "./ui/button"; // import Button component
 
 interface LogViewerProps {
   className?: string;
 }
 
-const convert = new Convert({newline: true});
+const convert = new Convert({ newline: true });
 
 const LogViewer: React.FC<LogViewerProps> = ({ className }) => {
   const [logs, setLogs] = useState<string[]>([]);
   const logContainerRef = useRef<HTMLDivElement>(null);
 
   useEffect(() => {
+    const initLogs = async () => {
+      // load logs from localforage
+      const storedLogs = await localforage.getItem<string[]>("sidecar_logs");
+      if (storedLogs) {
+        setLogs(storedLogs);
+      }
+    };
+
+    initLogs();
+
     const unlisten = listen<string>("sidecar_log", (event) => {
-      setLogs((prevLogs) => [...prevLogs, event.payload].slice(-100)); // Keep last 100 logs
+      setLogs((prevLogs) => {
+        const newLogs = [...prevLogs, event.payload].slice(-100);
+        localforage.setItem("sidecar_logs", newLogs);
+        return newLogs;
+      });
     });
 
     return () => {
-      unlisten.then((f) => f()); // Cleanup listener when component unmounts
+      unlisten.then((f) => f());
     };
   }, []);
 
+  // function to clear logs
+  const clearLogs = async () => {
+    await localforage.removeItem("sidecar_logs");
+    setLogs([]);
+  };
+
   useEffect(() => {
     if (logContainerRef.current) {
       logContainerRef.current.scrollTop = logContainerRef.current.scrollHeight;
@@ -32,21 +54,31 @@ const LogViewer: React.FC<LogViewerProps> = ({ className }) => {
   const htmlLogs = logs.map((log) => convert.toHtml(log));
 
   return (
-    <div 
-      ref={logContainerRef}
-      className={cn(
-        "h-64 overflow-y-auto bg-black p-2 font-mono text-sm text-white",
-        "whitespace-pre-wrap break-words",
-        className
-      )}
-    >
-      {htmlLogs.map((log, index) => (
-        <div 
-          key={index} 
-          dangerouslySetInnerHTML={{ __html: log }} 
-          className="leading-5"
-        />
-      ))}
+    <div className="flex flex-col py-2">
+      <Button
+        onClick={clearLogs}
+        className="mb-2 self-end"
+        variant="outline"
+        size="sm"
+      >
+        clear logs
+      </Button>
+      <div
+        ref={logContainerRef}
+        className={cn(
+          "h-64 overflow-y-auto bg-black p-2 font-mono text-sm text-white",
+          "whitespace-pre-wrap break-words",
+          className
+        )}
+      >
+        {htmlLogs.map((log, index) => (
+          <div
+            key={index}
+            dangerouslySetInnerHTML={{ __html: log }}
+            className="leading-5"
+          />
+        ))}
+      </div>
     </div>
   );
 };
diff --git a/screenpipe-app-tauri/components/recording-settings.tsx b/screenpipe-app-tauri/components/recording-settings.tsx
index 28b59a2c..feb3e15b 100644
--- a/screenpipe-app-tauri/components/recording-settings.tsx
+++ b/screenpipe-app-tauri/components/recording-settings.tsx
@@ -272,17 +272,12 @@ export function RecordingSettings({
     setLocalSettings({ ...localSettings, fps: value[0] });
   };
 
-  const vadSensitivityOptions = [
-    { value: 0, label: "low" },
-    { value: 1, label: "medium" },
-    { value: 2, label: "high" },
-  ];
 
   const handleVadSensitivityChange = (value: number[]) => {
     const sensitivityMap: { [key: number]: VadSensitivity } = {
-      0: "high",
+      2: "high",
       1: "medium",
-      2: "low",
+      0: "low",
     };
     setLocalSettings({
       ...localSettings,
diff --git a/screenpipe-app-tauri/src-tauri/Cargo.toml b/screenpipe-app-tauri/src-tauri/Cargo.toml
index 58f4fd7b..479e9f47 100644
--- a/screenpipe-app-tauri/src-tauri/Cargo.toml
+++ b/screenpipe-app-tauri/src-tauri/Cargo.toml
@@ -1,6 +1,6 @@
 [package]
 name = "screenpipe-app"
-version = "0.2.50"
+version = "0.2.51"
 description = ""
 authors = ["you"]
 license = ""