Add swappable baseurls (network and coordinators)

frontend/src/basic/BookPage/index.tsx

@@ -27,6 +27,7 @@ interface BookPageProps {
   hasRobot: boolean;
   setPage: (state: Page) => void;
   setCurrentOrder: (state: number) => void;
+  baseUrl: string;
 }
 
 const BookPage = ({
@@ -43,6 +44,7 @@ const BookPage = ({
   hasRobot = false,
   setPage = () => null,
   setCurrentOrder = () => null,
+  baseUrl,
 }: BookPageProps): JSX.Element => {
   const { t } = useTranslation();
   const history = useHistory();
@@ -158,6 +160,7 @@ const BookPage = ({
                 onCurrencyChange={handleCurrencyChange}
                 onTypeChange={handleTypeChange}
                 onOrderClicked={onOrderClicked}
+                baseUrl={baseUrl}
               />
             </Grid>
             <Grid item>
@@ -169,6 +172,7 @@ const BookPage = ({
                 maxWidth={chartWidthEm} // EM units
                 maxHeight={windowSize.height * 0.825 - 5} // EM units
                 onOrderClicked={onOrderClicked}
+                baseUrl={baseUrl}
               />
             </Grid>
           </Grid>
@@ -181,6 +185,7 @@ const BookPage = ({
             maxWidth={windowSize.width * 0.8} // EM units
             maxHeight={windowSize.height * 0.825 - 5} // EM units
             onOrderClicked={onOrderClicked}
+            baseUrl={baseUrl}
           />
         ) : (
           <BookTable
@@ -195,6 +200,7 @@ const BookPage = ({
             onCurrencyChange={handleCurrencyChange}
             onTypeChange={handleTypeChange}
             onOrderClicked={onOrderClicked}
+            baseUrl={baseUrl}
           />
         )}
       </Grid>

frontend/src/basic/Main.tsx

@@ -25,7 +25,7 @@ import {
 } from '../models';
 
 import { apiClient } from '../services/api';
-import { checkVer } from '../utils';
+import { checkVer, getHost } from '../utils';
 import { sha256 } from 'js-sha256';
 
 import defaultCoordinators from '../../static/federation.json';
@@ -59,6 +59,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
   const [maker, setMaker] = useState<Maker>(defaultMaker);
   const [info, setInfo] = useState<Info>(defaultInfo);
   const [coordinators, setCoordinators] = useState<Coordinator[]>(defaultCoordinators);
+  const [baseUrl, setBaseUrl] = useState<string>('');
   const [fav, setFav] = useState<Favorites>({ type: null, currency: 0 });
 
   const theme = useTheme();
@@ -105,6 +106,20 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
     };
   }, []);
 
+  useEffect(() => {
+    let host = '';
+    if (window.NativeRobosats === undefined) {
+      host = getHost();
+    } else {
+      host =
+        settings.network === 'mainnet'
+          ? coordinators[0].mainnetOnion
+          : coordinators[0].testnetOnion;
+    }
+    setBaseUrl(`http://${host}`);
+    console.log(`http://${host}`);
+  }, [settings.network]);
+
   useEffect(() => {
     setWindowSize(getWindowSize(theme.typography.fontSize));
   }, [theme.typography.fontSize]);
@@ -115,7 +130,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
 
   const fetchBook = function () {
     setBook({ ...book, loading: true });
-    apiClient.get('/api/book/').then((data: any) =>
+    apiClient.get(baseUrl, '/api/book/').then((data: any) =>
       setBook({
         loading: false,
         orders: data.not_found ? [] : data,
@@ -125,7 +140,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
 
   const fetchLimits = async () => {
     setLimits({ ...limits, loading: true });
-    const data = apiClient.get('/api/limits/').then((data) => {
+    const data = apiClient.get(baseUrl, '/api/limits/').then((data) => {
       setLimits({ list: data ?? [], loading: false });
       return data;
     });
@@ -134,7 +149,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
 
   const fetchInfo = function () {
     setInfo({ ...info, loading: true });
-    apiClient.get('/api/info/').then((data: Info) => {
+    apiClient.get(baseUrl, '/api/info/').then((data: Info) => {
       const versionInfo: any = checkVer(data.version.major, data.version.minor, data.version.patch);
       setInfo({
         ...data,
@@ -162,7 +177,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
     }
 
     setRobot({ ...robot, loading: true });
-    apiClient.post('/api/user/', requestBody).then((data: any) => {
+    apiClient.post(baseUrl, '/api/user/', requestBody).then((data: any) => {
       setCurrentOrder(
         data.active_order_id
           ? data.active_order_id
@@ -207,6 +222,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
       <RobotAvatar
         style={{ display: 'none' }}
         nickname={robot.nickname}
+        baseUrl={baseUrl}
         onLoad={() => setRobot({ ...robot, avatarLoaded: true })}
       />
       <Box
@@ -235,6 +251,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
                     theme={theme}
                     robot={robot}
                     setRobot={setRobot}
+                    baseUrl={baseUrl}
                   />
                 </div>
               </Slide>
@@ -262,6 +279,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
                   hasRobot={robot.avatarLoaded}
                   setPage={setPage}
                   setCurrentOrder={setCurrentOrder}
+                  baseUrl={baseUrl}
                 />
               </div>
             </Slide>
@@ -300,7 +318,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
                 appear={slideDirection.in != undefined}
               >
                 <div>
-                  <OrderPage theme={theme} history={history} {...props} />
+                  <OrderPage theme={theme} history={history} {...props} baseUrl={baseUrl} />
                 </div>
               </Slide>
             )}
@@ -335,6 +353,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
         setSlideDirection={setSlideDirection}
         currentOrder={currentOrder}
         hasRobot={robot.avatarLoaded}
+        baseUrl={baseUrl}
       />
       <MainDialogs
         open={open}
@@ -345,6 +364,7 @@ const Main = ({ settings, setSettings }: MainProps): JSX.Element => {
         info={info}
         robot={robot}
         closeAll={closeAll}
+        baseUrl={baseUrl}
       />
     </Router>
   );

frontend/src/basic/MainDialogs/index.tsx

@@ -31,6 +31,7 @@ interface MainDialogsProps {
   setPage: (state: Page) => void;
   setCurrentOrder: (state: number) => void;
   closeAll: OpenDialogs;
+  baseUrl: string;
 }
 
 const MainDialogs = ({
@@ -42,6 +43,7 @@ const MainDialogs = ({
   setRobot,
   setPage,
   setCurrentOrder,
+  baseUrl,
 }: MainDialogsProps): JSX.Element => {
   useEffect(() => {
     if (info.openUpdateClient) {
@@ -79,6 +81,7 @@ const MainDialogs = ({
       />
       <ProfileDialog
         open={open.profile}
+        baseUrl={baseUrl}
         onClose={() => setOpen({ ...open, profile: false })}
         robot={robot}
         setRobot={setRobot}

frontend/src/basic/NavBar/NavBar.tsx

@@ -32,6 +32,7 @@ interface NavBarProps {
   closeAll: OpenDialogs;
   currentOrder: number | null;
   hasRobot: boolean;
+  baseUrl: string;
 }
 
 const NavBar = ({
@@ -46,6 +47,7 @@ const NavBar = ({
   height,
   currentOrder,
   hasRobot = false,
+  baseUrl,
 }: NavBarProps): JSX.Element => {
   const theme = useTheme();
   const { t } = useTranslation();
@@ -111,6 +113,7 @@ const NavBar = ({
                 style={{ width: '2.3em', height: '2.3em', position: 'relative', top: '0.2em' }}
                 avatarClass={theme.palette.mode === 'dark' ? 'navBarAvatarDark' : 'navBarAvatar'}
                 nickname={nickname}
+                baseUrl={baseUrl}
               />
             ) : (
               <></>

frontend/src/basic/OrderPage/index.js

@@ -117,7 +117,7 @@ class OrderPage extends Component {
 
   getOrderDetails = (id) => {
     this.setState({ orderId: id });
-    apiClient.get('/api/order/?order_id=' + id).then(this.orderDetailsReceived);
+    apiClient.get(this.props.baseUrl, '/api/order/?order_id=' + id).then(this.orderDetailsReceived);
   };
 
   orderDetailsReceived = (data) => {
@@ -179,7 +179,7 @@ class OrderPage extends Component {
 
   sendWeblnInvoice = (invoice) => {
     apiClient
-      .post('/api/order/?order_id=' + this.state.orderId, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.state.orderId, {
         action: 'update_invoice',
         invoice,
       })
@@ -418,7 +418,7 @@ class OrderPage extends Component {
   takeOrder = () => {
     this.setState({ loading: true });
     apiClient
-      .post('/api/order/?order_id=' + this.state.orderId, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.state.orderId, {
         action: 'take',
         amount: this.state.takeAmount,
       })
@@ -438,7 +438,7 @@ class OrderPage extends Component {
   handleClickConfirmCancelButton = () => {
     this.setState({ loading: true });
     apiClient
-      .post('/api/order/?order_id=' + this.state.orderId, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.state.orderId, {
         action: 'cancel',
       })
       .then(() => this.getOrderDetails(this.state.orderId) & this.setState({ status: 4 }));
@@ -538,7 +538,7 @@ class OrderPage extends Component {
 
   handleClickConfirmCollaborativeCancelButton = () => {
     apiClient
-      .post('/api/order/?order_id=' + this.state.orderId, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.state.orderId, {
         action: 'cancel',
       })
       .then(() => this.getOrderDetails(this.state.orderId) & this.setState({ status: 4 }));
@@ -965,6 +965,7 @@ class OrderPage extends Component {
             width={330}
             data={this.state}
             completeSetState={this.completeSetState}
+            baseUrl={this.props.baseUrl}
           />
         </Grid>
       </Grid>
@@ -1011,6 +1012,7 @@ class OrderPage extends Component {
                 width={330}
                 data={this.state}
                 completeSetState={this.completeSetState}
+                baseUrl={this.props.baseUrl}
               />
             </div>
           </Grid>

frontend/src/basic/UserGenPage.js

@@ -71,7 +71,7 @@ class UserGenPage extends Component {
       };
     });
     requestBody.then((body) =>
-      apiClient.post('/api/user/', body).then((data) => {
+      apiClient.post(this.props.baseUrl, '/api/user/', body).then((data) => {
         this.setState({ found: data.found, bad_request: data.bad_request });
         this.props.setCurrentOrder(
           data.active_order_id
@@ -126,7 +126,7 @@ class UserGenPage extends Component {
   };
 
   delGeneratedUser() {
-    apiClient.delete('/api/user');
+    apiClient.delete(this.props.baseUrl, '/api/user');
 
     systemClient.deleteCookie('sessionid');
     systemClient.deleteCookie('robot_token');
@@ -241,6 +241,7 @@ class UserGenPage extends Component {
                   }}
                   tooltip={t('This is your trading avatar')}
                   tooltipPosition='top'
+                  baseUrl={this.props.baseUrl}
                 />
                 <br />
               </Grid>

frontend/src/components/BookTable/index.tsx

@@ -46,6 +46,7 @@ interface BookTableProps {
   onCurrencyChange?: (e: any) => void;
   onTypeChange?: (mouseEvent: any, val: number) => void;
   onOrderClicked?: (id: number) => void;
+  baseUrl: string;
 }
 
 const BookTable = ({
@@ -65,6 +66,7 @@ const BookTable = ({
   onCurrencyChange,
   onTypeChange,
   onOrderClicked = () => null,
+  baseUrl,
 }: BookTableProps): JSX.Element => {
   const { t } = useTranslation();
   const theme = useTheme();
@@ -173,6 +175,7 @@ const BookTable = ({
                 orderType={params.row.type}
                 statusColor={statusBadgeColor(params.row.maker_status)}
                 tooltip={t(params.row.maker_status)}
+                baseUrl={baseUrl}
               />
             </ListItemAvatar>
             <ListItemText primary={params.row.maker_nick} />
@@ -200,6 +203,7 @@ const BookTable = ({
                 orderType={params.row.type}
                 statusColor={statusBadgeColor(params.row.maker_status)}
                 tooltip={t(params.row.maker_status)}
+                baseUrl={baseUrl}
               />
             </ListItemButton>
           </div>

frontend/src/components/Charts/DepthChart/index.tsx

@@ -20,8 +20,7 @@ import {
 } from '@mui/material';
 import { AddCircleOutline, RemoveCircleOutline } from '@mui/icons-material';
 import { useTranslation } from 'react-i18next';
-import { useHistory } from 'react-router-dom';
+import { PublicOrder, LimitList, Order } from '../../../models';
-import { PublicOrder, LimitList } from '../../../models';
 import RobotAvatar from '../../RobotAvatar';
 import { amountToString, matchMedian, statusBadgeColor } from '../../../utils';
 import currencyDict from '../../../../static/assets/currencies.json';
@@ -38,6 +37,7 @@ interface DepthChartProps {
   fillContainer?: boolean;
   elevation?: number;
   onOrderClicked?: (id: number) => void;
+  baseUrl: string;
 }
 
 const DepthChart: React.FC<DepthChartProps> = ({
@@ -50,9 +50,9 @@ const DepthChart: React.FC<DepthChartProps> = ({
   fillContainer = false,
   elevation = 6,
   onOrderClicked = () => null,
+  baseUrl,
 }) => {
   const { t } = useTranslation();
-  const history = useHistory();
   const theme = useTheme();
   const [enrichedOrders, setEnrichedOrders] = useState<Order[]>([]);
   const [series, setSeries] = useState<Serie[]>([]);
@@ -233,6 +233,7 @@ const DepthChart: React.FC<DepthChartProps> = ({
                 orderType={order.type}
                 statusColor={statusBadgeColor(order.maker_status)}
                 tooltip={t(order.maker_status)}
+                baseUrl={baseUrl}
               />
             </Grid>
           </Grid>

frontend/src/components/Dialogs/Profile.tsx

@@ -50,10 +50,12 @@ interface Props {
   setRobot: (state: Robot) => void;
   setPage: (state: Page) => void;
   setCurrentOrder: (state: number) => void;
+  baseUrl: string;
 }
 
 const ProfileDialog = ({
   open = false,
+  baseUrl,
   onClose,
   robot,
   setRobot,
@@ -110,7 +112,7 @@ const ProfileDialog = ({
     setShowRewardsSpinner(true);
 
     apiClient
-      .post('/api/reward/', {
+      .post(baseUrl, '/api/reward/', {
         invoice: rewardInvoice,
       })
       .then((data: any) => {
@@ -130,7 +132,7 @@ const ProfileDialog = ({
 
   const setStealthInvoice = (wantsStealth: boolean) => {
     apiClient
-      .put('/api/stealth/', { wantsStealth })
+      .put(baseUrl, '/api/stealth/', { wantsStealth })
       .then((data) => setRobot({ ...robot, stealthInvoices: data?.wantsStealth }));
   };
 

frontend/src/components/RobotAvatar/index.tsx

@@ -18,6 +18,7 @@ interface Props {
   tooltipPosition?: string;
   avatarClass?: string;
   onLoad?: () => void;
+  baseUrl: string;
 }
 
 const RobotAvatar: React.FC<Props> = ({
@@ -32,6 +33,7 @@ const RobotAvatar: React.FC<Props> = ({
   avatarClass = 'flippedSmallAvatar',
   imageStyle = {},
   onLoad = () => {},
+  baseUrl,
 }) => {
   const { t } = useTranslation();
   const theme = useTheme();
@@ -39,7 +41,13 @@ const RobotAvatar: React.FC<Props> = ({
 
   useEffect(() => {
     if (nickname != null) {
-      apiClient.fileImageUrl('/static/assets/avatars/' + nickname + '.png').then(setAvatarSrc);
+      if (window.NativeRobosats === undefined) {
+        setAvatarSrc(baseUrl + '/static/assets/avatars/' + nickname + '.png');
+      } else {
+        apiClient
+          .fileImageUrl(baseUrl, '/static/assets/avatars/' + nickname + '.png')
+          .then(setAvatarSrc);
+      }
     }
   }, [nickname]);
 

frontend/src/components/TradeBox/index.js

@@ -137,7 +137,7 @@ class TradeBox extends Component {
 
   handleClickAgreeDisputeButton = () => {
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'dispute',
       })
       .then((data) => this.props.completeSetState(data));
@@ -494,7 +494,7 @@ class TradeBox extends Component {
   handleClickPauseOrder = () => {
     this.props.completeSetState({ pauseLoading: true });
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'pause',
       })
       .then((data) => this.props.getOrderDetails(data.id));
@@ -642,7 +642,7 @@ class TradeBox extends Component {
     this.setState({ badInvoice: false, loadingSubmitInvoice: true });
 
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'update_invoice',
         invoice: this.state.invoice,
       })
@@ -675,7 +675,7 @@ class TradeBox extends Component {
     this.setState({ badInvoice: false, loadingSubmitAddress: true });
 
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'update_address',
         address: this.state.address,
         mining_fee_rate: Math.max(1, this.state.miningFee),
@@ -698,7 +698,7 @@ class TradeBox extends Component {
     this.setState({ badInvoice: false });
 
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'submit_statement',
         statement: this.state.statement,
       })
@@ -1205,7 +1205,7 @@ class TradeBox extends Component {
 
   handleClickConfirmButton = () => {
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'confirm',
       })
       .then((data) => {
@@ -1216,7 +1216,7 @@ class TradeBox extends Component {
 
   handleRatingUserChange = (e) => {
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'rate_user',
         rating: e.target.value,
       })
@@ -1230,7 +1230,7 @@ class TradeBox extends Component {
     this.setState({ rating_platform: e.target.value });
 
     apiClient
-      .post('/api/order/?order_id=' + this.props.data.id, {
+      .post(this.props.baseUrl, '/api/order/?order_id=' + this.props.data.id, {
         action: 'rate_platform',
         rating: e.target.value,
       })
@@ -1356,7 +1356,7 @@ class TradeBox extends Component {
       bondless_taker: this.props.data.bondless_taker,
     };
     apiClient
-      .post('/api/make/', body)
+      .post(this.props.baseUrl, '/api/make/', body)
       .then(
         (data) =>
           this.setState({ badRequest: data.bad_request }) &

frontend/src/components/UnsafeAlert.js

@@ -23,17 +23,24 @@ class UnsafeAlert extends Component {
 
   checkClient() {
     const http = new XMLHttpRequest();
-    const unsafeClient = !this.safe_urls.includes(getHost());
+    const host = getHost();
+    const unsafeClient = !this.safe_urls.includes(host);
     try {
-      http.open('HEAD', `${location.protocol}//${getHost()}/selfhosted`, false);
+      http.open('HEAD', `${location.protocol}//${host}/selfhosted`, false);
       http.send();
       this.props.setSettings({
         ...this.props.settings,
+        host,
         unsafeClient,
         selfhostedClient: http.status === 200,
       });
     } catch {
-      this.props.setSettings({ ...this.props.settings, unsafeClient, selfhostedClient: false });
+      this.props.setSettings({
+        ...this.props.settings,
+        host,
+        unsafeClient,
+        selfhostedClient: false,
+      });
     }
   }
 

frontend/src/models/Settings.model.ts

@@ -46,6 +46,7 @@ class BaseSettings {
   public freezeViewports: boolean = false;
   public network: 'mainnet' | 'testnet' | undefined = 'mainnet';
   public coordinator: Coordinator | undefined = undefined;
+  public host?: string;
   public unsafeClient: boolean = false;
   public hostedClient: boolean = false;
 }

frontend/src/services/Native/index.d.ts

@@ -16,6 +16,7 @@ export interface NativeWebViewMessageHttp {
   category: 'http';
   type: 'post' | 'get' | 'put' | 'delete' | 'xhr';
   path: string;
+  baseUrl: string;
   headers?: object;
   body?: object;
 }

frontend/src/services/api/ApiNativeClient/index.ts

@@ -38,39 +38,56 @@ class ApiNativeClient implements ApiClient {
     return response.json;
   };
 
-  public put: (path: string, body: object) => Promise<object | undefined> = async (path, body) => {
+  public put: (baseUrl: string, path: string, body: object) => Promise<object | undefined> = async (
+    baseUrl,
+    path,
+    body,
+  ) => {
     return await new Promise((res, _rej) => res({}));
   };
 
-  public delete: (path: string) => Promise<object | undefined> = async (path) => {
+  public delete: (baseUrl: string, path: string) => Promise<object | undefined> = async (
+    baseUrl,
+    path,
+  ) => {
     return await window.NativeRobosats?.postMessage({
       category: 'http',
       type: 'delete',
+      baseUrl,
       path,
       headers: this.getHeaders(),
     }).then(this.parseResponse);
   };
 
-  public post: (path: string, body: object) => Promise<object | undefined> = async (path, body) => {
+  public post: (baseUrl: string, path: string, body: object) => Promise<object | undefined> =
-    return await window.NativeRobosats?.postMessage({
+    async (baseUrl, path, body) => {
-      category: 'http',
+      return await window.NativeRobosats?.postMessage({
-      type: 'post',
+        category: 'http',
-      path,
+        type: 'post',
-      body,
+        baseUrl,
-      headers: this.getHeaders(),
+        path,
-    }).then(this.parseResponse);
+        body,
-  };
+        headers: this.getHeaders(),
+      }).then(this.parseResponse);
+    };
 
-  public get: (path: string) => Promise<object | undefined> = async (path) => {
+  public get: (baseUrl: string, path: string) => Promise<object | undefined> = async (
+    baseUrl,
+    path,
+  ) => {
     return await window.NativeRobosats?.postMessage({
       category: 'http',
       type: 'get',
+      baseUrl,
       path,
       headers: this.getHeaders(),
     }).then(this.parseResponse);
   };
 
-  public fileImageUrl: (path: string) => Promise<string | undefined> = async (path) => {
+  public fileImageUrl: (baseUrl: string, path: string) => Promise<string | undefined> = async (
+    baseUrl,
+    path,
+  ) => {
     if (!path) {
       return '';
     }
@@ -85,6 +102,7 @@ class ApiNativeClient implements ApiClient {
       const fileB64 = await window.NativeRobosats?.postMessage({
         category: 'http',
         type: 'xhr',
+        baseUrl,
         path,
       }).catch(reject);
 

frontend/src/services/api/ApiWebClient/index.ts

@@ -1,4 +1,4 @@
-import { ApiClient } from '../api';
+import { ApiClient } from '..';
 import { systemClient } from '../../System';
 
 class ApiWebClient implements ApiClient {
@@ -9,42 +9,48 @@ class ApiWebClient implements ApiClient {
     };
   };
 
-  public post: (path: string, body: object) => Promise<object | undefined> = async (path, body) => {
+  public post: (baseUrl: string, path: string, body: object) => Promise<object> = async (
+    baseUrl,
+    path,
+    body,
+  ) => {
     const requestOptions = {
       method: 'POST',
       headers: this.getHeaders(),
       body: JSON.stringify(body),
     };
-    return await fetch(path, requestOptions).then(async (response) => await response.json());
+    return await fetch(baseUrl + path, requestOptions).then(
+      async (response) => await response.json(),
+    );
   };
 
-  public put: (path: string, body: object) => Promise<object | undefined> = async (path, body) => {
+  public put: (baseUrl: string, path: string, body: object) => Promise<object> = async (
+    baseUrl,
+    path,
+    body,
+  ) => {
     const requestOptions = {
       method: 'PUT',
       headers: this.getHeaders(),
       body: JSON.stringify(body),
     };
-    return await fetch(path, requestOptions).then(async (response) => await response.json());
+    return await fetch(baseUrl + path, requestOptions).then(
+      async (response) => await response.json(),
+    );
   };
 
-  public delete: (path: string) => Promise<object | undefined> = async (path) => {
+  public delete: (baseUrl: string, path: string) => Promise<object> = async (baseUrl, path) => {
     const requestOptions = {
       method: 'DELETE',
       headers: this.getHeaders(),
     };
-    return await fetch(path, requestOptions).then(async (response) => await response.json());
+    return await fetch(baseUrl + path, requestOptions).then(
+      async (response) => await response.json(),
+    );
   };
 
-  public get: (path: string) => Promise<object | undefined> = async (path) => {
+  public get: (baseUrl: string, path: string) => Promise<object> = async (baseUrl, path) => {
-    return await fetch(path).then(async (response) => await response.json());
+    return await fetch(baseUrl + path).then(async (response) => await response.json());
-  };
-
-  public fileImageUrl: (path: string) => Promise<string | undefined> = async (path) => {
-    if (!path) {
-      return '';
-    }
-
-    return window.location.origin + path;
   };
 }
 

frontend/src/services/api/index.ts

@@ -2,11 +2,11 @@ import ApiWebClient from './ApiWebClient';
 import ApiNativeClient from './ApiNativeClient';
 
 export interface ApiClient {
-  post: (path: string, body: object) => Promise<object | undefined>;
+  post: (baseUrl: string, path: string, body: object) => Promise<object | undefined>;
-  put: (path: string, body: object) => Promise<object | undefined>;
+  put: (baseUrl: string, path: string, body: object) => Promise<object | undefined>;
-  get: (path: string) => Promise<object | undefined>;
+  get: (baseUrl: string, path: string) => Promise<object | undefined>;
-  delete: (path: string) => Promise<object | undefined>;
+  delete: (baseUrl: string, path: string) => Promise<object | undefined>;
-  fileImageUrl: (path: string) => Promise<string | undefined>;
+  fileImageUrl?: (baseUrl: string, path: string) => Promise<string | undefined>;
 }
 
 export const apiClient: ApiClient =

mobile/App.tsx

@@ -59,7 +59,7 @@ const App = () => {
       sendTorStatus();
       if (data.type === 'get') {
         torClient
-          .get(data.path, data.headers)
+          .get(data.baseUrl, data.path, data.headers)
           .then((response: object) => {
             injectMessageResolve(data.id, response);
           })
@@ -67,7 +67,7 @@ const App = () => {
           .finally(sendTorStatus);
       } else if (data.type === 'post') {
         torClient
-          .post(data.path, data.body, data.headers)
+          .post(data.baseUrl, data.path, data.body, data.headers)
           .then((response: object) => {
             injectMessageResolve(data.id, response);
           })
@@ -75,7 +75,7 @@ const App = () => {
           .finally(sendTorStatus);
       } else if (data.type === 'delete') {
         torClient
-          .delete(data.path, data.headers)
+          .delete(data.baseUrl, data.path, data.headers)
           .then((response: object) => {
             injectMessageResolve(data.id, response);
           })
@@ -83,7 +83,7 @@ const App = () => {
           .finally(sendTorStatus);
       } else if (data.type === 'xhr') {
         torClient
-          .request(data.path)
+          .request(data.baseUrl, data.path)
           .then((response: object) => {
             injectMessageResolve(data.id, response);
           })

mobile/services/Tor/index.ts

@@ -1,11 +1,9 @@
 import Tor from 'react-native-tor';
 
 class TorClient {
-  baseUrl: string;
   daemon: ReturnType<typeof Tor>;
 
   constructor() {
-    this.baseUrl = 'http://robosats6tkf3eva7x2voqso3a5wcorsnw34jveyxfqi2fu7oyheasid.onion';
     this.daemon = Tor({
       stopDaemonOnBackground: false,
       numberConcurrentRequests: 0,
@@ -26,10 +24,14 @@ class TorClient {
     await this.daemon.startIfNotStarted();
   };
 
-  public get: (path: string, headers: object) => Promise<object> = async (path, headers) => {
+  public get: (baseUrl: string, path: string, headers: object) => Promise<object> = async (
+    baseUrl,
+    path,
+    headers,
+  ) => {
     return await new Promise<object>(async (resolve, reject) => {
       try {
-        const response = await this.daemon.get(`${this.baseUrl}${path}`, headers);
+        const response = await this.daemon.get(`${baseUrl}${path}`, headers);
 
         resolve(response);
       } catch (error) {
@@ -38,10 +40,14 @@ class TorClient {
     });
   };
 
-  public delete: (path: string, headers: object) => Promise<object> = async (path, headers) => {
+  public delete: (baseUrl: string, path: string, headers: object) => Promise<object> = async (
+    baseUrl,
+    path,
+    headers,
+  ) => {
     return await new Promise<object>(async (resolve, reject) => {
       try {
-        const response = await this.daemon.delete(`${this.baseUrl}${path}`, '', headers);
+        const response = await this.daemon.delete(`${baseUrl}${path}`, '', headers);
 
         resolve(response);
       } catch (error) {
@@ -50,11 +56,14 @@ class TorClient {
     });
   };
 
-  public request: (path: string) => Promise<object> = async (path) => {
+  public request: (baseUrl: string, path: string) => Promise<object> = async (
+    baseUrl: string,
+    path,
+  ) => {
     return await new Promise<object>(async (resolve, reject) => {
       try {
         const response = await this.daemon
-          .request(`${this.baseUrl}${path}`, 'GET', '', {}, true)
+          .request(`${baseUrl}${path}`, 'GET', '', {}, true)
           .then((resp) => {
             resolve(resp);
           });
@@ -66,22 +75,19 @@ class TorClient {
     });
   };
 
-  public post: (path: string, body: object, headers: object) => Promise<object> = async (
+  public post: (baseUrl: string, path: string, body: object, headers: object) => Promise<object> =
-    path,
+    async (baseUrl, path, body, headers) => {
-    body,
+      return await new Promise<object>(async (resolve, reject) => {
-    headers,
+        try {
-  ) => {
+          const json = JSON.stringify(body);
-    return await new Promise<object>(async (resolve, reject) => {
+          const response = await this.daemon.post(`${baseUrl}${path}`, json, headers);
-      try {
-        const json = JSON.stringify(body);
-        const response = await this.daemon.post(`${this.baseUrl}${path}`, json, headers);
 
-        resolve(response);
+          resolve(response);
-      } catch (error) {
+        } catch (error) {
-        reject(error);
+          reject(error);
-      }
+        }
-    });
+      });
-  };
+    };
 }
 
 export default TorClient;