From be17136666ac2b2485a618dab4965f204c0a2ce2 Mon Sep 17 00:00:00 2001
From: MrWindlike <MrWindlike@gmail.com>
Date: Thu, 20 Jan 2022 15:49:14 +0800
Subject: [PATCH] fix(editor): fix can't create multiple events

Refs: #218
---
 .../EventTraitForm/EventTraitForm.tsx         | 31 ++++++++++---------
 1 file changed, 17 insertions(+), 14 deletions(-)

diff --git a/packages/editor/src/components/ComponentForm/EventTraitForm/EventTraitForm.tsx b/packages/editor/src/components/ComponentForm/EventTraitForm/EventTraitForm.tsx
index ffcaf681..6f7be2dc 100644
--- a/packages/editor/src/components/ComponentForm/EventTraitForm/EventTraitForm.tsx
+++ b/packages/editor/src/components/ComponentForm/EventTraitForm/EventTraitForm.tsx
@@ -36,13 +36,13 @@ export const EventTraitForm: React.FC<Props> = props => {
       componentId: '',
       method: {
         name: '',
-        parameters: {},
+        parameters: {}
       },
       disabled: false,
       wait: {
         type: 'delay',
-        time: 0,
-      },
+        time: 0
+      }
     };
 
     if (!handlers) {
@@ -51,7 +51,7 @@ export const EventTraitForm: React.FC<Props> = props => {
         genOperation('createTrait', {
           componentId: component.id,
           traitType: 'core/v1/event',
-          properties: { handlers: [newHandler] },
+          properties: { handlers: [newHandler] }
         })
       );
     } else {
@@ -62,7 +62,7 @@ export const EventTraitForm: React.FC<Props> = props => {
         genOperation('modifyTraitProperty', {
           componentId: component.id,
           traitIndex: index,
-          properties: [...handlers, newHandler],
+          properties: { handlers: [...handlers, newHandler] }
         })
       );
     }
@@ -81,8 +81,8 @@ export const EventTraitForm: React.FC<Props> = props => {
             componentId: component.id,
             traitIndex: index,
             properties: {
-              handlers: newHanlders,
-            },
+              handlers: newHanlders
+            }
           })
         );
       };
@@ -98,16 +98,16 @@ export const EventTraitForm: React.FC<Props> = props => {
             componentId: component.id,
             traitIndex: index,
             properties: {
-              handlers: newHanlders,
-            },
+              handlers: newHanlders
+            }
           })
         );
       };
       return (
         <EventHandlerForm
-          key={i}
-          handler={h}
           eventTypes={eventTypes}
+          handler={h}
+          key={i}
           onChange={onChange}
           onRemove={onRemove}
           registry={registry}
@@ -117,15 +117,18 @@ export const EventTraitForm: React.FC<Props> = props => {
 
   return (
     <VStack width="full">
-      <HStack width="full" justify="space-between">
+      <HStack
+        justify="space-between"
+        width="full"
+      >
         <strong>Events</strong>
         <IconButton
           aria-label="add event"
-          size="sm"
-          variant="ghost"
           colorScheme="blue"
           icon={<AddIcon />}
           onClick={onClickAddHandler}
+          size="sm"
+          variant="ghost"
         />
       </HStack>
       <VStack width="full">{handlerForms()}</VStack>