From d6609e991ec00df83a48f7a8dc470967be8db4ba Mon Sep 17 00:00:00 2001
From: koalasat <koalasat@satstralia.com>
Date: Sun, 11 May 2025 15:15:28 +0200
Subject: [PATCH] Fix others

---
 frontend/src/basic/BookPage/index.tsx         |  10 +-
 frontend/src/basic/Main.tsx                   |   6 +-
 frontend/src/basic/RobotPage/RobotProfile.tsx |   6 -
 frontend/src/basic/RobotPage/index.tsx        |   2 +-
 frontend/src/basic/SettingsPage/index.tsx     |   8 +-
 frontend/src/components/BookTable/index.tsx   |  99 +----
 .../components/Charts/DepthChart/index.tsx    |   9 +-
 .../MakerForm/SelectCoordinator.tsx           |   5 +-
 .../src/components/SettingsForm/index.tsx     | 411 +++++++++---------
 frontend/static/locales/ca.json               |   2 -
 frontend/static/locales/cs.json               |   2 -
 frontend/static/locales/de.json               |   2 -
 frontend/static/locales/en.json               |   2 -
 frontend/static/locales/es.json               |   2 -
 frontend/static/locales/eu.json               |   2 -
 frontend/static/locales/fr.json               |   2 -
 frontend/static/locales/it.json               |   2 -
 frontend/static/locales/ja.json               |   2 -
 frontend/static/locales/pl.json               |   2 -
 frontend/static/locales/pt.json               |   2 -
 frontend/static/locales/ru.json               |   2 -
 frontend/static/locales/sv.json               |   2 -
 frontend/static/locales/sw.json               |   2 -
 frontend/static/locales/th.json               |   2 -
 frontend/static/locales/zh-SI.json            |   2 -
 frontend/static/locales/zh-TR.json            |   2 -
 26 files changed, 233 insertions(+), 357 deletions(-)

diff --git a/frontend/src/basic/BookPage/index.tsx b/frontend/src/basic/BookPage/index.tsx
index 6e8218f4..c0f85147 100644
--- a/frontend/src/basic/BookPage/index.tsx
+++ b/frontend/src/basic/BookPage/index.tsx
@@ -26,8 +26,8 @@ const BookPage = (): React.JSX.Element => {
 
   const doubleView = windowSize.width > 100;
   const width = windowSize.width * 0.85;
-  const maxBookTableWidth = width * 0.7;
-  const chartWidthEm = width * 0.25;
+  const maxBookTableWidth = width * 0.65;
+  const chartWidthEm = width * 0.3;
   const fontSize = theme.typography.fontSize;
 
   const onOrderClicked = function (id: number, shortAlias: string): void {
@@ -134,19 +134,19 @@ const BookPage = (): React.JSX.Element => {
         ) : view === 'depth' ? (
           <DepthChart
             maxWidth={windowSize.width * 0.8} // EM units
-            maxHeight={windowSize.height * 0.75} // EM units
+            maxHeight={windowSize.height * 0.72} // EM units
             onOrderClicked={onOrderClicked}
           />
         ) : view === 'map' ? (
           <MapChart
             maxWidth={windowSize.width * 0.8} // M units
-            maxHeight={windowSize.height * 0.75} // EM units
+            maxHeight={windowSize.height * 0.72} // EM units
             onOrderClicked={onOrderClicked}
           />
         ) : (
           <BookTable
             maxWidth={windowSize.width * 0.8} // EM units
-            maxHeight={windowSize.height * 0.75} // EM units
+            maxHeight={windowSize.height * 0.72} // EM units
             fullWidth={windowSize.width} // EM units
             fullHeight={windowSize.height} // EM units
             defaultFullscreen={false}
diff --git a/frontend/src/basic/Main.tsx b/frontend/src/basic/Main.tsx
index 90ba9e5e..6e925fae 100644
--- a/frontend/src/basic/Main.tsx
+++ b/frontend/src/basic/Main.tsx
@@ -4,7 +4,6 @@ import { Box, Typography, styled } from '@mui/material';
 import { type UseAppStoreType, AppContext, closeAll } from '../contexts/AppContext';
 
 import { NavBar, MainDialogs } from './';
-import RobotAvatar from '../components/RobotAvatar';
 import Notifications from '../components/Notifications';
 
 import { useTranslation } from 'react-i18next';
@@ -44,13 +43,12 @@ const MainBox = styled(Box)<MainBoxProps>((props) => ({
 
 const Main: React.FC = () => {
   const { t } = useTranslation();
-  const { settings, page, setOpen, windowSize, navbarHeight } =
+  const { settings, page, setOpen, windowSize, navbarHeight, client } =
     useContext<UseAppStoreType>(AppContext);
   const { garage } = useContext<UseGarageStoreType>(GarageContext);
 
   return (
     <Router>
-      <RobotAvatar style={{ display: 'none' }} hashId={garage.getSlot()?.hashId} />
       <Notifications
         page={page}
         openProfile={() => {
@@ -67,7 +65,7 @@ const Main: React.FC = () => {
         <></>
       )}
 
-      <MainBox navbarHeight={navbarHeight}>
+      <MainBox navbarHeight={navbarHeight} style={{ paddingTop: client === 'mobile' ? '25px' : 0 }}>
         <Routes />
       </MainBox>
       <NavBar />
diff --git a/frontend/src/basic/RobotPage/RobotProfile.tsx b/frontend/src/basic/RobotPage/RobotProfile.tsx
index c53af9e7..f836d2e1 100644
--- a/frontend/src/basic/RobotPage/RobotProfile.tsx
+++ b/frontend/src/basic/RobotPage/RobotProfile.tsx
@@ -191,12 +191,6 @@ const RobotProfile = ({
                       'Reusing trading identity degrades your privacy against other users, coordinators and observers.',
                     )}
                   </Grid>
-                  <Grid item sx={{ position: 'relative', right: '1em' }}>
-                    <Button color='success' size='small' onClick={handleAddRobot}>
-                      <Add />
-                      {t('Add a new Robot')}
-                    </Button>
-                  </Grid>
                 </Grid>
               </Alert>
             </Grid>
diff --git a/frontend/src/basic/RobotPage/index.tsx b/frontend/src/basic/RobotPage/index.tsx
index 7b19752f..033f811c 100644
--- a/frontend/src/basic/RobotPage/index.tsx
+++ b/frontend/src/basic/RobotPage/index.tsx
@@ -70,7 +70,7 @@ const RobotPage = (): React.JSX.Element => {
                 </linearGradient>
               </svg>
               <CircularProgress thickness={3} style={{ width: '11.2em', height: '11.2em' }} />
-              <Box sx={{ position: 'fixed', top: '4.6em' }}>
+              <Box sx={{ position: 'fixed', top: '6.2em' }}>
                 <TorIcon
                   sx={{
                     fill: 'url(#linearColors)',
diff --git a/frontend/src/basic/SettingsPage/index.tsx b/frontend/src/basic/SettingsPage/index.tsx
index 0302eb1f..d72e5e1a 100644
--- a/frontend/src/basic/SettingsPage/index.tsx
+++ b/frontend/src/basic/SettingsPage/index.tsx
@@ -18,10 +18,10 @@ const SettingsPage = (): React.JSX.Element => {
         overflowX: 'clip',
       }}
     >
-      <Grid container>
-        <Grid item xs={12}>
-          <SettingsForm />
-        </Grid>
+      <Grid item xs={{ width: '100%' }}>
+        <SettingsForm />
+      </Grid>
+      <Grid item xs={{ width: '100%' }}>
         <Coordinators />
       </Grid>
     </Paper>
diff --git a/frontend/src/components/BookTable/index.tsx b/frontend/src/components/BookTable/index.tsx
index fa72e105..41daaf1b 100644
--- a/frontend/src/components/BookTable/index.tsx
+++ b/frontend/src/components/BookTable/index.tsx
@@ -86,7 +86,7 @@ const BookTable = ({
   showNoResults = true,
   onOrderClicked = () => null,
 }: BookTableProps): React.JSX.Element => {
-  const { fav, setOpen } = useContext<UseAppStoreType>(AppContext);
+  const { fav } = useContext<UseAppStoreType>(AppContext);
   const { federation } = useContext<UseFederationStoreType>(FederationContext);
 
   const { t } = useTranslation();
@@ -243,50 +243,6 @@ const BookTable = ({
     };
   }, []);
 
-  const onClickCoordinator = function (shortAlias: string): void {
-    setOpen((open) => {
-      const thirdParty = thirdParties[shortAlias];
-      if (thirdParty) {
-        return { ...open, thirdParty: shortAlias };
-      } else {
-        return { ...open, coordinator: shortAlias };
-      }
-    });
-  };
-
-  const coordinatorObj = useCallback((width: number) => {
-    return {
-      field: 'coordinatorShortAlias',
-      headerName: t('Host'),
-      width: width * fontSize,
-      renderCell: (params: { row: PublicOrder }) => {
-        const coordinator = federation.getCoordinator(params.row.coordinatorShortAlias);
-        const thirdParty = thirdParties[params.row.coordinatorShortAlias];
-        return (
-          <ListItemButton
-            style={{ cursor: 'pointer' }}
-            onClick={() => {
-              onClickCoordinator(params.row.coordinatorShortAlias);
-            }}
-          >
-            <ListItemAvatar sx={{ position: 'relative', left: '-1.54em', bottom: '0.4em' }}>
-              <RobotAvatar
-                shortAlias={
-                  thirdParty?.shortAlias ??
-                  (coordinator?.federated ? params.row.coordinatorShortAlias : undefined)
-                }
-                hashId={coordinator?.federated ? undefined : coordinator?.shortAlias}
-                style={{ width: '3.215em', height: '3.215em' }}
-                smooth={true}
-                small={true}
-              />
-            </ListItemAvatar>
-          </ListItemButton>
-        );
-      },
-    };
-  }, []);
-
   const typeObj = useCallback(
     (width: number) => {
       return {
@@ -628,28 +584,6 @@ const BookTable = ({
     };
   }, []);
 
-  const idObj = useCallback((width: number) => {
-    return {
-      field: 'id',
-      headerName: 'Order ID',
-      width: width * fontSize,
-      renderCell: (params: { row: PublicOrder }) => {
-        return (
-          <div
-            style={{ cursor: 'pointer' }}
-            onClick={() => {
-              onOrderClicked(params.row.id, params.row.coordinatorShortAlias);
-            }}
-          >
-            <Typography variant='caption' color='text.secondary'>
-              {`#${String(params.row.id)}`}
-            </Typography>
-          </div>
-        );
-      },
-    };
-  }, []);
-
   const bondObj = useCallback((width: number) => {
     return {
       field: 'bond_size',
@@ -683,7 +617,7 @@ const BookTable = ({
       },
       currency: {
         priority: 2,
-        order: 6,
+        order: 4,
         normal: {
           width: fav.mode === 'swap' ? 0 : 5.9,
           object: currencyObj,
@@ -717,7 +651,7 @@ const BookTable = ({
           object: robotObj,
         },
         small: {
-          width: 5.1,
+          width: 5,
           object: robotSmallObj,
         },
       },
@@ -753,25 +687,6 @@ const BookTable = ({
           object: satoshisObj,
         },
       },
-      coordinatorShortAlias: {
-        priority: 10,
-        order: 3,
-        normal: {
-          width: 4.1,
-          object: coordinatorObj,
-        },
-        small: {
-          width: 5.1,
-          object: () => {
-            return {
-              field: 'coordinatorShortAlias',
-              headerName: '',
-              width: 0,
-              renderCell: () => <></>,
-            };
-          },
-        },
-      },
       type: {
         priority: 11,
         order: 2,
@@ -788,14 +703,6 @@ const BookTable = ({
           object: bondObj,
         },
       },
-      id: {
-        priority: 13,
-        order: 13,
-        normal: {
-          width: 4.8,
-          object: idObj,
-        },
-      },
     };
   }, [fav.mode]);
 
diff --git a/frontend/src/components/Charts/DepthChart/index.tsx b/frontend/src/components/Charts/DepthChart/index.tsx
index b2423d1e..ab4f5e50 100644
--- a/frontend/src/components/Charts/DepthChart/index.tsx
+++ b/frontend/src/components/Charts/DepthChart/index.tsx
@@ -282,7 +282,14 @@ const DepthChart: React.FC<DepthChartProps> = ({
         flexDirection: 'column',
       }}
     >
-      <Paper variant='outlined' style={{ width: '100%', height: `100%` }}>
+      <Paper
+        variant='outlined'
+        style={{
+          width: '100%',
+          height: `100%`,
+          justifyContent: 'center',
+        }}
+      >
         {center === undefined || enrichedOrders.length < 1 ? (
           <div
             style={{
diff --git a/frontend/src/components/MakerForm/SelectCoordinator.tsx b/frontend/src/components/MakerForm/SelectCoordinator.tsx
index 9c1063a2..b676d4e5 100644
--- a/frontend/src/components/MakerForm/SelectCoordinator.tsx
+++ b/frontend/src/components/MakerForm/SelectCoordinator.tsx
@@ -73,7 +73,7 @@ const SelectCoordinator: React.FC<SelectCoordinatorProps> = ({
             'The provider the lightning and communication infrastructure. The host will be in charge of providing support and solving disputes. The trade fees are set by the host. Make sure to only select order hosts that you trust!',
           )}
         >
-          <Grid container style={{ marginTop: 10 }}>
+          <Grid container style={{ marginTop: 10, width: '100%' }}>
             <Grid
               item
               sx={{
@@ -108,7 +108,7 @@ const SelectCoordinator: React.FC<SelectCoordinatorProps> = ({
               </Grid>
             </Grid>
 
-            <Grid item>
+            <Grid item xs={{ width: '100%' }}>
               <Select
                 variant='standard'
                 fullWidth
@@ -116,7 +116,6 @@ const SelectCoordinator: React.FC<SelectCoordinatorProps> = ({
                 inputProps={{
                   style: {
                     textAlign: 'center',
-                    width: '70%',
                   },
                 }}
                 value={coordinatorAlias}
diff --git a/frontend/src/components/SettingsForm/index.tsx b/frontend/src/components/SettingsForm/index.tsx
index 0d1fdecf..ef110d38 100644
--- a/frontend/src/components/SettingsForm/index.tsx
+++ b/frontend/src/components/SettingsForm/index.tsx
@@ -48,220 +48,225 @@ const SettingsForm = ({ dense = false }: SettingsFormProps): React.JSX.Element =
   ];
 
   return (
-    <Grid container spacing={2}>
-      <Grid item xs={12}>
-        <List dense={dense}>
-          <ListItem>
-            <ListItemIcon>
-              <Translate />
-            </ListItemIcon>
-            <SelectLanguage
-              language={settings.language}
-              setLanguage={(language) => {
-                setSettings({ ...settings, language });
-                systemClient.setItem('settings_language', language);
-              }}
-            />
-          </ListItem>
-
-          <ListItem>
-            <ListItemIcon>
-              <Palette />
-            </ListItemIcon>
-            <FormControlLabel
-              labelPlacement='end'
-              label={settings.mode === 'dark' ? t('Dark') : t('Light')}
-              control={
-                <Switch
-                  checked={settings.mode === 'dark'}
-                  checkedIcon={
-                    <Paper
-                      elevation={3}
-                      sx={{
-                        width: '1.2em',
-                        height: '1.2em',
-                        borderRadius: '0.4em',
-                        backgroundColor: 'white',
-                        position: 'relative',
-                        top: `${7 - 0.5 * theme.typography.fontSize}px`,
-                      }}
-                    >
-                      <DarkMode sx={{ width: '0.8em', height: '0.8em', color: '#666' }} />
-                    </Paper>
-                  }
-                  icon={
-                    <Paper
-                      elevation={3}
-                      sx={{
-                        width: '1.2em',
-                        height: '1.2em',
-                        borderRadius: '0.4em',
-                        backgroundColor: 'white',
-                        padding: '0.07em',
-                        position: 'relative',
-                        top: `${7 - 0.5 * theme.typography.fontSize}px`,
-                      }}
-                    >
-                      <LightMode sx={{ width: '0.67em', height: '0.67em', color: '#666' }} />
-                    </Paper>
-                  }
-                  onChange={(e) => {
-                    const mode = e.target.checked ? 'dark' : 'light';
-                    setSettings({ ...settings, mode });
-                    systemClient.setItem('settings_mode', mode);
-                  }}
-                />
-              }
-            />
-            {settings.mode === 'dark' ? (
-              <>
-                <ListItemIcon>
-                  <QrCode />
-                </ListItemIcon>
-                <FormControlLabel
-                  sx={{ position: 'relative', right: '1.5em', width: '3em' }}
-                  labelPlacement='end'
-                  label={settings.lightQRs ? t('Light') : t('Dark')}
-                  control={
-                    <Switch
-                      checked={!settings.lightQRs}
-                      checkedIcon={
-                        <Paper
-                          elevation={3}
-                          sx={{
-                            width: '1.2em',
-                            height: '1.2em',
-                            borderRadius: '0.4em',
-                            backgroundColor: 'white',
-                            position: 'relative',
-                            top: `${7 - 0.5 * theme.typography.fontSize}px`,
-                          }}
-                        >
-                          <DarkMode sx={{ width: '0.8em', height: '0.8em', color: '#666' }} />
-                        </Paper>
-                      }
-                      icon={
-                        <Paper
-                          elevation={3}
-                          sx={{
-                            width: '1.2em',
-                            height: '1.2em',
-                            borderRadius: '0.4em',
-                            backgroundColor: 'white',
-                            padding: '0.07em',
-                            position: 'relative',
-                            top: `${7 - 0.5 * theme.typography.fontSize}px`,
-                          }}
-                        >
-                          <LightMode sx={{ width: '0.67em', height: '0.67em', color: '#666' }} />
-                        </Paper>
-                      }
-                      onChange={(e) => {
-                        const lightQRs = !e.target.checked;
-                        setSettings({ ...settings, lightQRs });
-                        systemClient.setItem('settings_light_qr', String(lightQRs));
-                      }}
-                    />
-                  }
-                />
-              </>
-            ) : (
-              <></>
-            )}
-          </ListItem>
-
-          <ListItem>
-            <ListItemIcon>
-              <SettingsOverscan />
-            </ListItemIcon>
-            <Slider
-              value={settings.fontSize}
-              min={settings.frontend === 'basic' ? 12 : 10}
-              max={settings.frontend === 'basic' ? 16 : 14}
-              step={1}
-              onChange={(e) => {
-                const fontSize = e.target.value;
-                setSettings({ ...settings, fontSize });
-                systemClient.setItem(`settings_fontsize_${settings.frontend}`, fontSize.toString());
-              }}
-              valueLabelDisplay='off'
-              marks={fontSizes.map(({ label, value }) => ({
-                label: <Typography variant='caption'>{t(label)}</Typography>,
-                value: settings.frontend === 'basic' ? value.basic : value.pro,
-              }))}
-              track={false}
-            />
-          </ListItem>
-
-          <ListItem>
-            <ListItemIcon>
-              <SettingsInputAntenna />
-            </ListItemIcon>
-            <ToggleButtonGroup
-              sx={{ width: '100%' }}
-              exclusive={true}
-              value={settings.connection}
-              onChange={(_e, connection) => {
-                setSettings({ ...settings, connection });
-                systemClient.setItem('settings_connection', connection);
-              }}
-            >
-              <ToggleButton value='api' color='primary' sx={{ flexGrow: 1 }}>
-                {t('API')}
-              </ToggleButton>
-              <ToggleButton value='nostr' color='secondary' sx={{ flexGrow: 1 }}>
-                {t('nostr')}
-              </ToggleButton>
-            </ToggleButtonGroup>
-          </ListItem>
-
-          <ListItem>
-            <ListItemIcon>
-              <Link />
-            </ListItemIcon>
-            <ToggleButtonGroup
-              sx={{ width: '100%' }}
-              exclusive={true}
-              value={settings.network}
-              onChange={(_e, network) => {
-                setSettings({ ...settings, network });
-                systemClient.setItem('settings_network', network);
-              }}
-            >
-              <ToggleButton value='mainnet' color='primary' sx={{ flexGrow: 1 }}>
-                {t('Mainnet')}
-              </ToggleButton>
-              <ToggleButton value='testnet' color='secondary' sx={{ flexGrow: 1 }}>
-                {t('Testnet')}
-              </ToggleButton>
-            </ToggleButtonGroup>
-          </ListItem>
-
-          {client === 'mobile' && (
+    <Grid item xs={12}>
+      <Grid container direction='column' justifyItems='center' alignItems='center'>
+        <Grid item xs={12}>
+          <List dense={dense}>
             <ListItem>
               <ListItemIcon>
-                <TorIcon />
+                <Translate />
+              </ListItemIcon>
+              <SelectLanguage
+                language={settings.language}
+                setLanguage={(language) => {
+                  setSettings({ ...settings, language });
+                  systemClient.setItem('settings_language', language);
+                }}
+              />
+            </ListItem>
+
+            <ListItem>
+              <ListItemIcon>
+                <Palette />
+              </ListItemIcon>
+              <FormControlLabel
+                labelPlacement='end'
+                label={settings.mode === 'dark' ? t('Dark') : t('Light')}
+                control={
+                  <Switch
+                    checked={settings.mode === 'dark'}
+                    checkedIcon={
+                      <Paper
+                        elevation={3}
+                        sx={{
+                          width: '1.2em',
+                          height: '1.2em',
+                          borderRadius: '0.4em',
+                          backgroundColor: 'white',
+                          position: 'relative',
+                          top: `${7 - 0.5 * theme.typography.fontSize}px`,
+                        }}
+                      >
+                        <DarkMode sx={{ width: '0.8em', height: '0.8em', color: '#666' }} />
+                      </Paper>
+                    }
+                    icon={
+                      <Paper
+                        elevation={3}
+                        sx={{
+                          width: '1.2em',
+                          height: '1.2em',
+                          borderRadius: '0.4em',
+                          backgroundColor: 'white',
+                          padding: '0.07em',
+                          position: 'relative',
+                          top: `${7 - 0.5 * theme.typography.fontSize}px`,
+                        }}
+                      >
+                        <LightMode sx={{ width: '0.67em', height: '0.67em', color: '#666' }} />
+                      </Paper>
+                    }
+                    onChange={(e) => {
+                      const mode = e.target.checked ? 'dark' : 'light';
+                      setSettings({ ...settings, mode });
+                      systemClient.setItem('settings_mode', mode);
+                    }}
+                  />
+                }
+              />
+              {settings.mode === 'dark' ? (
+                <>
+                  <ListItemIcon>
+                    <QrCode />
+                  </ListItemIcon>
+                  <FormControlLabel
+                    sx={{ position: 'relative', right: '1.5em', width: '3em' }}
+                    labelPlacement='end'
+                    label={settings.lightQRs ? t('Light') : t('Dark')}
+                    control={
+                      <Switch
+                        checked={!settings.lightQRs}
+                        checkedIcon={
+                          <Paper
+                            elevation={3}
+                            sx={{
+                              width: '1.2em',
+                              height: '1.2em',
+                              borderRadius: '0.4em',
+                              backgroundColor: 'white',
+                              position: 'relative',
+                              top: `${7 - 0.5 * theme.typography.fontSize}px`,
+                            }}
+                          >
+                            <DarkMode sx={{ width: '0.8em', height: '0.8em', color: '#666' }} />
+                          </Paper>
+                        }
+                        icon={
+                          <Paper
+                            elevation={3}
+                            sx={{
+                              width: '1.2em',
+                              height: '1.2em',
+                              borderRadius: '0.4em',
+                              backgroundColor: 'white',
+                              padding: '0.07em',
+                              position: 'relative',
+                              top: `${7 - 0.5 * theme.typography.fontSize}px`,
+                            }}
+                          >
+                            <LightMode sx={{ width: '0.67em', height: '0.67em', color: '#666' }} />
+                          </Paper>
+                        }
+                        onChange={(e) => {
+                          const lightQRs = !e.target.checked;
+                          setSettings({ ...settings, lightQRs });
+                          systemClient.setItem('settings_light_qr', String(lightQRs));
+                        }}
+                      />
+                    }
+                  />
+                </>
+              ) : (
+                <></>
+              )}
+            </ListItem>
+
+            <ListItem>
+              <ListItemIcon>
+                <SettingsOverscan />
+              </ListItemIcon>
+              <Slider
+                value={settings.fontSize}
+                min={settings.frontend === 'basic' ? 12 : 10}
+                max={settings.frontend === 'basic' ? 16 : 14}
+                step={1}
+                onChange={(e) => {
+                  const fontSize = e.target.value;
+                  setSettings({ ...settings, fontSize });
+                  systemClient.setItem(
+                    `settings_fontsize_${settings.frontend}`,
+                    fontSize.toString(),
+                  );
+                }}
+                valueLabelDisplay='off'
+                marks={fontSizes.map(({ label, value }) => ({
+                  label: <Typography variant='caption'>{t(label)}</Typography>,
+                  value: settings.frontend === 'basic' ? value.basic : value.pro,
+                }))}
+                track={false}
+              />
+            </ListItem>
+
+            <ListItem>
+              <ListItemIcon>
+                <SettingsInputAntenna />
               </ListItemIcon>
               <ToggleButtonGroup
+                sx={{ width: '100%' }}
                 exclusive={true}
-                value={settings.useProxy}
-                onChange={(_e, useProxy) => {
-                  setSettings({ ...settings, useProxy });
-                  systemClient.setItem('settings_use_proxy', String(useProxy));
-                  apiClient.useProxy = useProxy;
-                  websocketClient.useProxy = useProxy;
+                value={settings.connection}
+                onChange={(_e, connection) => {
+                  setSettings({ ...settings, connection });
+                  systemClient.setItem('settings_connection', connection);
                 }}
               >
-                <ToggleButton value={true} color='primary'>
-                  {t('Build-in')}
+                <ToggleButton value='api' color='primary' sx={{ flexGrow: 1 }}>
+                  {t('API')}
                 </ToggleButton>
-                <ToggleButton value={false} color='secondary'>
-                  {t('Disabled')}
+                <ToggleButton value='nostr' color='secondary' sx={{ flexGrow: 1 }}>
+                  {t('nostr')}
                 </ToggleButton>
               </ToggleButtonGroup>
             </ListItem>
-          )}
-        </List>
+
+            <ListItem>
+              <ListItemIcon>
+                <Link />
+              </ListItemIcon>
+              <ToggleButtonGroup
+                sx={{ width: '100%' }}
+                exclusive={true}
+                value={settings.network}
+                onChange={(_e, network) => {
+                  setSettings({ ...settings, network });
+                  systemClient.setItem('settings_network', network);
+                }}
+              >
+                <ToggleButton value='mainnet' color='primary' sx={{ flexGrow: 1 }}>
+                  {t('Mainnet')}
+                </ToggleButton>
+                <ToggleButton value='testnet' color='secondary' sx={{ flexGrow: 1 }}>
+                  {t('Testnet')}
+                </ToggleButton>
+              </ToggleButtonGroup>
+            </ListItem>
+
+            {client === 'mobile' && (
+              <ListItem>
+                <ListItemIcon>
+                  <TorIcon />
+                </ListItemIcon>
+                <ToggleButtonGroup
+                  exclusive={true}
+                  value={settings.useProxy}
+                  onChange={(_e, useProxy) => {
+                    setSettings({ ...settings, useProxy });
+                    systemClient.setItem('settings_use_proxy', String(useProxy));
+                    apiClient.useProxy = useProxy;
+                    websocketClient.useProxy = useProxy;
+                  }}
+                >
+                  <ToggleButton value={true} color='primary'>
+                    {t('Build-in')}
+                  </ToggleButton>
+                  <ToggleButton value={false} color='secondary'>
+                    {t('Disabled')}
+                  </ToggleButton>
+                </ToggleButtonGroup>
+              </ListItem>
+            )}
+          </List>
+        </Grid>
       </Grid>
     </Grid>
   );
diff --git a/frontend/static/locales/ca.json b/frontend/static/locales/ca.json
index 13278346..2cee639c 100644
--- a/frontend/static/locales/ca.json
+++ b/frontend/static/locales/ca.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Ordre activa #{{orderID}}",
   "Add Robot": "Afegir Robot",
-  "Add a new Robot": "Afegeix un nou Robot",
   "Building...": "Construint...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Última ordre #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Buscar columna",
   "Hide": "Amagar",
   "Hide all": "Ocultar totes",
-  "Host": "Host",
   "Is": "Acció",
   "Logic operator": "Operador lògic",
   "Manage columns": "Gestionar columnes",
diff --git a/frontend/static/locales/cs.json b/frontend/static/locales/cs.json
index 723fd53f..d5382559 100644
--- a/frontend/static/locales/cs.json
+++ b/frontend/static/locales/cs.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Active order #{{orderID}}",
   "Add Robot": "Add Robot",
-  "Add a new Robot": "Add a new Robot",
   "Building...": "Building...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Last order #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Najít sloupec",
   "Hide": "Skrýt",
   "Hide all": "Schovat vše",
-  "Host": "Host",
   "Is": "Je",
   "Logic operator": "Logický operátor",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/de.json b/frontend/static/locales/de.json
index 1d0d5360..7ab01c7f 100644
--- a/frontend/static/locales/de.json
+++ b/frontend/static/locales/de.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Active order #{{orderID}}",
   "Add Robot": "Add Robot",
-  "Add a new Robot": "Add a new Robot",
   "Building...": "Building...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Last order #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Find column",
   "Hide": "Ausblenden",
   "Hide all": "Hide all",
-  "Host": "Host",
   "Is": "Ist",
   "Logic operator": "Logic operator",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/en.json b/frontend/static/locales/en.json
index c0e6cc98..f0f0e0f4 100644
--- a/frontend/static/locales/en.json
+++ b/frontend/static/locales/en.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Active order #{{orderID}}",
   "Add Robot": "Add Robot",
-  "Add a new Robot": "Add a new Robot",
   "Building...": "Building...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Last order #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Find column",
   "Hide": "Hide",
   "Hide all": "Hide all",
-  "Host": "Host",
   "Is": "Is",
   "Logic operator": "Logic operator",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/es.json b/frontend/static/locales/es.json
index d412bcc7..41a128e5 100644
--- a/frontend/static/locales/es.json
+++ b/frontend/static/locales/es.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Orden activa #{{orderID}}",
   "Add Robot": "Añadir Robot",
-  "Add a new Robot": "Añade un nuevo Robot",
   "Building...": "Construyendo...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Última orden #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Buscar columna",
   "Hide": "Ocultar",
   "Hide all": "Ocultar todas",
-  "Host": "Host",
   "Is": "Es",
   "Logic operator": "Operador lógico",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/eu.json b/frontend/static/locales/eu.json
index 1034e71e..24360caf 100644
--- a/frontend/static/locales/eu.json
+++ b/frontend/static/locales/eu.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Active order #{{orderID}}",
   "Add Robot": "Add Robot",
-  "Add a new Robot": "Add a new Robot",
   "Building...": "Building...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Last order #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Bilatu zutabea",
   "Hide": "Ezkutatu",
   "Hide all": "Ezkutatu dena",
-  "Host": "Host",
   "Is": "Da",
   "Logic operator": "Operadore logikoa",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/fr.json b/frontend/static/locales/fr.json
index 7e779e46..10b7f31c 100644
--- a/frontend/static/locales/fr.json
+++ b/frontend/static/locales/fr.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Ordre actif #{{orderID}}",
   "Add Robot": "Ajout Robot",
-  "Add a new Robot": "Ajouter un nouveau Robot",
   "Building...": "Construction...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Dernier ordre #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Trouver une colonne",
   "Hide": "Cacher",
   "Hide all": "Tout cacher",
-  "Host": "Host",
   "Is": "Est",
   "Logic operator": "Opérateur logic",
   "Manage columns": "Gestion des colonnes",
diff --git a/frontend/static/locales/it.json b/frontend/static/locales/it.json
index 6f2a878c..863b7ab1 100644
--- a/frontend/static/locales/it.json
+++ b/frontend/static/locales/it.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Ordine attivo #{{orderID}}",
   "Add Robot": "Aggiungi robot",
-  "Add a new Robot": "Aggiungi un nuovo robot",
   "Building...": "Costruzione...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Ultimo ordine #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Trova colonna",
   "Hide": "Nascondi",
   "Hide all": "Nascondi tutto",
-  "Host": "Host",
   "Is": "è",
   "Logic operator": "Operatore logico",
   "Manage columns": "Gestisci colonne",
diff --git a/frontend/static/locales/ja.json b/frontend/static/locales/ja.json
index 5482402b..7848f515 100644
--- a/frontend/static/locales/ja.json
+++ b/frontend/static/locales/ja.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "公開中の注文 #{{orderID}}",
   "Add Robot": "ロボットを追加",
-  "Add a new Robot": "新しいロボットを追加",
   "Building...": "生成中...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "直前の注文 #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "列を検索",
   "Hide": "非表示",
   "Hide all": "すべて非表示",
-  "Host": "Host",
   "Is": "〜である",
   "Logic operator": "ロジックオペレーター",
   "Manage columns": "列の管理",
diff --git a/frontend/static/locales/pl.json b/frontend/static/locales/pl.json
index 32d54c44..97ec0eb0 100644
--- a/frontend/static/locales/pl.json
+++ b/frontend/static/locales/pl.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Active order #{{orderID}}",
   "Add Robot": "Add Robot",
-  "Add a new Robot": "Add a new Robot",
   "Building...": "Building...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Last order #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Find column",
   "Hide": "Ukryć",
   "Hide all": "Hide all",
-  "Host": "Host",
   "Is": "Jest",
   "Logic operator": "Logic operator",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/pt.json b/frontend/static/locales/pt.json
index 58c542db..9c2b5e28 100644
--- a/frontend/static/locales/pt.json
+++ b/frontend/static/locales/pt.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Ordem ativa #{{orderID}}",
   "Add Robot": "Adicionar Robô",
-  "Add a new Robot": "Adicionar um novo Robô",
   "Building...": "Criando...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Última ordem #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Find column",
   "Hide": "Esconder",
   "Hide all": "Esconder tudo",
-  "Host": "Host",
   "Is": "É",
   "Logic operator": "Logic operator",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/ru.json b/frontend/static/locales/ru.json
index 663a6189..1cbe95ae 100644
--- a/frontend/static/locales/ru.json
+++ b/frontend/static/locales/ru.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Активный ордер #{{orderID}}",
   "Add Robot": "Добавить робота",
-  "Add a new Robot": "Добавить нового робота",
   "Building...": "Строим...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Последний ордер #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Найти столбец",
   "Hide": "Скрыть",
   "Hide all": "Скрыть все",
-  "Host": "Host",
   "Is": "Кто",
   "Logic operator": "Логический оператор",
   "Manage columns": "Управление столбцами",
diff --git a/frontend/static/locales/sv.json b/frontend/static/locales/sv.json
index c9fbb75a..a43118c9 100644
--- a/frontend/static/locales/sv.json
+++ b/frontend/static/locales/sv.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Active order #{{orderID}}",
   "Add Robot": "Add Robot",
-  "Add a new Robot": "Add a new Robot",
   "Building...": "Building...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Last order #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Find column",
   "Hide": "Göm",
   "Hide all": "Hide all",
-  "Host": "Host",
   "Is": "Är",
   "Logic operator": "Logic operator",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/sw.json b/frontend/static/locales/sw.json
index f6ebb696..6a611675 100644
--- a/frontend/static/locales/sw.json
+++ b/frontend/static/locales/sw.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Amri hai #{{orderID}}",
   "Add Robot": "Ongeza Roboti",
-  "Add a new Robot": "Ongeza Roboti mpya",
   "Building...": "Inajengwa...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Amri ya mwisho #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "Tafuta kolaamu",
   "Hide": "Ficha",
   "Hide all": "Ficha yote",
-  "Host": "Host",
   "Is": "Ni",
   "Logic operator": "Msimamizi wa mantiki",
   "Manage columns": "Simamia kolaamu",
diff --git a/frontend/static/locales/th.json b/frontend/static/locales/th.json
index 54a5d60c..5ce12848 100644
--- a/frontend/static/locales/th.json
+++ b/frontend/static/locales/th.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "Active order #{{orderID}}",
   "Add Robot": "Add Robot",
-  "Add a new Robot": "Add a new Robot",
   "Building...": "Building...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "Last order #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "ค้นหาคอลัมน์",
   "Hide": "ซ่อน",
   "Hide all": "ซ่อนทั้งหมด",
-  "Host": "Host",
   "Is": "เป็น",
   "Logic operator": "ตัวดำเนินการ",
   "Manage columns": "Manage columns",
diff --git a/frontend/static/locales/zh-SI.json b/frontend/static/locales/zh-SI.json
index ca302880..90eeae50 100644
--- a/frontend/static/locales/zh-SI.json
+++ b/frontend/static/locales/zh-SI.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "活跃订单 #{{orderID}}",
   "Add Robot": "添加机器人",
-  "Add a new Robot": "添加新机器人",
   "Building...": "正在建造...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "上一张订单 #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "查找列",
   "Hide": "隐藏",
   "Hide all": "隐藏全部",
-  "Host": "Host",
   "Is": "是",
   "Logic operator": "逻辑运算符",
   "Manage columns": "管理列",
diff --git a/frontend/static/locales/zh-TR.json b/frontend/static/locales/zh-TR.json
index 16d7f79e..662b0afb 100644
--- a/frontend/static/locales/zh-TR.json
+++ b/frontend/static/locales/zh-TR.json
@@ -43,7 +43,6 @@
   "#8": "Phrases in basic/RobotPage/RobotProfile.tsx",
   "Active order #{{orderID}}": "活躍訂單 #{{orderID}}",
   "Add Robot": "添加機器人",
-  "Add a new Robot": "添加新機器人",
   "Building...": "正在建造...",
   "Delete Robot": "Delete Robot",
   "Last order #{{orderID}}": "上一張訂單 #{{orderID}}",
@@ -109,7 +108,6 @@
   "Find column": "查找列",
   "Hide": "隱藏",
   "Hide all": "隱藏全部",
-  "Host": "Host",
   "Is": "是",
   "Logic operator": "邏輯運算符",
   "Manage columns": "管理列",