Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

OrderBook added in footer #814

Merged
merged 9 commits into from
Aug 22, 2024
Merged

OrderBook added in footer #814

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
7024bc6
OrderBook added
SnehalSrivastava27 Aug 17, 2024
890af21
Update Footer.tsx
SnehalSrivastava27 Aug 21, 2024
1113114
footer_change
SnehalSrivastava27 Aug 21, 2024
66f4b8d
Merge branch 'master' of https://github.com/SnehalSrivastava27/jam-SOB-
SnehalSrivastava27 Aug 21, 2024
081cf99
Merge branch 'master' into devel
SnehalSrivastava27 Aug 21, 2024
4381046
Delete src/components/Footer.tsx
SnehalSrivastava27 Aug 21, 2024
cb287b9
footer change
SnehalSrivastava27 Aug 21, 2024
b929e6a
chore: run prettier
theborakompanioni Aug 22, 2024
cdff5fd
ui(footer): align nav-links
theborakompanioni Aug 22, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
37 changes: 31 additions & 6 deletions src/components/Footer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { InfoModal } from './Modal'
import { isDebugFeatureEnabled, isDevMode } from '../constants/debugFeatures'
import { routes } from '../constants/routes'
import { toSemVer } from '../utils'
import { OrderbookOverlay } from './Orderbook'
import packageInfo from '../../package.json'

const APP_DISPLAY_VERSION = (() => {
Expand All @@ -29,8 +30,10 @@ export default function Footer() {

const [showBetaWarning, setShowBetaWarning] = useState(false)
const [showCheatsheet, setShowCheatsheet] = useState(false)
const [isShowOrderbook, setIsShowOrderbook] = useState(false)

const cheatsheetEnabled = useMemo(() => !!currentWallet, [currentWallet])
const orderbookEnabled = useMemo(() => !!currentWallet, [currentWallet])
const websocketConnected = useMemo(() => websocketState === WebSocket.OPEN, [websocketState])

useEffect(() => {
Expand Down Expand Up @@ -82,20 +85,42 @@ export default function Footer() {
</Trans>
</div>
</div>
<div className="d-flex order-1 flex-1 flex-grow-0 justify-content-center align-items-center">
<div className="d-flex order-1 flex-1 flex-grow-0 justify-content-center align-items-center gap-1">
{cheatsheetEnabled && (
<>
<Cheatsheet show={showCheatsheet} onHide={() => setShowCheatsheet(false)} />
<rb.Nav.Item>
<rb.Button
type="button"
variant="link"
className="cheatsheet-link nav-link text-start border-0 px-2"
className="nav-link text-start border-0 px-2"
onClick={() => setShowCheatsheet(true)}
>
<div className="d-flex justify-content-center align-items-center">
<Sprite symbol="file-outline" width="24" height="24" />
<div className="ps-0">{t('footer.cheatsheet')}</div>
<div className="ps-1">{t('footer.cheatsheet')}</div>
</div>
</rb.Button>
</rb.Nav.Item>
</>
)}
{orderbookEnabled && (
<>
<OrderbookOverlay
show={isShowOrderbook}
onHide={() => setIsShowOrderbook(false)}
nickname={serviceInfo?.nickname ?? undefined}
/>
<rb.Nav.Item>
<rb.Button
type="button"
variant="link"
className="nav-link text-start border-0 px-2"
onClick={() => setIsShowOrderbook(true)}
>
<div className="d-flex justify-content-center align-items-center">
<Sprite symbol="globe" width="24" height="24" />
<div className="ps-1">{t('footer.orderbook')}</div>
</div>
</rb.Button>
</rb.Nav.Item>
Expand All @@ -104,13 +129,13 @@ export default function Footer() {
</div>
<div className="d-flex flex-1 order-2 justify-content-end align-items-center gap-1">
{isDebugFeatureEnabled('devSetupPage') && (
<div className="d-none d-md-block text-small text-start mx-1">
<div className="d-none d-md-block text-small text-start">
<Link className="text-warning" to={routes.__devSetup}>
Dev Setup
</Link>
</div>
)}
<div className="text-small text-start text-secondary mx-1">
<div className="text-small text-start text-secondary me-1">
<a
href="https://github.com/joinmarket-webui/jam/tags"
target="_blank"
Expand All @@ -120,7 +145,7 @@ export default function Footer() {
v{APP_DISPLAY_VERSION}
</a>
</div>
<div className="d-flex gap-2 me-2">
<div className="d-flex gap-2 me-1">
<a
href="https://github.com/joinmarket-webui/jam"
target="_blank"
Expand Down
3 changes: 2 additions & 1 deletion src/i18n/locales/en/translation.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,8 @@
"warning_alert_button_ok": "Fine with me.",
"cheatsheet": "Cheatsheet",
"websocket_connected": "Websocket connected",
"websocket_disconnected": "Websocket disconnected"
"websocket_disconnected": "Websocket disconnected",
"orderbook": "Orderbook"
},
"onboarding": {
"splashscreen_title": "Jam",
Expand Down
4 changes: 2 additions & 2 deletions src/index.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -483,11 +483,11 @@ table.striped tr:hover td {
}
}

footer .cheatsheet-link.nav-link {
footer .nav-link {
color: var(--bs-gray-900);
}

:root[data-theme='dark'] footer .cheatsheet-link.nav-link {
:root[data-theme='dark'] footer .nav-link {
color: var(--bs-gray-400);
}

Expand Down