fix: blocks should not be displayed after templates are removed

packages/core/client/src/schema-component/antd/card-item/CardItem.tsx

@@ -1,9 +1,14 @@
+import { useFieldSchema } from '@formily/react';
 import { Card } from 'antd';
 import React from 'react';
+import { useSchemaTemplate } from '../../../schema-templates';
 import { BlockItem } from '../block-item';
 
 export const CardItem: React.FC = (props) => {
-  return (
+  const template = useSchemaTemplate();
+  const fieldSchema = useFieldSchema();
+  const templateKey = fieldSchema['x-template-key'];
+  return templateKey && !template ? null : (
     <BlockItem className={'noco-card-item'}>
       <Card style={{ marginBottom: 24 }} bordered={false} {...props}>
         {props.children}

packages/core/client/src/schema-templates/BlockTemplate.tsx

@@ -1,5 +1,6 @@
 import { observer, useField, useFieldSchema } from '@formily/react';
 import React, { createContext, useContext, useMemo } from 'react';
+import { useTranslation } from 'react-i18next';
 import { RemoteSchemaComponent, useDesignable } from '..';
 import { useSchemaTemplateManager } from './SchemaTemplateManagerProvider';
 
@@ -15,12 +16,13 @@ export const BlockTemplate = observer((props: any) => {
   const field = useField();
   const fieldSchema = useFieldSchema();
   const { dn } = useDesignable();
+  const { t } = useTranslation();
   const template = useMemo(() => getTemplateById(templateId), [templateId]);
-  return (
+  return template ? (
     <div>
       <BlockTemplateContext.Provider value={{ dn, field, fieldSchema, template }}>
         <RemoteSchemaComponent noForm uid={template?.uid} />
       </BlockTemplateContext.Provider>
     </div>
-  );
+  ) : null;
 });

packages/core/client/src/schema-templates/schemas/uiSchemaTemplates.ts

@@ -1,6 +1,6 @@
 import { ISchema } from '@formily/react';
 import { uid } from '@formily/shared';
-import { useUpdateActionProps } from '../../block-provider/hooks';
+import { useBulkDestroyActionProps, useDestroyActionProps, useUpdateActionProps } from '../../block-provider/hooks';
 import { useSchemaTemplateManager } from '../SchemaTemplateManagerProvider';
 
 const useUpdateSchemaTemplateActionProps = () => {
@@ -10,9 +10,31 @@ const useUpdateSchemaTemplateActionProps = () => {
     async onClick() {
       await props.onClick();
       refresh();
-    }
-  }
-}
+    },
+  };
+};
+
+const useBulkDestroyTemplateProps = () => {
+  const props = useBulkDestroyActionProps();
+  const { refresh } = useSchemaTemplateManager();
+  return {
+    async onClick() {
+      await props.onClick();
+      refresh();
+    },
+  };
+};
+
+const useDestroyTemplateProps = () => {
+  const props = useDestroyActionProps();
+  const { refresh } = useSchemaTemplateManager();
+  return {
+    async onClick() {
+      await props.onClick();
+      refresh();
+    },
+  };
+};
 
 export const uiSchemaTemplatesSchema: ISchema = {
   type: 'object',
@@ -55,7 +77,7 @@ export const uiSchemaTemplatesSchema: ISchema = {
                   title: "{{t('Delete record')}}",
                   content: "{{t('Are you sure you want to delete it?')}}",
                 },
-                useProps: '{{ useBulkDestroyActionProps }}',
+                useProps: useBulkDestroyTemplateProps,
               },
             },
           },
@@ -175,7 +197,7 @@ export const uiSchemaTemplatesSchema: ISchema = {
                           title: "{{t('Delete record')}}",
                           content: "{{t('Are you sure you want to delete it?')}}",
                         },
-                        useProps: '{{ useDestroyActionProps }}',
+                        useProps: useDestroyTemplateProps,
                       },
                     },
                   },