add error state and update loading state in useAction hook (#42)

* add error state and update loading state in useAction

* remove error state

Author: prsvic

packages/blinks-core/src/hooks/useAction.ts

@@ -15,10 +15,12 @@ interface UseActionOptions {
 
 function useActionApiUrl(url: string | URL) {
   const [apiUrl, setApiUrl] = useState<string | null>(null);
+  const [isLoading, setIsLoading] = useState(false);
 
   useEffect(() => {
     let ignore = false;
 
+    setIsLoading(true);
     unfurlUrlToActionApiUrl(new URL(url))
       .then((apiUrl) => {
         if (ignore) {
@@ -31,23 +33,30 @@ function useActionApiUrl(url: string | URL) {
           '[@dialectlabs/blinks-core] Failed to unfurl action URL',
           e,
         );
-        setApiUrl(null);
+        if (!ignore) {
+          setApiUrl(null);
+        }
+      })
+      .finally(() => {
+        if (!ignore) {
+          setIsLoading(false);
+        }
       });
 
     return () => {
       ignore = true;
     };
   }, [url]);
 
-  return { actionApiUrl: apiUrl };
+  return { actionApiUrl: apiUrl, isUrlLoading: isLoading };
 }
 
 export function useAction({
   url,
   supportStrategy = defaultActionSupportStrategy,
 }: UseActionOptions) {
   const { isRegistryLoaded } = useActionsRegistryInterval();
-  const { actionApiUrl } = useActionApiUrl(url);
+  const { actionApiUrl, isUrlLoading } = useActionApiUrl(url);
   const [action, setAction] = useState<Action | null>(null);
   const [isLoading, setIsLoading] = useState(false);
   const [hasFetched, setHasFetched] = useState(false);
@@ -114,5 +123,9 @@ export function useAction({
     // eslint-disable-next-line react-hooks/exhaustive-deps -- only update if supportStrategy changes
   }, [supportStrategy, hasFetched]);
 
-  return { action, isLoading, refresh: fetchAction };
+  return {
+    action,
+    isLoading: !isRegistryLoaded || isUrlLoading || isLoading,
+    refresh: fetchAction,
+  };
 }