Refactor icon loading state in AIAction components

Introduced IconWithLoading component to handle icon rendering with loading state for both Button and link variants in AIActionWrapper. Also reset copied and loading states in CopyMarkdown cleanup. This improves code reuse and UI consistency for loading indicators.

Author: nolannbiron

.changeset/great-baboons-smell.md

@@ -0,0 +1,5 @@
+---
+'gitbook': patch
+---
+
+Refactor icon loading state in AIAction components

packages/gitbook/src/components/AIActions/AIActions.tsx

@@ -107,6 +107,9 @@ export function CopyMarkdown(props: {
             if (timeoutRef.current) {
                 clearTimeout(timeoutRef.current);
             }
+
+            setCopied(false);
+            setLoading(false);
         };
     }, []);
 
@@ -239,21 +242,24 @@ function AIActionWrapper(props: {
             href={href}
             target="_blank"
             onClick={onClick}
-            disabled={disabled}
+            disabled={disabled || loading}
         >
-            {icon ? (
-                <div className="flex size-5 items-center justify-center text-tint">
-                    {typeof icon === 'string' ? (
+            <div className="flex size-5 items-center justify-center text-tint">
+                {loading ? (
+                    <Icon icon="spinner-third" className="size-4 animate-spin" />
+                ) : icon ? (
+                    typeof icon === 'string' ? (
                         <Icon
                             icon={icon as IconName}
                             iconStyle={IconStyle.Regular}
                             className="size-4 fill-transparent stroke-current"
                         />
                     ) : (
                         icon
-                    )}
-                </div>
-            ) : null}
+                    )
+                ) : null}
+            </div>
+
             <div className="flex flex-1 flex-col gap-0.5">
                 <span className="flex items-center gap-2 text-tint-strong">
                     <span className="truncate font-medium text-sm">{label}</span>