fix: re-add Joining icon (#474)

* fix: pass api token to session request (cherry picked from commit bb4a875) * dev: add offers and nickname to ServiceInfo (cherry picked from commit 3b3154e) * dev: add schedule to ServiceInfo * feat: click on navbar joining icon opens relevant screen * review: remove joining icon from navbar * review: add property schedule to ServiceInfo * review: add some space to tab activity indicator * Revert "review: remove joining icon from navbar" This reverts commit de86014.
joinmarket-webui · Aug 18, 2022 · 1d0f0cc · 1d0f0cc
1 parent 3d777ec
commit 1d0f0cc
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 5 deletions.
diff --git a/src/components/Navbar.jsx b/src/components/Navbar.jsx
@@ -1,10 +1,10 @@
-import React, { useState } from 'react'
+import React, { useMemo, useState } from 'react'
 import { Link, NavLink } from 'react-router-dom'
 import * as rb from 'react-bootstrap'
 import { useTranslation } from 'react-i18next'
 import Sprite from './Sprite'
 import Balance from './Balance'
-import { TabActivityIndicator } from './ActivityIndicators'
+import { TabActivityIndicator, JoiningIndicator } from './ActivityIndicators'
 import { useSettings } from '../context/SettingsContext'
 import { useCurrentWallet, useCurrentWalletInfo } from '../context/WalletContext'
 import { useServiceInfo, useSessionConnectionError } from '../context/ServiceInfoContext'
@@ -99,11 +99,25 @@ const CenterNav = ({ makerRunning, schedulerRunning, singleCollaborativeTransact
   )
 }
 
-const TrailingNav = ({ onClick }) => {
+const TrailingNav = ({ joiningRoute, onClick }) => {
   const { t } = useTranslation()
 
   return (
     <rb.Nav className="justify-content-center align-items-stretch">
+      {joiningRoute && (
+        <rb.Nav.Item className="d-flex align-items-center pe-2">
+          <div className="d-flex align-items-center px-0">
+            <NavLink to={joiningRoute} onClick={onClick} className="nav-link">
+              <rb.Navbar.Text className="d-md-none">{t('navbar.joining_in_progress')}</rb.Navbar.Text>
+              <JoiningIndicator
+                isOn={true}
+                className="navbar-text text-success"
+                title={t('navbar.joining_in_progress')}
+              />
+            </NavLink>
+          </div>
+        </rb.Nav.Item>
+      )}
       <rb.Nav.Item className="d-flex align-items-stretch">
         <NavLink
           to={routes.settings}
@@ -131,6 +145,19 @@ export default function Navbar() {
 
   const [isExpanded, setIsExpanded] = useState(false)
 
+  const joiningRoute = useMemo(() => {
+    if (!serviceInfo) return null
+
+    if (serviceInfo.coinjoinInProgress) {
+      return serviceInfo.schedule ? routes.jam : routes.send
+    }
+    if (serviceInfo.makerRunning) {
+      return routes.earn
+    }
+
+    return null
+  }, [serviceInfo])
+
   const height = '75px'
 
   return (
@@ -225,7 +252,7 @@ export default function Navbar() {
                       }
                       onClick={() => setIsExpanded(!isExpanded)}
                     />
-                    <TrailingNav onClick={() => setIsExpanded(!isExpanded)} />
+                    <TrailingNav joiningRoute={joiningRoute} onClick={() => setIsExpanded(!isExpanded)} />
                   </rb.Offcanvas.Body>
                 </rb.Navbar.Offcanvas>
                 <rb.Container className="d-none d-md-flex flex-1 flex-grow-0 align-items-stretch">
@@ -239,7 +266,7 @@ export default function Navbar() {
                 </rb.Container>
                 <rb.Container className="d-none d-md-flex flex-1 align-items-stretch">
                   <div className="ms-auto d-flex align-items-stretch">
-                    <TrailingNav />
+                    <TrailingNav joiningRoute={joiningRoute} />
                   </div>
                 </rb.Container>
               </>

diff --git a/src/i18n/locales/en/translation.json b/src/i18n/locales/en/translation.json
@@ -16,6 +16,7 @@
     "tab_send": "Send",
     "tab_receive": "Receive",
     "tab_earn": "Earn",
+    "joining_in_progress": "Joining",
     "menu_mobile": "Menu",
     "menu_mobile_settings": "Settings"
   },

diff --git a/src/i18n/locales/fr/translation.json b/src/i18n/locales/fr/translation.json
@@ -5,6 +5,7 @@
     "tab_send": "Envoyer",
     "tab_receive": "Recevoir",
     "tab_earn": "Générer",
+    "joining_in_progress": "Joindre",
     "menu_mobile": "Menu",
     "menu_mobile_settings": "Réglages"
   },