Fix conflicts

frontend/src/basic/Main.tsx

@@ -211,12 +211,14 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
   };
 
   useEffect(() => {
-    if (open.profile || (robot.token && robot.nickname === null)) {
-      fetchRobot({ keys: false }); // fetch existing robot
-    } else if (robot.token && robot.encPrivKey && robot.pubKey) {
-      fetchRobot({ keys: true }); // create new robot with existing token and keys (on network and coordinator change)
+    if (baseUrl != '') {
+      if (open.profile || (robot.token && robot.nickname === null)) {
+        fetchRobot({ keys: false }); // fetch existing robot
+      } else if (robot.token && robot.encPrivKey && robot.pubKey) {
+        fetchRobot({ keys: true }); // create new robot with existing token and keys (on network and coordinator change)
+      }
     }
-  }, [open.profile, settings.network, settings.coordinator]);
+  }, [open.profile, baseUrl]);
 
   return (
     <Router basename={basename}>

frontend/src/components/Dialogs/Profile.tsx

@@ -184,6 +184,7 @@ const ProfileDialog = ({
                 avatarClass='profileAvatar'
                 style={{ width: 65, height: 65 }}
                 nickname={robot.nickname}
+                baseUrl={baseUrl}
               />
             </ListItemAvatar>
           </ListItem>

frontend/src/components/TradeBox/EncryptedChat/EncryptedSocketChat/index.tsx

@@ -22,6 +22,7 @@ interface Props {
   takerNick: string;
   messages: EncryptedChatMessage[];
   setMessages: (messages: EncryptedChatMessage[]) => void;
+  baseUrl: string;
 }
 
 const EncryptedSocketChat: React.FC<Props> = ({
@@ -30,6 +31,7 @@ const EncryptedSocketChat: React.FC<Props> = ({
   takerNick,
   messages,
   setMessages,
+  baseUrl,
 }: Props): JSX.Element => {
   const { t } = useTranslation();
   const theme = useTheme();
@@ -38,13 +40,13 @@ const EncryptedSocketChat: React.FC<Props> = ({
   const [connected, setConnected] = useState<boolean>(false);
   const [peerConnected, setPeerConnected] = useState<boolean>(false);
   const [ownPubKey] = useState<string>(
-    (systemClient.getCookie('pub_key') ?? '').split('\\').join('\n'),
+    (systemClient.getItem('pub_key') ?? '').split('\\').join('\n'),
   );
   const [ownEncPrivKey] = useState<string>(
-    (systemClient.getCookie('enc_priv_key') ?? '').split('\\').join('\n'),
+    (systemClient.getItem('enc_priv_key') ?? '').split('\\').join('\n'),
   );
   const [peerPubKey, setPeerPubKey] = useState<string>();
-  const [token] = useState<string>(systemClient.getCookie('robot_token') || '');
+  const [token] = useState<string>(systemClient.getItem('robot_token') || '');
   const [serverMessages, setServerMessages] = useState<ServerMessage[]>([]);
   const [value, setValue] = useState<string>('');
   const [connection, setConnection] = useState<WebsocketConnection>();
@@ -231,7 +233,12 @@ const EncryptedSocketChat: React.FC<Props> = ({
 
             return (
               <li style={{ listStyleType: 'none' }} key={index}>
-                <MessageCard message={message} isTaker={isTaker} userConnected={userConnected} />
+                <MessageCard
+                  message={message}
+                  isTaker={isTaker}
+                  userConnected={userConnected}
+                  baseUrl={baseUrl}
+                />
               </li>
             );
           })}

frontend/src/components/TradeBox/EncryptedChat/EncryptedTurtleChat/index.tsx

@@ -1,16 +1,13 @@
 import React, { useEffect, useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { Button, Tooltip, TextField, Grid, Container, Paper, Typography } from '@mui/material';
+import { Button, TextField, Grid, Container, Paper } from '@mui/material';
 import { encryptMessage, decryptMessage } from '../../../../pgp';
-import { saveAsJson } from '../../../../utils';
 import { AuditPGPDialog } from '../../../Dialogs';
 import { systemClient } from '../../../../services/System';
-import { websocketClient, WebsocketConnection } from '../../../../services/Websocket';
 
 // Icons
 import CircularProgress from '@mui/material/CircularProgress';
 import KeyIcon from '@mui/icons-material/Key';
-import { ExportIcon } from '../../../Icons';
 import { useTheme } from '@mui/system';
 import MessageCard from '../MessageCard';
 import ChatHeader from '../ChatHeader';
@@ -43,13 +40,13 @@ const EncryptedTurtleChat: React.FC<Props> = ({
   const audio = new Audio(`/static/assets/sounds/chat-open.mp3`);
   const [peerConnected, setPeerConnected] = useState<boolean>(false);
   const [ownPubKey] = useState<string>(
-    (systemClient.getCookie('pub_key') ?? '').split('\\').join('\n'),
+    (systemClient.getItem('pub_key') ?? '').split('\\').join('\n'),
   );
   const [ownEncPrivKey] = useState<string>(
-    (systemClient.getCookie('enc_priv_key') ?? '').split('\\').join('\n'),
+    (systemClient.getItem('enc_priv_key') ?? '').split('\\').join('\n'),
   );
   const [peerPubKey, setPeerPubKey] = useState<string>();
-  const [token] = useState<string>(systemClient.getCookie('robot_token') || '');
+  const [token] = useState<string>(systemClient.getItem('robot_token') || '');
   const [value, setValue] = useState<string>('');
   const [audit, setAudit] = useState<boolean>(false);
   const [waitingEcho, setWaitingEcho] = useState<boolean>(false);
@@ -170,7 +167,7 @@ const EncryptedTurtleChat: React.FC<Props> = ({
     // If input string contains '#' send unencrypted and unlogged message
     else if (value.substring(0, 1) == '#') {
       apiClient
-        .post(`/api/chat`, {
+        .post(baseUrl, `/api/chat`, {
           PGP_message: value,
         })
         .then((response) => {
@@ -188,7 +185,7 @@ const EncryptedTurtleChat: React.FC<Props> = ({
       encryptMessage(value, ownPubKey, peerPubKey, ownEncPrivKey, token).then(
         (encryptedMessage) => {
           apiClient
-            .post(`/api/chat/`, {
+            .post(baseUrl, `/api/chat/`, {
               PGP_message: encryptedMessage.toString().split('\n').join('\\'),
               order_id: orderId,
             })
@@ -225,7 +222,12 @@ const EncryptedTurtleChat: React.FC<Props> = ({
 
             return (
               <li style={{ listStyleType: 'none' }} key={index}>
-                <MessageCard message={message} isTaker={isTaker} userConnected={userConnected} />
+                <MessageCard
+                  message={message}
+                  isTaker={isTaker}
+                  userConnected={userConnected}
+                  baseUrl={baseUrl}
+                />
               </li>
             );
           })}

frontend/src/components/TradeBox/EncryptedChat/MessageCard/index.tsx

@@ -15,9 +15,10 @@ interface Props {
   message: EncryptedChatMessage;
   isTaker: boolean;
   userConnected: boolean;
+  baseUrl: string;
 }
 
-const MessageCard: React.FC<Props> = ({ message, isTaker, userConnected }) => {
+const MessageCard: React.FC<Props> = ({ message, isTaker, userConnected, baseUrl }) => {
   const [showPGP, setShowPGP] = useState<boolean>();
   const { t } = useTranslation();
   const theme = useTheme();
@@ -34,6 +35,7 @@ const MessageCard: React.FC<Props> = ({ message, isTaker, userConnected }) => {
           <RobotAvatar
             statusColor={userConnected ? 'success' : 'error'}
             nickname={message.userNick}
+            baseUrl={baseUrl}
           />
         }
         style={{ backgroundColor: cardColor }}

frontend/src/components/TradeBox/EncryptedChat/index.tsx

@@ -55,6 +55,7 @@ const EncryptedChat: React.FC<Props> = ({
       orderId={orderId}
       takerNick={takerNick}
       userNick={userNick}
+      baseUrl={baseUrl}
     />
   );
 };

frontend/src/components/TradeBox/index.js

@@ -38,7 +38,6 @@ import { apiClient } from '../../services/api';
 
 // Icons
 import PercentIcon from '@mui/icons-material/Percent';
-import SelfImprovement from '@mui/icons-material/SelfImprovement';
 import BookIcon from '@mui/icons-material/Book';
 import LockIcon from '@mui/icons-material/Lock';
 import LockOpenIcon from '@mui/icons-material/LockOpen';
@@ -1435,14 +1434,7 @@ class TradeBox extends Component {
         {/* Make confirmation sound for Chat Open. */}
         {this.Sound('locked-invoice')}
         <Grid item xs={12} align='center'>
-          <Typography variant='subtitle1'>
-            <b>
-              {' '}
-              {this.props.data.is_seller ? t('Chat with the buyer') : t('Chat with the seller')}
-            </b>{' '}
-            {' ' + this.stepXofY()}
-          </Typography>
-          <Grid item>
+          <div style={{ position: 'fixed', right: '-4em', top: '2.5em' }}>
             <Tooltip
               enterTouchDelay={0}
               placement='top'
@@ -1464,7 +1456,14 @@ class TradeBox extends Component {
                 <WifiTetheringErrorIcon sx={{ color: 'text.secondary' }} />
               </div>
             </Tooltip>
-          </Grid>
+          </div>
+          <Typography variant='subtitle1'>
+            <b>
+              {' '}
+              {this.props.data.is_seller ? t('Chat with the buyer') : t('Chat with the seller')}
+            </b>{' '}
+            {' ' + this.stepXofY()}
+          </Typography>
         </Grid>
         <Grid item xs={12} align='center'>
           {this.props.data.is_seller ? (