feat(legacy): update state when the character name is updated

mythal · Aug 30, 2024 · 725df27 · 725df27
1 parent d1b092c
commit 725df27
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 6 deletions.
diff --git a/apps/legacy/src/components/chat/ChannelMemberButton.tsx b/apps/legacy/src/components/chat/ChannelMemberButton.tsx
@@ -10,7 +10,7 @@ import doorOpen from '../../assets/icons/door-open.svg';
 import editIcon from '../../assets/icons/edit.svg';
 import ninja from '../../assets/icons/ninja.svg';
 import { useChannelId } from '../../hooks/useChannelId';
-import { useDispatch, useSelector } from '../../store';
+import store, { useDispatch, useSelector } from '../../store';
 import { alignRight, mL, mR, mT } from '../../styles/atoms';
 import { recordNext } from '../../utils/browser';
 import { throwErr } from '../../utils/errors';
@@ -94,6 +94,7 @@ function ChannelMemberButton({ className }: Props) {
   );
   const member = useSelector((state) => state.profile?.channels.get(channelId)?.member);
   const nickname = user?.nickname;
+  const dispatch = useDispatch();
   const name = chatName(member?.characterName, nickname);
   const buttonRef = useRef<HTMLButtonElement | null>(null);
   const [menu, setMenu] = useState(false);
@@ -123,8 +124,14 @@ function ChannelMemberButton({ className }: Props) {
     setLeaveConfirmDialog(false);
     setDialog(false);
   };
-  const onSubmitEdit = ({ characterName }: FormData) => {
-    edit(characterName).then(dismissDialog);
+  const onSubmitEdit = async ({ characterName }: FormData) => {
+    await edit(characterName);
+    const oldCharacterName = member?.characterName;
+    const inputName = store.getState().chatStates.get(channelId)?.compose.inputName;
+    if (inputName && oldCharacterName && inputName === oldCharacterName) {
+      dispatch({ type: 'SET_INPUT_NAME', name: '', pane: channelId });
+    }
+    dismissDialog();
   };
 
   const characterNameField = (

diff --git a/apps/legacy/src/reducers/chatState.ts b/apps/legacy/src/reducers/chatState.ts
@@ -283,7 +283,12 @@ const handleSetWhisperTo = (state: ChatState, { whisperTo }: SetWhisperTo): Chat
   return { ...state, compose: { ...state.compose, whisperTo } };
 };
 
-const handleChatInitialized = (myId: Id, channelId: Id, itemSet: ChatItemSet): Compose => {
+const handleChatInitialized = (
+  myId: Id,
+  channelId: Id,
+  itemSet: ChatItemSet,
+  myMember: Member | undefined,
+): Compose => {
   const item = itemSet.previews.get(myId);
   const compose: Compose = {
     messageId: newId(),
@@ -312,7 +317,7 @@ const handleChatInitialized = (myId: Id, channelId: Id, itemSet: ChatItemSet): C
   }
   compose.source = preview.text;
   compose.inGame = preview.inGame;
-  if (compose.inGame && preview.name) {
+  if (compose.inGame && preview.name && myMember && preview.name !== myMember.channel.characterName) {
     compose.inputName = preview.name;
   }
   return compose;
@@ -401,7 +406,8 @@ const handleChannelEvent = (chat: ChatState, event: Events, myId: Id | undefined
       if (!initialized) {
         initialized = true;
         if (myId) {
-          compose = handleChatInitialized(myId, channel.id, itemSet);
+          const myMember = members.find((member) => member.channel.userId === myId);
+          compose = handleChatInitialized(myId, channel.id, itemSet, myMember);
         }
       }
       break;