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/pages/flow/list/create-flow-modal.tsx

@@ -1,8 +1,8 @@
+import { ReactComponent as NothingIcon } from '@/assets/svg/nothing.svg';
 import { IModalManagerChildrenProps } from '@/components/modal-manager';
 import { useTranslate } from '@/hooks/commonHooks';
 import { useFetchFlowTemplates } from '@/hooks/flow-hooks';
 import { useSelectItem } from '@/hooks/logicHooks';
-import { UserOutlined } from '@ant-design/icons';
 import {
   Avatar,
   Card,
@@ -79,7 +79,7 @@ const CreateFlowModal = ({
           <Input />
         </Form.Item>
       </Form>
-      <Title level={5}>Choose from templates</Title>
+      <Title level={5}>Create from templates</Title>
       <Flex vertical gap={16}>
         {list?.map((x) => (
           <Card
@@ -90,7 +90,11 @@ const CreateFlowModal = ({
             onClick={handleItemClick(x.id)}
           >
             <Space size={'middle'}>
-              <Avatar size={40} icon={<UserOutlined />} src={x.avatar} />
+              {x.avatar ? (
+                <Avatar size={40} icon={<NothingIcon />} src={x.avatar} />
+              ) : (
+                <NothingIcon width={40} height={30} />
+              )}
               <b>{x.title}</b>
             </Space>
             <p>{x.description}</p>

web/src/pages/flow/list/hooks.ts

@@ -11,6 +11,8 @@ import { useNavigate } from 'umi';
 // import dslJson from '../../../../../dls.json';
 // import customerServiceBase from '../../../../../graph/test/dsl_examples/customer_service.json';
 // import customerService from '../customer_service.json';
+// import interpreterBase from '../../../../../graph/test/dsl_examples/interpreter.json';
+// import interpreter from '../interpreter.json';
 
 export const useFetchDataOnMount = () => {
   const { data, loading } = useFetchFlowList();
@@ -41,7 +43,7 @@ export const useSaveFlow = () => {
         title,
         dsl,
         // dsl: dslJson,
-        // dsl: { ...customerServiceBase, graph: customerService },
+        // dsl: { ...interpreterBase, graph: interpreter },
       });
 
       if (ret?.retcode === 0) {