From 514d83c3c93c958970916ff4f8e7a421906a2c32 Mon Sep 17 00:00:00 2001
From: Paul Ccari <46382556+paulclindo@users.noreply.github.com>
Date: Thu, 13 Jun 2024 21:51:00 -0500
Subject: [PATCH] feat: add shinkai desktop version in settings (#335)

* fix: eslint

* add shinkai desktop version
---
 .eslintrc.json                                | 60 +++++++++++++++----
 apps/shinkai-desktop/src/App.tsx              | 14 ++---
 .../shinkai-node-manager/ollama-models.tsx    | 14 ++---
 apps/shinkai-desktop/src/pages/settings.tsx   | 19 +++++-
 4 files changed, 80 insertions(+), 27 deletions(-)

diff --git a/.eslintrc.json b/.eslintrc.json
index f38960c5f..233e5f7dc 100644
--- a/.eslintrc.json
+++ b/.eslintrc.json
@@ -1,8 +1,17 @@
 {
   "root": true,
-  "extends": ["eslint:recommended", "plugin:react/recommended"],
-  "ignorePatterns": ["**/*"],
-  "plugins": ["@nx", "simple-import-sort"],
+  "extends": [
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:react-hooks/recommended"
+  ],
+  "ignorePatterns": [
+    "**/*"
+  ],
+  "plugins": [
+    "@nx",
+    "simple-import-sort"
+  ],
   "rules": {
     "react/react-in-jsx-scope": "off",
     "react/jsx-uses-react": "off",
@@ -13,7 +22,12 @@
   },
   "overrides": [
     {
-      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "files": [
+        "*.ts",
+        "*.tsx",
+        "*.js",
+        "*.jsx"
+      ],
       "rules": {
         "@nx/enforce-module-boundaries": [
           "error",
@@ -23,7 +37,9 @@
             "depConstraints": [
               {
                 "sourceTag": "*",
-                "onlyDependOnLibsWithTags": ["*"]
+                "onlyDependOnLibsWithTags": [
+                  "*"
+                ]
               }
             ]
           }
@@ -31,19 +47,41 @@
       }
     },
     {
-      "files": ["*.ts", "*.tsx"],
-      "extends": ["plugin:@nx/typescript"],
+      "files": [
+        "*.ts",
+        "*.tsx"
+      ],
+      "extends": [
+        "plugin:@nx/typescript"
+      ],
       "rules": {
-        "react/no-unknown-property": ["error", { "ignore": ["cmdk-input-wrapper"] }]
+        "react/no-unknown-property": [
+          "error",
+          {
+            "ignore": [
+              "cmdk-input-wrapper"
+            ]
+          }
+        ]
       }
     },
     {
-      "files": ["*.js", "*.jsx"],
-      "extends": ["plugin:@nx/javascript"],
+      "files": [
+        "*.js",
+        "*.jsx"
+      ],
+      "extends": [
+        "plugin:@nx/javascript"
+      ],
       "rules": {}
     },
     {
-      "files": ["*.spec.ts", "*.spec.tsx", "*.spec.js", "*.spec.jsx"],
+      "files": [
+        "*.spec.ts",
+        "*.spec.tsx",
+        "*.spec.js",
+        "*.spec.jsx"
+      ],
       "env": {
         "jest": true
       },
diff --git a/apps/shinkai-desktop/src/App.tsx b/apps/shinkai-desktop/src/App.tsx
index c974b7ac0..bfe73caf5 100644
--- a/apps/shinkai-desktop/src/App.tsx
+++ b/apps/shinkai-desktop/src/App.tsx
@@ -12,16 +12,16 @@ initSyncStorage();
 
 function App() {
   return (
-    <AnalyticsProvider>
-      <QueryProvider>
-        <ErrorBoundary FallbackComponent={FullPageErrorFallback}>
+    <ErrorBoundary FallbackComponent={FullPageErrorFallback}>
+      <AnalyticsProvider>
+        <QueryProvider>
           <Router>
             <AppRoutes />
           </Router>
-        </ErrorBoundary>
-        <Toaster />
-      </QueryProvider>
-    </AnalyticsProvider>
+          <Toaster />
+        </QueryProvider>
+      </AnalyticsProvider>
+    </ErrorBoundary>
   );
 }
 
diff --git a/apps/shinkai-desktop/src/components/shinkai-node-manager/ollama-models.tsx b/apps/shinkai-desktop/src/components/shinkai-node-manager/ollama-models.tsx
index a36763633..5dea344c6 100644
--- a/apps/shinkai-desktop/src/components/shinkai-node-manager/ollama-models.tsx
+++ b/apps/shinkai-desktop/src/components/shinkai-node-manager/ollama-models.tsx
@@ -120,7 +120,13 @@ export const OllamaModels = () => {
       installedOllamaModels.models.forEach((modelResponse) => {
         installedOllamaModelsMap.set(modelResponse.name, modelResponse);
       });
-  }, [installedOllamaModels]);
+  }, [installedOllamaModels?.models, installedOllamaModelsMap]);
+
+  const modelList = useMemo(() => {
+    return OLLAMA_MODELS.sort((model) =>
+      installedOllamaModelsMap.has(model.fullName) ? -1 : 1,
+    );
+  }, [installedOllamaModelsMap]);
 
   if (!isShinkaiNodeRunning) {
     return (
@@ -143,12 +149,6 @@ export const OllamaModels = () => {
     );
   }
 
-  const modelList = useMemo(() => {
-    return OLLAMA_MODELS.sort((model) =>
-      installedOllamaModelsMap.has(model.fullName) ? -1 : 1,
-    );
-  }, [installedOllamaModelsMap]);
-
   return (
     <ScrollArea className="h-full flex-1 rounded-md">
       <Table className="w-full border-collapse text-[13px]">
diff --git a/apps/shinkai-desktop/src/pages/settings.tsx b/apps/shinkai-desktop/src/pages/settings.tsx
index 881796452..1adb35ee0 100644
--- a/apps/shinkai-desktop/src/pages/settings.tsx
+++ b/apps/shinkai-desktop/src/pages/settings.tsx
@@ -21,9 +21,10 @@ import {
 } from '@shinkai_network/shinkai-ui';
 import { ExportIcon, QrIcon } from '@shinkai_network/shinkai-ui/assets';
 import { cn } from '@shinkai_network/shinkai-ui/utils';
+import { getVersion } from '@tauri-apps/api/app';
 import { motion } from 'framer-motion';
 import { BarChart2, CodesandboxIcon, ExternalLinkIcon } from 'lucide-react';
-import { useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import { useForm, useWatch } from 'react-hook-form';
 import { useNavigate } from 'react-router-dom';
 import { toast } from 'sonner';
@@ -74,6 +75,8 @@ const SettingsPage = () => {
     node_address: auth?.node_address ?? '',
   });
 
+  const [appVersion, setAppVersion] = useState('');
+
   const form = useForm<FormSchemaType>({
     resolver: zodResolver(formSchema),
     defaultValues: {
@@ -89,6 +92,12 @@ const SettingsPage = () => {
     name: 'defaultAgentId',
   });
 
+  useEffect(() => {
+    (async () => {
+      setAppVersion(await getVersion());
+    })();
+  }, []);
+
   const { agents } = useAgents({
     nodeAddress: auth?.node_address ?? '',
     sender: auth?.shinkai_identity ?? '',
@@ -277,7 +286,7 @@ const SettingsPage = () => {
                     Save
                   </MotionButton>
                   <Button
-                    className="min-w-10 h-10 rounded-lg text-sm"
+                    className="h-10 min-w-10 rounded-lg text-sm"
                     onClick={() => {
                       form.setValue(
                         'shinkaiIdentity',
@@ -378,6 +387,12 @@ const SettingsPage = () => {
             <p className="text-smm text-white">Galxe Validation</p>
           </Button>
         </div>
+        <div>
+          <p className="text-gray-80 text-right text-xs">
+            Shinkai Desktop Version:{' '}
+            <span className="font-bold">{appVersion}</span>
+          </p>
+        </div>
       </div>
     </SimpleLayout>
   );