@cybermem/dashboard 0.8.5 → 0.8.9

package/components/ui/tint-button.tsx

@@ -0,0 +1,91 @@
+"use client";
+
+import { cn } from "@/lib/utils";
+import { forwardRef } from "react";
+
+type TintColor = "emerald" | "yellow" | "red" | "sky" | "neutral";
+
+interface TintButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  tint?: TintColor;
+  variant?: "solid" | "outline" | "ghost";
+  size?: "sm" | "md" | "lg" | "icon";
+  children: React.ReactNode;
+}
+
+const tintStyles: Record<TintColor, Record<string, string>> = {
+  emerald: {
+    solid:
+      "bg-emerald-500/20 hover:bg-emerald-500/30 border-emerald-500/20 text-emerald-400",
+    outline:
+      "bg-transparent hover:bg-emerald-500/10 border-emerald-500/20 text-emerald-400",
+    ghost:
+      "bg-transparent hover:bg-emerald-500/10 border-transparent text-emerald-400",
+  },
+  yellow: {
+    solid:
+      "bg-yellow-500/20 hover:bg-yellow-500/30 border-yellow-500/20 text-yellow-400",
+    outline:
+      "bg-transparent hover:bg-yellow-500/10 border-yellow-500/20 text-yellow-400",
+    ghost:
+      "bg-transparent hover:bg-yellow-500/10 border-transparent text-yellow-400",
+  },
+  red: {
+    solid: "bg-red-500/20 hover:bg-red-500/30 border-red-500/20 text-red-400",
+    outline:
+      "bg-transparent hover:bg-red-500/10 border-red-500/20 text-red-400",
+    ghost: "bg-transparent hover:bg-red-500/10 border-transparent text-red-400",
+  },
+  sky: {
+    solid: "bg-sky-500/20 hover:bg-sky-500/30 border-sky-500/20 text-sky-400",
+    outline:
+      "bg-transparent hover:bg-sky-500/10 border-sky-500/20 text-sky-400",
+    ghost: "bg-transparent hover:bg-sky-500/10 border-transparent text-sky-400",
+  },
+  neutral: {
+    solid: "bg-white/10 hover:bg-white/20 border-white/10 text-white",
+    outline: "bg-transparent hover:bg-white/5 border-white/10 text-neutral-300",
+    ghost:
+      "bg-transparent hover:bg-white/5 border-transparent text-neutral-400 hover:text-white",
+  },
+};
+
+const sizeStyles = {
+  sm: "h-8 px-3 text-xs",
+  md: "h-10 px-4 text-sm",
+  lg: "h-11 px-6 text-base",
+  icon: "h-9 w-9 p-0",
+};
+
+export const TintButton = forwardRef<HTMLButtonElement, TintButtonProps>(
+  (
+    {
+      tint = "emerald",
+      variant = "solid",
+      size = "md",
+      className,
+      children,
+      ...props
+    },
+    ref,
+  ) => {
+    return (
+      <button
+        ref={ref}
+        className={cn(
+          "inline-flex items-center justify-center gap-2 rounded-lg border font-medium transition-all",
+          "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:ring-offset-[#0B1116]",
+          "disabled:opacity-50 disabled:cursor-not-allowed",
+          "[&_svg]:shrink-0",
+          tintStyles[tint][variant],
+          sizeStyles[size],
+          className,
+        )}
+        {...props}
+      >
+        {children}
+      </button>
+    );
+  },
+);
+
+TintButton.displayName = "TintButton";

package/middleware.ts

@@ -60,6 +60,6 @@ export const config = {
     // - Next.js internals
     // - Static files
     // - Health check (for monitoring)
-    "/((?!api/auth|api/health|_next|favicon.ico|.*\\.(?:svg|png|jpg|jpeg|gif|webp)$).*)",
+    "/((?!api/auth|api/health|api/environment|_next|favicon.ico|.*\\.(?:svg|png|jpg|jpeg|gif|webp)$).*)",
   ],
 };

package/next.config.mjs

@@ -5,10 +5,15 @@ const nextConfig = {
   },
   output: "standalone",
   transpilePackages: ["recharts"],
-  serverExternalPackages: ["dockerode", "ssh2"],
+  serverExternalPackages: ["dockerode", "ssh2", "sqlite3"],
   experimental: {},
   webpack: (config) => {
-    config.externals = [...(config.externals || []), "ssh2", "dockerode"];
+    config.externals = [
+      ...(config.externals || []),
+      "ssh2",
+      "dockerode",
+      "sqlite3",
+    ];
     return config;
   },
   async rewrites() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cybermem/dashboard",
-  "version": "0.8.5",
+  "version": "0.8.9",
   "description": "CyberMem Monitoring Dashboard",
   "homepage": "https://cybermem.dev",
   "repository": {

package/components/dashboard/password-alert-modal.tsx

@@ -1,72 +0,0 @@
-"use client"
-
-import { Button } from "@/components/ui/button"
-import { AlertTriangle, Settings, X } from "lucide-react"
-
-interface PasswordAlertModalProps {
-  onChangePassword: () => void
-  onDismiss: () => void
-}
-
-export default function PasswordAlertModal({
-  onChangePassword,
-  onDismiss
-}: PasswordAlertModalProps) {
-  const handleDontShowAgain = () => {
-    localStorage.setItem("hidePasswordWarning", "true")
-    onDismiss()
-  }
-
-  return (
-    <div className="fixed inset-0 bg-black/60 backdrop-blur-sm flex items-center justify-center z-50 p-4">
-      <div
-        className="bg-[#0B1116]/90 backdrop-blur-xl border border-amber-500/30 rounded-2xl shadow-2xl max-w-md w-full overflow-hidden animate-in fade-in zoom-in-95 duration-200"
-        style={{
-          backgroundImage: `
-            radial-gradient(circle at 0% 0%, rgba(251, 191, 36, 0.05) 0%, transparent 50%),
-            radial-gradient(circle at 100% 100%, rgba(251, 191, 36, 0.05) 0%, transparent 50%)
-          `
-        }}
-      >
-        {/* Header */}
-        <div className="px-6 pt-6 pb-4 flex items-start gap-4">
-          <div className="p-3 bg-amber-500/10 rounded-full border border-amber-500/20 shrink-0">
-            <AlertTriangle className="w-6 h-6 text-amber-400 drop-shadow-[0_0_10px_rgba(251,191,36,0.5)]" />
-          </div>
-          <div className="flex-1">
-            <h2 className="text-lg font-semibold text-white">Default Password Detected</h2>
-            <p className="text-neutral-400 text-sm mt-1">
-              You&apos;re using the default admin password. For security, we recommend changing it now.
-            </p>
-          </div>
-          <Button
-            variant="ghost"
-            size="icon"
-            onClick={onDismiss}
-            className="text-neutral-400 hover:text-white hover:bg-white/10 rounded-full -mt-1 -mr-2"
-          >
-            <X className="w-4 h-4" />
-          </Button>
-        </div>
-
-        {/* Actions */}
-        <div className="px-6 pb-6 flex flex-col gap-3">
-          <Button
-            onClick={onChangePassword}
-            className="w-full bg-emerald-500/20 hover:bg-emerald-500/30 border border-emerald-500/20 text-emerald-400 font-medium transition-colors gap-2"
-          >
-            <Settings className="w-4 h-4" />
-            Change Password
-          </Button>
-          <Button
-            variant="ghost"
-            onClick={handleDontShowAgain}
-            className="w-full text-neutral-400 hover:text-white hover:bg-white/10"
-          >
-            Don&apos;t show again
-          </Button>
-        </div>
-      </div>
-    </div>
-  )
-}