From 83ea20545d2338a205986431d24e9863fc96a6c3 Mon Sep 17 00:00:00 2001
From: headlessdev <damian.bergemann@outlook.com>
Date: Sat, 19 Apr 2025 00:13:12 +0200
Subject: [PATCH] Update server count handling in Dashboard component to
 separate physical servers and VMs

---
 app/dashboard/Dashboard.tsx | 23 +++++++++----
 components/ui/progress.tsx  | 31 +++++++++++++++++
 package-lock.json           | 67 +++++++++++++++++++++++++++----------
 package.json                |  1 +
 4 files changed, 99 insertions(+), 23 deletions(-)
 create mode 100644 components/ui/progress.tsx

diff --git a/app/dashboard/Dashboard.tsx b/app/dashboard/Dashboard.tsx
index b096e62..a514d2f 100644
--- a/app/dashboard/Dashboard.tsx
+++ b/app/dashboard/Dashboard.tsx
@@ -19,20 +19,23 @@ import { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle }
 import { Button } from "@/components/ui/button"
 
 interface StatsResponse {
-  serverCount: number
+  serverCountNoVMs: number
+  serverCountOnlyVMs: number
   applicationCount: number
   onlineApplicationsCount: number
 }
 
 export default function Dashboard() {
-  const [serverCount, setServerCount] = useState<number>(0)
+  const [serverCountNoVMs, setServerCountNoVMs] = useState<number>(0)
+  const [serverCountOnlyVMs, setServerCountOnlyVMs] = useState<number>(0)
   const [applicationCount, setApplicationCount] = useState<number>(0)
   const [onlineApplicationsCount, setOnlineApplicationsCount] = useState<number>(0)
 
   const getStats = async () => {
     try {
       const response = await axios.post<StatsResponse>("/api/dashboard/get", {})
-      setServerCount(response.data.serverCount)
+      setServerCountNoVMs(response.data.serverCountNoVMs)
+      setServerCountOnlyVMs(response.data.serverCountOnlyVMs)
       setApplicationCount(response.data.applicationCount)
       setOnlineApplicationsCount(response.data.onlineApplicationsCount)
     } catch (error: any) {
@@ -78,8 +81,16 @@ export default function Dashboard() {
                 <CardDescription>Manage your server infrastructure</CardDescription>
               </CardHeader>
               <CardContent className="pt-2 pb-4">
-                <div className="text-4xl font-bold">{serverCount}</div>
-                <p className="text-sm text-muted-foreground mt-2">Active servers</p>
+                <div className="flex items-center justify-between">
+                  <div className="flex flex-col">
+                    <div className="text-4xl font-bold">{serverCountNoVMs}</div>
+                    <p className="text-sm text-muted-foreground mt-2">Physical servers</p>
+                  </div>
+                  <div className="flex flex-col">
+                    <div className="text-4xl font-bold">{serverCountOnlyVMs}</div>
+                    <p className="text-sm text-muted-foreground mt-2">VMs</p>
+                  </div>
+                </div>
               </CardContent>
               <CardFooter className="border-t bg-muted/20 p-4">
                 <Button variant="ghost" size="default" className="w-full hover:bg-background font-medium" asChild>
@@ -152,7 +163,7 @@ export default function Dashboard() {
                 <CardDescription>Manage network configuration</CardDescription>
               </CardHeader>
               <CardContent className="pt-2 pb-4">
-                <div className="text-4xl font-bold">{serverCount + applicationCount}</div>
+                <div className="text-4xl font-bold">{serverCountNoVMs + serverCountOnlyVMs + applicationCount}</div>
                 <p className="text-sm text-muted-foreground mt-2">Active connections</p>
               </CardContent>
               <CardFooter className="border-t bg-muted/20 p-4">
diff --git a/components/ui/progress.tsx b/components/ui/progress.tsx
new file mode 100644
index 0000000..e7a416c
--- /dev/null
+++ b/components/ui/progress.tsx
@@ -0,0 +1,31 @@
+"use client"
+
+import * as React from "react"
+import * as ProgressPrimitive from "@radix-ui/react-progress"
+
+import { cn } from "@/lib/utils"
+
+function Progress({
+  className,
+  value,
+  ...props
+}: React.ComponentProps<typeof ProgressPrimitive.Root>) {
+  return (
+    <ProgressPrimitive.Root
+      data-slot="progress"
+      className={cn(
+        "bg-primary/20 relative h-2 w-full overflow-hidden rounded-full",
+        className
+      )}
+      {...props}
+    >
+      <ProgressPrimitive.Indicator
+        data-slot="progress-indicator"
+        className="bg-primary h-full w-full flex-1 transition-all"
+        style={{ transform: `translateX(-${100 - (value || 0)}%)` }}
+      />
+    </ProgressPrimitive.Root>
+  )
+}
+
+export { Progress }
diff --git a/package-lock.json b/package-lock.json
index 4c16a81..06fb48d 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,12 +1,12 @@
 {
   "name": "corecontrol",
-  "version": "0.0.6",
+  "version": "0.0.7",
   "lockfileVersion": 3,
   "requires": true,
   "packages": {
     "": {
       "name": "corecontrol",
-      "version": "0.0.6",
+      "version": "0.0.7",
       "dependencies": {
         "@prisma/client": "^6.6.0",
         "@prisma/extension-accelerate": "^1.3.0",
@@ -17,6 +17,7 @@
         "@radix-ui/react-dialog": "^1.1.7",
         "@radix-ui/react-dropdown-menu": "^2.1.7",
         "@radix-ui/react-label": "^2.1.3",
+        "@radix-ui/react-progress": "^1.1.4",
         "@radix-ui/react-scroll-area": "^1.2.4",
         "@radix-ui/react-select": "^2.1.7",
         "@radix-ui/react-separator": "^1.1.3",
@@ -1690,6 +1691,53 @@
         }
       }
     },
+    "node_modules/@radix-ui/react-progress": {
+      "version": "1.1.4",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-progress/-/react-progress-1.1.4.tgz",
+      "integrity": "sha512-8rl9w7lJdcVPor47Dhws9mUHRHLE+8JEgyJRdNWCpGPa6HIlr3eh+Yn9gyx1CnCLbw5naHsI2gaO9dBWO50vzw==",
+      "license": "MIT",
+      "dependencies": {
+        "@radix-ui/react-context": "1.1.2",
+        "@radix-ui/react-primitive": "2.1.0"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+        "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
+    "node_modules/@radix-ui/react-progress/node_modules/@radix-ui/react-primitive": {
+      "version": "2.1.0",
+      "resolved": "https://registry.npmjs.org/@radix-ui/react-primitive/-/react-primitive-2.1.0.tgz",
+      "integrity": "sha512-/J/FhLdK0zVcILOwt5g+dH4KnkonCtkVJsa2G6JmvbbtZfBEI1gMsO3QMjseL4F/SwfAMt1Vc/0XKYKq+xJ1sw==",
+      "license": "MIT",
+      "dependencies": {
+        "@radix-ui/react-slot": "1.2.0"
+      },
+      "peerDependencies": {
+        "@types/react": "*",
+        "@types/react-dom": "*",
+        "react": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc",
+        "react-dom": "^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc"
+      },
+      "peerDependenciesMeta": {
+        "@types/react": {
+          "optional": true
+        },
+        "@types/react-dom": {
+          "optional": true
+        }
+      }
+    },
     "node_modules/@radix-ui/react-roving-focus": {
       "version": "1.1.3",
       "resolved": "https://registry.npmjs.org/@radix-ui/react-roving-focus/-/react-roving-focus-1.1.3.tgz",
@@ -4609,21 +4657,6 @@
           "optional": true
         }
       }
-    },
-    "node_modules/@next/swc-win32-x64-msvc": {
-      "version": "15.3.0",
-      "resolved": "https://registry.npmjs.org/@next/swc-win32-x64-msvc/-/swc-win32-x64-msvc-15.3.0.tgz",
-      "integrity": "sha512-vHUQS4YVGJPmpjn7r5lEZuMhK5UQBNBRSB+iGDvJjaNk649pTIcRluDWNb9siunyLLiu/LDPHfvxBtNamyuLTw==",
-      "cpu": [
-        "x64"
-      ],
-      "optional": true,
-      "os": [
-        "win32"
-      ],
-      "engines": {
-        "node": ">= 10"
-      }
     }
   }
 }
diff --git a/package.json b/package.json
index f6e940c..69f0be1 100644
--- a/package.json
+++ b/package.json
@@ -18,6 +18,7 @@
     "@radix-ui/react-dialog": "^1.1.7",
     "@radix-ui/react-dropdown-menu": "^2.1.7",
     "@radix-ui/react-label": "^2.1.3",
+    "@radix-ui/react-progress": "^1.1.4",
     "@radix-ui/react-scroll-area": "^1.2.4",
     "@radix-ui/react-select": "^2.1.7",
     "@radix-ui/react-separator": "^1.1.3",