Update src/app/interface/panel/index.tsx

src/app/interface/panel/index.tsx

@@ -259,6 +259,10 @@ export function Panel({
     )
   }
 
+  const hasSucceededOrFailed =
+    rendered.status === "completed" ||
+    rendered.status === "error"
+
   return (
     <div className={cn(
       frameClassName,
@@ -324,14 +328,21 @@ export function Panel({
         className={cn(`relative -mt-14 ml-4`,)}>
           <div className="flex flex-row">
             <div
-              onClick={rendered.status === "completed" ? handleReload : undefined}
+              onClick={
+                hasSucceededOrFailed
+                ? handleReload
+                : undefined}
               className={cn(
                 `bg-stone-100 rounded-lg`,
                 `flex flex-row space-x-2 items-center`,
-                `py-2 px-3 cursor-pointer`,
+                `py-1 px-2 md:py-2 md:px-3`,
                 `transition-all duration-200 ease-in-out`,
-                rendered.status === "completed" ? "opacity-95" : "opacity-50",
-                mouseOver && rendered.assetUrl ? `scale-95 hover:scale-100 hover:opacity-100`: `scale-0`
+                hasSucceededOrFailed
+                ?  "opacity-95 cursor-pointer"
+                : "opacity-50 cursor-wait",
+                mouseOver && (
+                  hasSucceededOrFailed
+                ) ? `scale-95 hover:scale-100 hover:opacity-100`: `scale-0`
               )}>
               <RxReload
                 className="w-5 h-5"