runfix: do not overwrite service id when opening the service details (#17405)

* runfix: do not overwrite service id when opening the service details

* refactor: open the right sidebar

* runfix: is add mode

* runfix: add missing default value

Author: PatrykBuniX

src/script/components/Conversation/Conversation.tsx

@@ -254,11 +254,7 @@ export const Conversation = ({
 
     const serviceEntity = userEntity.isService && (await repositories.integration.getServiceFromUser(userEntity));
 
-    if (serviceEntity) {
-      openRightSidebar(panelId, {entity: {...serviceEntity, id: userEntity.id}}, true);
-    } else {
-      openRightSidebar(panelId, {entity: userEntity}, true);
-    }
+    openRightSidebar(panelId, {entity: serviceEntity || userEntity}, true);
   };
 
   const showParticipants = (participants: User[]) => {

src/script/page/RightSidebar/RightSidebar.tsx

@@ -114,7 +114,6 @@ const RightSidebar: FC<RightSidebarProps> = ({
   const conversationState = container.resolve(ConversationState);
   const {activeConversation} = useKoSubscribableChildren(conversationState, ['activeConversation']);
 
-  const [isAddMode, setIsAddMode] = useState<boolean>(false);
   const [animatePanelToLeft, setAnimatePanelToLeft] = useState<boolean>(true);
 
   const {rightSidebar} = useAppMainState.getState();
@@ -130,10 +129,9 @@ const RightSidebar: FC<RightSidebarProps> = ({
 
   const closePanel = () => rightSidebar.close();
 
-  const togglePanel = (newState: PanelState, entity: PanelEntity | null, addMode: boolean = false) => {
+  const togglePanel = (newState: PanelState, entity: PanelEntity | null, isAddMode: boolean = false) => {
     setAnimatePanelToLeft(true);
-    rightSidebar.goTo(newState, {entity});
-    setIsAddMode(addMode);
+    rightSidebar.goTo(newState, {entity, isAddMode});
   };
 
   const onBackClick = (entity: PanelEntity | null = activeConversation || null) => {
@@ -285,7 +283,7 @@ const RightSidebar: FC<RightSidebarProps> = ({
               onClose={closePanel}
               serviceEntity={serviceEntity}
               selfUser={selfUser}
-              isAddMode={isAddMode}
+              isAddMode={rightSidebar.isAddMode}
             />
           )}
 

src/script/page/state.ts

@@ -33,6 +33,7 @@ type RightSidebarParams = {
   entity: PanelEntity | null;
   showReactions?: boolean;
   highlighted?: User[];
+  isAddMode?: boolean;
 };
 
 type AppMainState = {
@@ -49,6 +50,7 @@ type AppMainState = {
     highlightedUsers: RightSidebarParams['highlighted'];
     history: PanelState[];
     showReactions: RightSidebarParams['showReactions'];
+    isAddMode: RightSidebarParams['isAddMode'];
     lastViewedMessageDetailsEntity: Message | null;
     updateEntity: (entity: RightSidebarParams['entity']) => void;
   };
@@ -99,6 +101,7 @@ const useAppMainState = create<AppMainState>((set, get) => ({
             highlightedUsers: params?.highlighted || [],
             history: [...replacedNewState, panel],
             showReactions: !!params?.showReactions,
+            isAddMode: !!params?.isAddMode,
           },
         };
       });
@@ -111,6 +114,7 @@ const useAppMainState = create<AppMainState>((set, get) => ({
     highlightedUsers: [],
     history: [],
     showReactions: false,
+    isAddMode: false,
     updateEntity: (entity: RightSidebarParams['entity']) =>
       set(state => ({...state, rightSidebar: {...state.rightSidebar, entity}})),
   },