From 647a26db94e20dd8b7b92de332b15df736d4e5c3 Mon Sep 17 00:00:00 2001
From: Adrian Bonpin <adrianbonpin@gmail.com>
Date: Mon, 27 Apr 2026 22:22:52 +0800
Subject: [PATCH] chore: fix build errors and lint warnings from devices/admin
 implementation
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Fix setRole type error (cast to admin-accepted role type)
- Fix OG image edge runtime → nodejs (Drizzle needs Node.js)
- Fix eslint set-state-in-effect warnings
- Fix img → next/image in admin users client
- Remove unused eslint-disable directives
---
 app/(admin)/admin/hardware/hardware-client.tsx | 1 +
 app/(admin)/admin/users/users-client.tsx       | 7 +++++--
 app/devices/[slug]/device-detail-client.tsx    | 3 ++-
 app/devices/[slug]/opengraph-image.tsx         | 2 +-
 4 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/app/(admin)/admin/hardware/hardware-client.tsx b/app/(admin)/admin/hardware/hardware-client.tsx
index 5e278cd..aa02e86 100644
--- a/app/(admin)/admin/hardware/hardware-client.tsx
+++ b/app/(admin)/admin/hardware/hardware-client.tsx
@@ -66,6 +66,7 @@ export function HardwareClient() {
   }
 
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect
     fetchDevices()
   }, [])
 
diff --git a/app/(admin)/admin/users/users-client.tsx b/app/(admin)/admin/users/users-client.tsx
index 4474e43..c3a267b 100644
--- a/app/(admin)/admin/users/users-client.tsx
+++ b/app/(admin)/admin/users/users-client.tsx
@@ -1,6 +1,7 @@
 "use client"
 
 import { useEffect, useMemo, useState } from "react"
+import Image from "next/image"
 import { authClient } from "@/lib/auth-client"
 import { Loader2, SearchIcon, BanIcon, UserCheckIcon } from "lucide-react"
 
@@ -60,7 +61,7 @@ export function UsersClient() {
   const handleRoleChange = async (userId: string, newRole: Role) => {
     setActionLoading((prev) => ({ ...prev, [userId]: true }))
     try {
-      await authClient.admin.setRole({ userId, role: newRole })
+      await authClient.admin.setRole({ userId, role: newRole as "user" | "admin" })
       setUsers((prev) =>
         prev.map((u) => (u.id === userId ? { ...u, role: newRole } : u))
       )
@@ -151,9 +152,11 @@ export function UsersClient() {
                   <td className="px-4 py-3">
                     <div className="flex items-center gap-3">
                       {user.image ? (
-                        <img
+                        <Image
                           src={user.image}
                           alt=""
+                          width={32}
+                          height={32}
                           className="h-8 w-8 rounded-full object-cover"
                         />
                       ) : (
diff --git a/app/devices/[slug]/device-detail-client.tsx b/app/devices/[slug]/device-detail-client.tsx
index fe2fcfa..9b1df0b 100644
--- a/app/devices/[slug]/device-detail-client.tsx
+++ b/app/devices/[slug]/device-detail-client.tsx
@@ -104,8 +104,9 @@ export function DeviceDetailClient({ device }: { device: DeviceInfo }) {
   }
 
   useEffect(() => {
+    // eslint-disable-next-line react-hooks/set-state-in-effect
     fetchStats()
-  }, [device.slug])
+  }, [device.slug]) // eslint-disable-line react-hooks/exhaustive-deps
 
   const historicalOption = useMemo<EChartsOption>(() => {
     if (!stats || stats.historical.length === 0) return {}
diff --git a/app/devices/[slug]/opengraph-image.tsx b/app/devices/[slug]/opengraph-image.tsx
index 4f9c7ba..4504e62 100644
--- a/app/devices/[slug]/opengraph-image.tsx
+++ b/app/devices/[slug]/opengraph-image.tsx
@@ -3,7 +3,7 @@ import { db } from "@/lib/db/index"
 import { hardware, performanceEntries, gameVersions, games } from "@/lib/db/schema"
 import { eq, and, sql } from "drizzle-orm"
 
-export const runtime = "edge"
+export const runtime = "nodejs"
 export const alt = "Device benchmarks on DeckyVault"
 export const size = { width: 1200, height: 630 }
 export const contentType = "image/png"