Add editing messages

src/app/game/berry-dash/chatroom/page.tsx

@@ -26,6 +26,7 @@ interface Message {
   birdColor: BirdColor
   overlayColor: BirdColor
   customIcon: string | null
+  editing: boolean
 }
 
 interface CustomIconEntry {
@@ -178,7 +179,42 @@ export default function BerryDashChatroom () {
                   ></img>
                   <div>
                     <p>{item.username}</p>
-                    <p className='w-240 max-w-[calc(100vw-136px)] truncate select-text'>
+                    <p
+                      className='w-240 max-w-[calc(100vw-136px)] truncate select-text'
+                      contentEditable={item.editing}
+                      onDoubleClick={e => {
+                        if (
+                          Number(getCookie('accountId', '-1')) == item.userId
+                        ) {
+                          setMessages(prev =>
+                            prev.map(msg =>
+                              msg.id === item.id
+                                ? {
+                                    ...msg,
+                                    editing: !item.editing
+                                  }
+                                : msg
+                            )
+                          )
+                          if (item.editing) {
+                            const text = e.currentTarget.textContent
+                            e.currentTarget.textContent = atob(item.content)
+                            ws?.send(
+                              JSON.stringify({
+                                type: 'edit',
+                                kind: 'chatroom_message',
+                                data: {
+                                  id: item.id,
+                                  newContent: text,
+                                  auth: token
+                                },
+                                timestamp: Date.now()
+                              })
+                            )
+                          }
+                        }
+                      }}
+                    >
                       {atob(item.content)}
                     </p>
                   </div>