feat(*): Agent工作流 - 完善审批、分镜协作与资源交互体验

web/src/hooks/use-external-asset-sources.ts

@@ -25,11 +25,35 @@ export type ExternalAssetSourceState = {
 export function useExternalAssetSources(open: boolean): ExternalAssetSourceState {
     const hydrated = usePluginStore((state) => state.hydrated);
     const installations = usePluginStore((state) => state.installations);
-    const sources = useMemo(() => createHostedAssetSources(hydrated ? installations : []), [hydrated, installations]);
+    const needsEagle = open && hydrated && installations.some((installation) => installation.manifest.id === "eagle-asset-connector");
+    const [eagleLoaded, setEagleLoaded] = useState(false);
     const [loadedSources, setLoadedSources] = useState<LoadedAssetSource[]>([]);
     const [loading, setLoading] = useState(false);
     const [error, setError] = useState("");
 
+    useEffect(() => {
+        if (!needsEagle) {
+            setEagleLoaded(true);
+            return;
+        }
+
+        let cancelled = false;
+        setEagleLoaded(false);
+        void import("@/lib/plugins/builtin/eagle")
+            .catch(() => undefined)
+            .finally(() => {
+                if (!cancelled) setEagleLoaded(true);
+            });
+        return () => {
+            cancelled = true;
+        };
+    }, [needsEagle]);
+
+    const sources = useMemo(() => {
+        if (!hydrated || (needsEagle && !eagleLoaded)) return [];
+        return createHostedAssetSources(installations);
+    }, [eagleLoaded, hydrated, installations, needsEagle]);
+
     useEffect(() => {
         const controller = new AbortController();
         if (!open || !sources.length) {