Feat: Render agent details #3221 (#5307)

### What problem does this PR solve?

Feat: Render agent details #3221
### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/agent/hooks/use-fetch-data.ts

@@ -0,0 +1,19 @@
+import { useFetchFlow } from '@/hooks/flow-hooks';
+import { IGraph } from '@/interfaces/database/flow';
+import { useEffect } from 'react';
+import { useSetGraphInfo } from './use-set-graph';
+
+export const useFetchDataOnMount = () => {
+  const { loading, data, refetch } = useFetchFlow();
+  const setGraphInfo = useSetGraphInfo();
+
+  useEffect(() => {
+    setGraphInfo(data?.dsl?.graph ?? ({} as IGraph));
+  }, [setGraphInfo, data]);
+
+  useEffect(() => {
+    refetch();
+  }, [refetch]);
+
+  return { loading, flowDetail: data };
+};