feat: click on a blank area of ​​the canvas to hide the form drawer #918

 (#1384)

### What problem does this PR solve?
feat: click on a blank area of ​​the canvas to hide the form drawer #918

### Type of change


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

web/src/pages/flow/canvas/index.tsx

@@ -62,6 +62,10 @@ function FlowCanvas({ chatDrawerVisible, hideChatDrawer }: IProps) {
     [showDrawer],
   );
 
+  const onPaneClick = useCallback(() => {
+    hideDrawer();
+  }, [hideDrawer]);
+
   const { onDrop, onDragOver, setReactFlowInstance } = useHandleDrop();
 
   const { handleKeyUp } = useHandleKeyUp();
@@ -101,6 +105,7 @@ function FlowCanvas({ chatDrawerVisible, hideChatDrawer }: IProps) {
         onDrop={onDrop}
         onDragOver={onDragOver}
         onNodeClick={onNodeClick}
+        onPaneClick={onPaneClick}
         onInit={setReactFlowInstance}
         onKeyUp={handleKeyUp}
         onSelectionChange={onSelectionChange}

web/src/pages/flow/constant.tsx

@@ -203,9 +203,9 @@ export const CategorizeAnchorPointPositions = [
 export const RestrictedUpstreamMap = {
   [Operator.Begin]: [],
   [Operator.Categorize]: [Operator.Begin, Operator.Categorize, Operator.Answer],
-  [Operator.Answer]: [],
-  [Operator.Retrieval]: [],
-  [Operator.Generate]: [],
+  [Operator.Answer]: [Operator.Begin, Operator.Answer, Operator.Message],
+  [Operator.Retrieval]: [Operator.Begin, Operator.Relevant],
+  [Operator.Generate]: [Operator.Begin],
   [Operator.Message]: [
     Operator.Begin,
     Operator.Message,
@@ -214,8 +214,14 @@ export const RestrictedUpstreamMap = {
     Operator.RewriteQuestion,
     Operator.Categorize,
   ],
-  [Operator.Relevant]: [],
-  [Operator.RewriteQuestion]: [],
+  [Operator.Relevant]: [Operator.Begin, Operator.Answer],
+  [Operator.RewriteQuestion]: [
+    Operator.Begin,
+    Operator.Message,
+    Operator.Generate,
+    Operator.RewriteQuestion,
+    Operator.Categorize,
+  ],
 };
 
 export const NodeMap = {

web/src/pages/flow/list/index.less

@@ -56,6 +56,6 @@
 }
 
 .templatesBox {
-  // max-height: 500px;
+  max-height: 70vh;
   overflow: auto;
 }