feat: create blank canvas #918 (#1356)

### What problem does this PR solve?

feat: create blank canvas #918

### Type of change


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

web/src/hooks/flow-hooks.ts

@@ -5,6 +5,44 @@ import flowService from '@/services/flow-service';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { message } from 'antd';
 import { useParams } from 'umi';
+import { v4 as uuid } from 'uuid';
+
+export const EmptyDsl = {
+  graph: {
+    nodes: [
+      {
+        id: 'Begin',
+        type: 'beginNode',
+        position: {
+          x: 50,
+          y: 200,
+        },
+        data: {
+          label: 'Begin',
+          name: 'begin',
+        },
+        sourcePosition: 'left',
+        targetPosition: 'right',
+      },
+    ],
+    edges: [],
+  },
+  components: {
+    begin: {
+      obj: {
+        component_name: 'Begin',
+        params: {},
+      },
+      downstream: ['Answer:China'], // other edge target is downstream, edge source is current node id
+      upstream: [], // edge source is upstream, edge target is current node id
+    },
+  },
+  messages: [],
+  reference: [],
+  history: [],
+  path: [],
+  answer: [],
+};
 
 export const useFetchFlowTemplates = (): ResponseType<IFlowTemplate[]> => {
   const { data } = useQuery({
@@ -12,6 +50,14 @@ export const useFetchFlowTemplates = (): ResponseType<IFlowTemplate[]> => {
     initialData: [],
     queryFn: async () => {
       const { data } = await flowService.listTemplates();
+      if (Array.isArray(data?.data)) {
+        data.data.unshift({
+          id: uuid(),
+          title: 'Blank',
+          description: 'Create from nothing',
+          dsl: EmptyDsl,
+        });
+      }
 
       return data;
     },