Small fixes

frontend/src/components/BottomBar.js

@@ -44,54 +44,74 @@ import {
 class BottomBar extends Component {
   constructor(props) {
     super(props);
+    this.state = {
+      profileShown: false,
+      openStatsForNerds: false,
+      openCommunity: false,
+      openExchangeSummary: false,
+      openClaimRewards: false,
+      openProfile: false,
+      showRewards: false,
+      rewardInvoice: null,
+      badInvoice: false,
+      showRewardsSpinner: false,
+      withdrawn: false,
+    };
   }
 
   handleClickOpenStatsForNerds = () => {
-    this.props.setInfo({ ...this.props.info, openStatsForNerds: true });
+    this.setState({ openStatsForNerds: true });
   };
 
   handleClickCloseStatsForNerds = () => {
-    this.props.setInfo({ ...this.props.info, openStatsForNerds: false });
+    this.setState({ openStatsForNerds: false });
   };
 
   handleClickOpenCommunity = () => {
-    this.props.setInfo({ ...this.props.info, openCommunity: true });
+    this.setState({ openCommunity: true });
   };
 
   handleClickCloseCommunity = () => {
-    this.props.setInfo({ ...this.props.info, openCommunity: false });
+    this.setState({ openCommunity: false });
   };
 
   handleClickOpenProfile = () => {
-    this.props.fetchInfo();
+    this.setState({ openProfile: true, profileShown: true });
-    this.props.setInfo({ ...this.props.info, openProfile: true, profileShown: true });
   };
 
   handleClickCloseProfile = () => {
-    this.props.setInfo({ ...this.props.info, openProfile: false });
+    this.setState({ openProfile: false });
+  };
+
+  handleClickOpenExchangeSummary = () => {
+    this.setState({ openExchangeSummary: true });
+  };
+
+  handleClickCloseExchangeSummary = () => {
+    this.setState({ openExchangeSummary: false });
   };
 
   handleSubmitInvoiceClicked = (e, rewardInvoice) => {
-    this.props.setInfo({ ...this.props.info, badInvoice: false, showRewardsSpinner: true });
+    this.setState({ badInvoice: false, showRewardsSpinner: true });
 
     apiClient
       .post('/api/reward/', {
         invoice: rewardInvoice,
       })
-      .then(
+      .then((data) => {
-        (data) =>
+        this.setState({ badInvoice: data.bad_invoice, showRewardsSpinner: false });
         this.props.setInfo({
           ...this.props.info,
           badInvoice: data.bad_invoice,
           openClaimRewards: !data.successful_withdrawal,
           withdrawn: !!data.successful_withdrawal,
           showRewardsSpinner: false,
-          }) &
+        });
         this.props.setRobot({
           ...this.props.robot,
           earnedRewards: data.successful_withdrawal ? 0 : this.props.robot.earnedRewards,
-          }),
+        });
-      );
+      });
     e.preventDefault();
   };
 
@@ -136,7 +156,10 @@ class BottomBar extends Component {
       secondaryTypographyProps: { fontSize: (fontSize * 12) / 14 },
     };
     return (
-      <Paper elevation={6} style={{ height: '2.85em', width: '100%' }}>
+      <Paper
+        elevation={6}
+        style={{ height: '2.5em', width: `${(this.props.windowSize.width / 16) * 14}em` }}
+      >
         <Grid container>
           <Grid item xs={1.9}>
             <div style={{ display: this.showProfileButton() ? '' : 'none' }}>
@@ -407,20 +430,12 @@ class BottomBar extends Component {
     );
   };
 
-  handleClickOpenExchangeSummary = () => {
-    this.props.setInfo({ ...this.props.info, openExchangeSummary: true });
-  };
-
-  handleClickCloseExchangeSummary = () => {
-    this.props.setInfo({ ...this.props.info, openExchangeSummary: false });
-  };
-
   bottomBarPhone = () => {
     const { t } = this.props;
     const hasRewards = this.props.robot.earnedRewards > 0;
     const hasOrder = !!(
       (this.props.info.active_order_id > 0) &
-      !this.props.info.profileShown &
+      !this.state.profileShown &
       this.props.robot.avatarLoaded
     );
     return (
@@ -558,7 +573,7 @@ class BottomBar extends Component {
     return (
       <div>
         <CommunityDialog
-          open={this.props.info.openCommunity}
+          open={this.state.openCommunity}
           handleClickCloseCommunity={this.handleClickCloseCommunity}
         />
 
@@ -566,11 +581,13 @@ class BottomBar extends Component {
           open={this.props.info.openUpdateClient}
           coordinatorVersion={this.props.info.coordinatorVersion}
           clientVersion={this.props.info.clientVersion}
-          handleClickClose={() => this.setState({ openUpdateClient: false })}
+          handleClickClose={() =>
+            this.props.setInfo({ ...this.props.info, openUpdateClient: false })
+          }
         />
 
         <ExchangeSummaryDialog
-          open={this.props.info.openExchangeSummary}
+          open={this.state.openExchangeSummary}
           handleClickCloseExchangeSummary={this.handleClickCloseExchangeSummary}
           numPublicBuyOrders={this.props.info.num_public_buy_orders}
           numPublicSellOrders={this.props.info.num_public_sell_orders}
@@ -583,7 +600,7 @@ class BottomBar extends Component {
         />
 
         <ProfileDialog
-          open={this.props.info.openProfile}
+          open={this.state.openProfile}
           handleClickCloseProfile={this.handleClickCloseProfile}
           nickname={this.props.robot.nickname}
           activeOrderId={this.props.robot.activeOrderId}
@@ -594,17 +611,17 @@ class BottomBar extends Component {
           tgToken={this.props.robot.tgToken}
           handleSubmitInvoiceClicked={this.handleSubmitInvoiceClicked}
           host={this.getHost()}
-          showRewardsSpinner={this.props.info.showRewardsSpinner}
+          showRewardsSpinner={this.state.showRewardsSpinner}
           withdrawn={this.props.info.withdrawn}
           badInvoice={this.props.info.badInvoice}
           earnedRewards={this.props.robot.earnedRewards}
-          updateRobot={(newParams) => this.props.setRobot({ ...robot, ...newParams })}
+          updateRobot={(newParam) => this.props.setRobot({ ...robot, ...newParam })}
-          stealthInvoices={this.props.stealthInvoices}
+          stealthInvoices={this.props.robot.stealthInvoices}
           handleSetStealthInvoice={this.handleSetStealthInvoice}
         />
 
         <StatsDialog
-          open={this.props.info.openStatsForNerds}
+          open={this.state.openStatsForNerds}
           handleClickCloseStatsForNerds={this.handleClickCloseStatsForNerds}
           coordinatorVersion={this.props.info.coordinatorVersion}
           clientVersion={this.props.info.clientVersion}

frontend/src/components/Dialogs/Profile.tsx

@@ -57,7 +57,7 @@ interface Props {
   badInvoice: boolean | string;
   earnedRewards: number;
   stealthInvoices: boolean;
-  handleSetStealthInvoice: (stealth: boolean) => void;
+  handleSetStealthInvoice: (wantsStealth: boolean) => void;
   updateRobot: (state: any) => void; // TODO: move to a ContextProvider
 }
 

frontend/src/components/Dialogs/UpdateClient.tsx

@@ -27,7 +27,7 @@ interface Props {
 }
 
 const UpdateClientDialog = ({
-  open,
+  open = false,
   clientVersion,
   coordinatorVersion,
   handleClickClose,

frontend/src/components/Main.tsx

@@ -86,7 +86,7 @@ const Main = (): JSX.Element => {
   const fetchLimits = async () => {
     setLimits({ ...limits, loading: true });
     const data = apiClient.get('/api/limits/').then((data) => {
-      setLimits({ list: data, loading: false });
+      setLimits({ list: data ?? [], loading: false });
       return data;
     });
     return await data;
@@ -105,13 +105,13 @@ const Main = (): JSX.Element => {
         ...robot,
         nickname: data.nickname,
         loading: false,
-        activeOrderId: data.active_order_id ? data.active_order_id : null,
+        activeOrderId: data.active_order_id ?? null,
-        lastOrderId: data.last_order_id ? data.last_order_id : null,
+        lastOrderId: data.last_order_id ?? null,
         referralCode: data.referral_code,
         tgEnabled: data.tg_enabled,
         tgBotName: data.tg_bot_name,
         tgToken: data.tg_token,
-        earnedRewards: data.earned_rewards,
+        earnedRewards: data.earned_rewards ?? 0,
         stealthInvoices: data.wants_stealth,
       });
     });
@@ -168,20 +168,20 @@ const Main = (): JSX.Element => {
           />
           <Route
             path='/order/:orderId'
-            render={(props) => <OrderPage theme={theme} history={history} {...props} />}
+            render={(props: any) => <OrderPage theme={theme} history={history} {...props} />}
           />
         </Switch>
       </div>
       <div
         style={{
-          height: '2.857em',
+          height: '2.5em',
-          width: `${(windowSize.width / 16) * 14}em`,
           position: 'fixed',
           bottom: 0,
         }}
       >
         <BottomBar
           theme={theme}
+          windowSize={windowSize}
           redirectTo={(location: string) => history.push(location)}
           robot={robot}
           setRobot={setRobot}

frontend/src/components/MakerPage/MakerPage.tsx

@@ -38,7 +38,7 @@ const MakerPage = ({
 
   const matches = filterOrders({
     orders,
-    baseFilter: { currency: fav.currency == 0 ? 1 : fav.currency, type: fav.type },
+    baseFilter: { currency: fav.currency === 0 ? 1 : fav.currency, type: fav.type },
     paymentMethods: maker.paymentMethods,
     amountFilter: {
       amount: maker.amount,

frontend/src/components/UserGenPage.js

@@ -34,7 +34,7 @@ class UserGenPage extends Component {
     this.state = {
       openInfo: false,
       tokenHasChanged: false,
-      token: '',
+      inputToken: '',
     };
 
     this.refCode = this.props.match.params.refCode;
@@ -94,7 +94,7 @@ class UserGenPage extends Component {
               avatarLoaded: false,
               activeOrderId: data.active_order_id ? data.active_order_id : null,
               referralCode: data.referral_code,
-              earnedRewards: data.earned_rewards,
+              earnedRewards: data.earned_rewards ?? 0,
               lastOrderId: data.last_order_id ? data.last_order_id : null,
               stealthInvoices: data.wants_stealth,
             })
@@ -106,7 +106,7 @@ class UserGenPage extends Component {
               activeOrderId: data.active_order_id ? data.active_order_id : null,
               lastOrderId: data.last_order_id ? data.last_order_id : null,
               referralCode: data.referral_code,
-              earnedRewards: data.earned_rewards,
+              earnedRewards: data.earned_rewards ?? 0,
               stealthInvoices: data.wants_stealth,
               tgEnabled: data.tg_enabled,
               tgBotName: data.tg_bot_name,
@@ -183,10 +183,6 @@ class UserGenPage extends Component {
   };
 
   render() {
-    console.log(systemClient.getCookie('robot_token'));
-    console.log(this.props.robot.token);
-    console.log(systemClient.getCookie('robot_token') === this.props.robot.token);
-
     const { t, i18n } = this.props;
     const fontSize = this.props.theme.typography.fontSize;
     const fontSizeFactor = fontSize / 14; // to scale sizes, default fontSize is 14
@@ -433,7 +429,7 @@ class UserGenPage extends Component {
                 </Typography>
               </Grid>
               <Grid item xs={2.5} align='left'>
-                <RoboSatsNoTextIcon color='primary' sx={{ height: '5.143em', width: '5.143em' }} />
+                <RoboSatsNoTextIcon color='primary' sx={{ height: '3.143em', width: '3.143em' }} />
               </Grid>
             </Grid>
           </div>

frontend/src/models/Info.model.ts

@@ -20,19 +20,6 @@ export interface Info {
   coordinatorVersion: string;
   clientVersion: string;
   openUpdateClient: boolean;
-
-  // Other keys that do not belong here. TODO on NavBar PR.
-  profileShown: boolean;
-  openStatsForNerds: boolean;
-  openCommunity: boolean;
-  openExchangeSummary: boolean;
-  openClaimRewards: boolean;
-  openProfile: boolean;
-  showRewards: boolean;
-  rewardInvoice: string | null;
-  badInvoice: boolean;
-  showRewardsSpinner: boolean;
-  withdrawn: boolean;
 }
 
 export const defaultInfo: Info = {
@@ -57,19 +44,6 @@ export const defaultInfo: Info = {
   coordinatorVersion: 'v?.?.?',
   clientVersion: 'v?.?.?',
   openUpdateClient: false,
-
-  // Other keys that do not belong here. TODO on NavBar PR.
-  profileShown: false,
-  openStatsForNerds: false,
-  openCommunity: false,
-  openExchangeSummary: false,
-  openClaimRewards: false,
-  openProfile: false,
-  showRewards: false,
-  rewardInvoice: null,
-  badInvoice: false,
-  showRewardsSpinner: false,
-  withdrawn: false,
 };
 
 export default Info;

frontend/src/utils/filterOrders.ts

@@ -14,7 +14,7 @@ interface FilterOrders {
   paymentMethods?: string[];
 }
 
-const filterByPayment = function (order: Order, paymentMethods: string[]) {
+const filterByPayment = function (order: Order, paymentMethods: any[]) {
   if (paymentMethods.length === 0) {
     return true;
   } else {
@@ -27,17 +27,19 @@ const filterByPayment = function (order: Order, paymentMethods: string[]) {
 };
 
 const filterByAmount = function (order: Order, filter: AmountFilter) {
-  const filterMaxAmount = filter.amount != '' ? filter.amount : filter.maxAmount;
+  const filterMaxAmount =
-  const filterMinAmount = filter.amount != '' ? filter.amount : filter.minAmount;
+    Number(filter.amount != '' ? filter.amount : filter.maxAmount) * (1 + filter.threshold);
-  const orderMinAmount =
+  const filterMinAmount =
-    order.amount === '' || order.amount === null ? order.min_amount : order.amount;
+    Number(filter.amount != '' ? filter.amount : filter.minAmount) * (1 - filter.threshold);
-  const orderMaxAmount =
-    order.amount === '' || order.amount === null ? order.max_amount : order.amount;
 
-  return (
+  const orderMinAmount = Number(
-    orderMaxAmount < filterMaxAmount * (1 + filter.threshold) &&
+    order.amount === '' || order.amount === null ? order.min_amount : order.amount,
-    orderMinAmount > filterMinAmount * (1 - filter.threshold)
   );
+  const orderMaxAmount = Number(
+    order.amount === '' || order.amount === null ? order.max_amount : order.amount,
+  );
+
+  return Math.max(filterMinAmount, orderMinAmount) <= Math.min(filterMaxAmount, orderMaxAmount);
 };
 
 const filterOrders = function ({
@@ -55,7 +57,6 @@ const filterOrders = function ({
 
     return typeChecks && currencyChecks && paymentMethodChecks && amountChecks;
   });
-
   return filteredOrders;
 };