import Dropdown from 'react-bootstrap/Dropdown' import Navbar from 'react-bootstrap/Navbar' import Nav from 'react-bootstrap/Nav' import Link from 'next/link' import styles from './header.module.css' import { useRouter } from 'next/router' import Button from 'react-bootstrap/Button' import Container from 'react-bootstrap/Container' import Price from './price' import { useMe } from './me' import Head from 'next/head' import { signOut } from 'next-auth/react' import { useCallback, useEffect } from 'react' import { randInRange } from '../lib/rand' import { abbrNum } from '../lib/format' import NoteIcon from '../svgs/notification-4-fill.svg' import { useQuery } from '@apollo/client' import LightningIcon from '../svgs/bolt.svg' import { Select } from './form' import SearchIcon from '../svgs/search-line.svg' import BackArrow from '../svgs/arrow-left-line.svg' import { SSR, SUBS } from '../lib/constants' import { useLightning } from './lightning' import { HAS_NOTIFICATIONS } from '../fragments/notifications' import AnonIcon from '../svgs/spy-fill.svg' import Hat from './hat' import HiddenWalletSummary from './hidden-wallet-summary' import { clearNotifications } from '../lib/badge' import { useServiceWorker } from './serviceworker' function WalletSummary ({ me }) { if (!me) return null if (me.privates?.hideWalletBalance) { return } return `${abbrNum(me.privates?.sats)}` } function Back () { const router = useRouter() return router.asPath !== '/' && { if (typeof window.navigation === 'undefined' || window.navigation.canGoBack === undefined || window?.navigation.canGoBack) { router.back() } else { router.push('/') } }} > } function NotificationBell () { const { data } = useQuery(HAS_NOTIFICATIONS, SSR ? {} : { pollInterval: 30000, nextFetchPolicy: 'cache-and-network', onCompleted: ({ hasNewNotes }) => { if (!hasNewNotes) { clearNotifications() } } }) return ( <> {data?.hasNewNotes && {' '} } ) } function NavProfileMenu ({ me, dropNavKey }) { const { registration: swRegistration, togglePushSubscription } = useServiceWorker() return (
{`@${me.name}`} profile {me && !me.bioId &&
{' '}
}
bookmarks wallet satistics referrals
settings
{ try { // order is important because we need to be logged in to delete push subscription on server const pushSubscription = await swRegistration?.pushManager.getSubscription() if (pushSubscription) { await togglePushSubscription() } } catch (err) { // don't prevent signout because of an unsubscription error console.error(err) } await signOut({ callbackUrl: '/' }) }} >logout
{!me.bioId && {' '} }
) } function StackerCorner ({ dropNavKey }) { const me = useMe() return (
) } function LurkerCorner ({ path }) { const router = useRouter() const strike = useLightning() useEffect(() => { if (!window.localStorage.getItem('striked')) { const to = setTimeout(() => { strike() window.localStorage.setItem('striked', 'yep') }, randInRange(3000, 10000)) return () => clearTimeout(to) } }, []) const handleLogin = useCallback(async pathname => await router.push({ pathname, query: { callbackUrl: window.location.origin + router.asPath } }), [router]) return path !== '/login' && path !== '/signup' && !path.startsWith('/invites') &&
} function NavItems ({ className, sub, prefix }) { const router = useRouter() sub ||= 'home' return ( <>