fix: update process.env to import.meta

src/components/DeviceSelector.tsx

@@ -5,9 +5,7 @@ import { Code } from "@components/UI/Typography/Code.tsx";
 import { useAppStore } from "@core/stores/appStore.ts";
 import { useDeviceStore } from "@core/stores/deviceStore.ts";
 import { HomeIcon, PlusIcon, SearchIcon } from "lucide-react";
-
-import { Avatar } from "./UI/Avatar.tsx";
-import process from "node:process";
+import { Avatar } from "@components/UI/Avatar.tsx";
 
 export const DeviceSelector = () => {
   const { getDevices } = useDeviceStore();
@@ -17,6 +15,7 @@ export const DeviceSelector = () => {
     setCommandPaletteOpen,
     setConnectDialogOpen,
   } = useAppStore();
+  console.log(import.meta.env.VITE_COMMIT_HASH);
 
   return (
     <nav className="flex flex-col justify-between border-r-[0.5px]  border-slate-300 pt-2 dark:border-slate-700">
@@ -71,7 +70,7 @@ export const DeviceSelector = () => {
         </button> */
         }
         <Separator />
-        <Code>{process.env.COMMIT_HASH}</Code>
+        <Code>{import.meta.env.VITE_COMMIT_HASH}</Code>
       </div>
     </nav>
   );

src/components/PageComponents/Config/Security/Security.tsx

@@ -58,8 +58,7 @@ export const Security = () => {
       if (input.length % 4 !== 0) {
         addError(
           fieldName,
-          `${
-            fieldName === "privateKey" ? "Private" : "Admin"
+          `${fieldName === "privateKey" ? "Private" : "Admin"
           } Key is required to be a 256 bit pre-shared key (PSK)`,
         );
         return;
@@ -74,8 +73,7 @@ export const Security = () => {
       console.error(e);
       addError(
         fieldName,
-        `Invalid ${
-          fieldName === "privateKey" ? "Private" : "Admin"
+        `Invalid ${fieldName === "privateKey" ? "Private" : "Admin"
         } Key format`,
       );
     }
@@ -85,8 +83,6 @@ export const Security = () => {
     if (hasErrors()) {
       return;
     }
-    console.log(toByteArray(state.adminKey));
-
     setWorkingConfig(
       create(Protobuf.Config.ConfigSchema, {
         payloadVariant: {

src/components/UI/Footer.tsx

@@ -1,10 +1,10 @@
-import { cn } from "../../core/utils/cn.ts";
-import React from "react";
+import { cn } from "@core/utils/cn.ts"
 
-export interface FooterProps extends React.HTMLAttributes<HTMLElement> {}
+type FooterProps = {
+  className?: string;
+}
 
-const Footer = React.forwardRef<HTMLElement, FooterProps>(
-  ({ className, ...props }) => {
+const Footer = ({ className, ...props }: FooterProps) => {
   return (
     <footer
       className={cn("flex mt-auto justify-center p-2", className)}
@@ -27,7 +27,6 @@ const Footer = React.forwardRef<HTMLElement, FooterProps>(
       </p>
     </footer>
   );
-  },
-);
+}
 
 export default Footer;

src/components/UI/Generator.tsx

@@ -33,7 +33,7 @@ export interface GeneratorProps extends React.BaseHTMLAttributes<HTMLElement> {
   disabled?: boolean;
 }
 
-const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
+const Generator =
   (
     {
       type,
@@ -53,7 +53,7 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
       action,
       disabled,
       ...props
-    },
+    }: GeneratorProps
   ) => {
     const inputRef = React.useRef<HTMLInputElement>(null);
 
@@ -115,8 +115,7 @@ const Generator = React.forwardRef<HTMLInputElement, GeneratorProps>(
         </div>
       </>
     );
-  },
-);
+  }
 Generator.displayName = "Button";
 
 export { Generator };

vite.config.ts

@@ -1,18 +1,26 @@
-import { defineConfig } from 'vitest/config'
+import { defineConfig } from 'vite';
 import react from '@vitejs/plugin-react';
 import { VitePWA } from 'vite-plugin-pwa';
-import { execSync } from 'node:child_process';
 import path from 'node:path';
 
 let hash = '';
 try {
-  hash = execSync('git rev-parse --short HEAD').toString().trim();
+  const process = new Deno.Command('git', {
+    args: ['rev-parse', '--short', 'HEAD'],
+    stdout: 'piped'
+  });
+  const output = await process.output();
+  hash = new TextDecoder().decode(output.stdout).trim();
 } catch (error) {
+  console.error('Error getting git hash:', error);
   hash = 'DEV';
 }
 
+console.log('Commit hash:', hash);
+
 export default defineConfig({
-  plugins: [react(),
+  plugins: [
+    react(),
     VitePWA({
       registerType: 'autoUpdate',
       strategies: 'generateSW',
@@ -26,15 +34,15 @@ export default defineConfig({
     })
   ],
   define: {
-    'process.env.COMMIT_HASH': JSON.stringify(hash),
+    'import.meta.env.VITE_COMMIT_HASH': JSON.stringify(hash),
   },
   resolve: {
     alias: {
-      '@app': path.resolve(__dirname, './src'),
-      '@pages': path.resolve(__dirname, './src/pages'),
-      '@components': path.resolve(__dirname, './src/components'),
-      '@core': path.resolve(__dirname, './src/core'),
-      '@layouts': path.resolve(__dirname, './src/layouts'),
+      '@app': path.resolve(Deno.cwd(), './src'),
+      '@pages': path.resolve(Deno.cwd(), './src/pages'),
+      '@components': path.resolve(Deno.cwd(), './src/components'),
+      '@core': path.resolve(Deno.cwd(), './src/core'),
+      '@layouts': path.resolve(Deno.cwd(), './src/layouts'),
     },
   },
   server: {