Add behavior can filter by name

source/Behavior/Behavior.ts

@@ -4,7 +4,52 @@ import { Template } from "./Template";
 const AllBehaviors: IAnyBehaviorRecorder[] = new Array(4).fill(0).map((_, i) => {
     let behavior = new BehaviorRecorder(Template);
     behavior.behaviorId = behavior.behaviorId + i;
+    behavior.behaviorName = behavior.behaviorName + Math.random().toString(36).slice(-6);
+    behavior.category = "Category" + Math.floor(Math.random() * 3).toString();
     return behavior;
 });
 
-export { AllBehaviors };
+/**
+ * 分类词条
+ */
+type ICategory = {key: string, category: Record<string, string>, item: IAnyBehaviorRecorder[]};
+
+const AllBehaviorsWithCategory: ICategory[] = categoryBehaviors(AllBehaviors);
+
+/**
+ * 将词条进行分类
+ */
+function categoryBehaviors(behaviors: IAnyBehaviorRecorder[]): ICategory[] {
+    let res: ICategory[] = [];
+    for (let i = 0; i < behaviors.length; i++) {
+
+        let category: ICategory | undefined = undefined;
+        for (let j = 0; j < res.length; j++) {
+            if (res[j].key === behaviors[i].category) {
+                category = res[j];
+            }
+        }
+
+        if (!category) {
+            category = {
+                key: behaviors[i].category,
+                category: {},
+                item: []
+            }
+            res.push(category);
+        }
+
+        if (behaviors[i].category[0] === "$") {
+            let terms = behaviors[i].terms[behaviors[i].category];
+            if (terms) {
+                category.category = {...category.category, ...terms}
+            }
+        }
+        
+        category.item.push(behaviors[i]);
+    }
+
+    return res;
+}
+
+export { AllBehaviors, AllBehaviorsWithCategory, ICategory as ICategoryBehavior };

source/Component/BehaviorPopup/BehaviorPopup.tsx

@@ -1,10 +1,10 @@
-import { Component, ReactNode } from "react";
+import { Component, ReactNode, Fragment } from "react";
 import { Popup } from "@Context/Popups";
-import { Localization, I18N } from "@Component/Localization/Localization";
+import { Localization } from "@Component/Localization/Localization";
 import { SearchBox } from "@Component/SearchBox/SearchBox";
 import { ConfirmContent } from "@Component/ConfirmPopup/ConfirmPopup";
 import { BehaviorList } from "@Component/BehaviorList/BehaviorList";
-import { AllBehaviors } from "@Behavior/Behavior";
+import { AllBehaviorsWithCategory, ICategoryBehavior } from "@Behavior/Behavior";
 import { Message } from "@Component/Message/Message";
 import { IRenderBehavior } from "@Model/Behavior";
 import { useStatus, IMixinStatusProps } from "@Context/Status";
@@ -90,21 +90,28 @@ class BehaviorPopupComponent extends Component<
 		/>
 	}
 
-	public render(): ReactNode {
-		return <ConfirmContent
-			className="behavior-popup"
-			actions={[{
-				i18nKey: "Popup.Add.Behavior.Action.Add",
-				disable: this.state.focusBehavior.size <= 0
-			}]}
-			header={this.renderHeader}
-			customFooter={this.renderActionBar}
-			headerHeight={46}
-		>
-			<Message i18nKey="ZH_CN" isTitle first/>
+    private renderBehaviors = (behaviors: ICategoryBehavior, first: boolean) => {
+
+        let language = this.props.setting?.language ?? "EN_US";
+        let filterItem = behaviors.item.filter((item) => {
+            let name = item.getTerms(item.behaviorName, this.props.setting?.language);
+            if (this.state.searchValue) {
+                return name.includes(this.state.searchValue);
+            } else {
+                return true;
+            }
+        })
+        
+        if (filterItem.length <= 0) return undefined;
+
+        return <Fragment key={behaviors.key}>
+            <Message
+                text={behaviors.category[language] ?? behaviors.key}
+                first={first} isTitle
+            />
 			<BehaviorList
 				focusBehaviors={Array.from(this.state.focusBehavior)}
-				behaviors={AllBehaviors}
+				behaviors={filterItem}
 				action={this.showBehaviorInfo}
 				click={(behavior) => {
 					if (this.state.focusBehavior.has(behavior)) {
@@ -115,6 +122,28 @@ class BehaviorPopupComponent extends Component<
 					this.forceUpdate();
 				}}
 			/>
+        </Fragment>
+    }
+
+	public render(): ReactNode {
+        let first: boolean = true;
+		return <ConfirmContent
+			className="behavior-popup"
+			actions={[{
+				i18nKey: "Popup.Add.Behavior.Action.Add",
+				disable: this.state.focusBehavior.size <= 0
+			}]}
+			header={this.renderHeader}
+			customFooter={this.renderActionBar}
+			headerHeight={46}
+		>
+            {AllBehaviorsWithCategory.map((behavior) => {
+                let renderItem = this.renderBehaviors(behavior, first);
+                if (renderItem) {
+                    first = false;
+                }
+                return renderItem;
+            }).filter((x) => !!x)}
 		</ConfirmContent>
 	}
 }

source/Model/Behavior.ts

@@ -159,6 +159,11 @@ class BehaviorInfo<E extends Record<EventType, any> = {}> extends Emitter<E> {
      */
     public describe: string = "";
 
+    /**
+     * 类别
+     */
+    public category: string = "";
+
     /**
      * 提条列表
      */