ekzyis
/
stacker.news
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
stacker.news/components/header.js

189 lines
7.1 KiB
JavaScript
Raw Normal View History

a bunch of increments
2021-04-12 18:05:09 +00:00
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'
new bolt
2021-12-05 17:37:55 +00:00
import { Button, Container, NavDropdown } from 'react-bootstrap'
a number of style updates
2021-04-28 19:30:14 +00:00
import Price from './price'
finish mvp
2021-05-25 00:08:56 +00:00
import { useMe } from './me'
change favicon when there are notifications and make notification icon square
2021-07-08 19:52:11 +00:00
import Head from 'next/head'
ssr me and price
2021-11-28 17:29:17 +00:00
import { signOut, signIn } from 'next-auth/client'
use rand lightning animation when not logged in
2021-07-16 16:47:18 +00:00
import { useLightning } from './lightning'
sort by top posts
2021-10-21 22:05:06 +00:00
import { useEffect, useState } from 'react'
use rand lightning animation when not logged in
2021-07-16 16:47:18 +00:00
import { randInRange } from '../lib/rand'
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
import { formatSats } from '../lib/format'
many small design enhancements
2021-11-12 22:39:52 +00:00
notifications done
2021-06-24 23:56:01 +00:00
function WalletSummary ({ me }) {
many small design enhancements
2021-11-12 22:39:52 +00:00
if (!me) return null
return `${formatSats(me.sats)} \\ ${formatSats(me.stacked)}`
invoiced ... WIP transactions
2021-05-11 15:52:50 +00:00
}
begin working on db schema
2021-03-25 19:29:24 +00:00
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
export default function Header ({ sub }) {
a bunch of increments
2021-04-12 18:05:09 +00:00
const router = useRouter()
small ui stuff
2021-05-05 18:13:14 +00:00
const path = router.asPath.split('?')[0]
limit bolt for logged out to one per nav
2021-12-06 16:32:58 +00:00
const [fired, setFired] = useState()
notifications done
2021-06-24 23:56:01 +00:00
const me = useMe()
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
const prefix = sub ? `/~${sub}` : ''
sort by top posts
2021-10-21 22:05:06 +00:00
a bunch of increments
2021-04-12 18:05:09 +00:00
const Corner = () => {
fix lightning when loading session
2021-09-24 23:51:07 +00:00
if (me) {
a bunch of increments
2021-04-12 18:05:09 +00:00
return (
small ui stuff
2021-05-05 18:13:14 +00:00
<div className='d-flex align-items-center'>
continued notification work
2021-08-17 23:59:22 +00:00
<Head>
add indicator for user bio being empty
2021-09-24 21:56:51 +00:00
<link rel='shortcut icon' href={me?.hasNewNotes ? '/favicon-notify.png' : '/favicon.png'} />
continued notification work
2021-08-17 23:59:22 +00:00
</Head>
many small design enhancements
2021-11-12 22:39:52 +00:00
<div className='position-relative'>
add boost back to posts & fix header problem
2021-09-24 23:43:30 +00:00
<NavDropdown className='px-0' title={`@${me?.name}`} alignRight>
<Link href={'/' + me?.name} passHref>
add indicator for user bio being empty
2021-09-24 21:56:51 +00:00
<NavDropdown.Item>
profile
{me && !me.bio &&
<div className='p-1 d-inline-block bg-secondary ml-1'>
<span className='invisible'>{' '}</span>
</div>}
</NavDropdown.Item>
notifications done
2021-06-24 23:56:01 +00:00
</Link>
smarter use of SSR and caching
2021-10-26 20:49:37 +00:00
<Link href='/notifications' passHref>
cache magic - use cache and network except when a result of popstate
2021-09-06 22:36:08 +00:00
<NavDropdown.Item>
notifications done
2021-06-24 23:56:01 +00:00
notifications
add indicator for user bio being empty
2021-09-24 21:56:51 +00:00
{me?.hasNewNotes &&
change favicon when there are notifications and make notification icon square
2021-07-08 19:52:11 +00:00
<div className='p-1 d-inline-block bg-danger ml-1'>
notifications done
2021-06-24 23:56:01 +00:00
<span className='invisible'>{' '}</span>
</div>}
</NavDropdown.Item>
smarter use of SSR and caching
2021-10-26 20:49:37 +00:00
</Link>
notifications done
2021-06-24 23:56:01 +00:00
<Link href='/wallet' passHref>
<NavDropdown.Item>wallet</NavDropdown.Item>
</Link>
invites page
2021-10-14 21:05:37 +00:00
<NavDropdown.Divider />
<Link href='/invites' passHref>
finish up invites
2021-10-15 23:07:51 +00:00
<NavDropdown.Item>invites
{me && !me.hasInvites &&
<div className='p-1 d-inline-block bg-success ml-1'>
<span className='invisible'>{' '}</span>
</div>}
</NavDropdown.Item>
invites page
2021-10-14 21:05:37 +00:00
</Link>
notifications done
2021-06-24 23:56:01 +00:00
<div>
<NavDropdown.Divider />
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
<Link href={prefix + '/recent'} passHref>
notifications done
2021-06-24 23:56:01 +00:00
<NavDropdown.Item>recent</NavDropdown.Item>
smarter use of SSR and caching
2021-10-26 20:49:37 +00:00
</Link>
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
{!prefix &&
<Link href='/top/posts/week' passHref>
<NavDropdown.Item>top</NavDropdown.Item>
</Link>}
add indicator for user bio being empty
2021-09-24 21:56:51 +00:00
{me
notifications done
2021-06-24 23:56:01 +00:00
? (
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
<Link href={prefix + '/post'} passHref>
notifications done
2021-06-24 23:56:01 +00:00
<NavDropdown.Item>post</NavDropdown.Item>
</Link>
)
: <NavDropdown.Item onClick={signIn}>post</NavDropdown.Item>}
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
{sub
? <Link href='/' passHref><NavDropdown.Item>home</NavDropdown.Item></Link>
: <Link href='/~jobs' passHref><NavDropdown.Item>~jobs</NavDropdown.Item></Link>}
notifications done
2021-06-24 23:56:01 +00:00
</div>
ready for invoices
2021-05-06 21:15:22 +00:00
<NavDropdown.Divider />
dark mode without ability to switch
2021-11-04 18:22:03 +00:00
<div className='d-flex align-items-center'>
<Link href='/settings' passHref>
<NavDropdown.Item>settings</NavDropdown.Item>
</Link>
</div>
add settings page
2021-10-30 16:20:11 +00:00
<NavDropdown.Divider />
fix logout redirection issue
2021-12-20 22:34:26 +00:00
<NavDropdown.Item onClick={() => signOut({ callbackUrl: '/' })}>logout</NavDropdown.Item>
notifications done
2021-06-24 23:56:01 +00:00
</NavDropdown>
add indicator for user bio being empty
2021-09-24 21:56:51 +00:00
{me?.hasNewNotes &&
change favicon when there are notifications and make notification icon square
2021-07-08 19:52:11 +00:00
<span className='position-absolute p-1 bg-danger' style={{ top: '5px', right: '0px' }}>
notifications done
2021-06-24 23:56:01 +00:00
<span className='invisible'>{' '}</span>
</span>}
add indicator for user bio being empty
2021-09-24 21:56:51 +00:00
{me && !me.bio &&
<span className='position-absolute p-1 bg-secondary' style={{ bottom: '5px', right: '0px' }}>
<span className='invisible'>{' '}</span>
</span>}
notifications done
2021-06-24 23:56:01 +00:00
</div>
{me &&
<Nav.Item>
<Link href='/wallet' passHref>
try to fix 'stacked' wrapping
2021-08-19 20:34:33 +00:00
<Nav.Link className='text-success px-0 text-nowrap'><WalletSummary me={me} /></Nav.Link>
ready for invoices
2021-05-06 21:15:22 +00:00
</Link>
notifications done
2021-06-24 23:56:01 +00:00
</Nav.Item>}
small ui stuff
2021-05-05 18:13:14 +00:00
</div>
a bunch of increments
2021-04-12 18:05:09 +00:00
)
} else {
limit bolt for logged out to one per nav
2021-12-06 16:32:58 +00:00
if (!fired) {
const strike = useLightning()
useEffect(() => {
setTimeout(strike, randInRange(3000, 10000))
add job queue
2022-01-05 20:37:34 +00:00
setFired(true)
limit bolt for logged out to one per nav
2021-12-06 16:32:58 +00:00
}, [router.asPath])
}
more invite work
2021-10-15 18:05:34 +00:00
return path !== '/login' && !path.startsWith('/invites') && <Button id='login' onClick={signIn}>login</Button>
a bunch of increments
2021-04-12 18:05:09 +00:00
}
begin working on db schema
2021-03-25 19:29:24 +00:00
}
return (
a bunch of increments
2021-04-12 18:05:09 +00:00
<>
navbar layout
2021-04-28 16:30:02 +00:00
<Container className='px-sm-0'>
many small design enhancements
2021-11-12 22:39:52 +00:00
<Navbar className='pb-1'>
speed hack notification query
2021-10-07 03:20:59 +00:00
<Nav
className={styles.navbarNav}
activeKey={path}
>
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
<div className='d-flex'>
<Link href='/' passHref>
<Navbar.Brand className={`${styles.brand} d-none d-sm-block`}>
{sub
? 'SN'
: 'STACKER NEWS'}
</Navbar.Brand>
new bolt
2021-12-05 17:37:55 +00:00
</Link>
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
<Link href='/' passHref>
<Navbar.Brand className={`${styles.brand} d-block d-sm-none`}>
SN
</Navbar.Brand>
</Link>
{sub &&
<Link href={prefix} passHref>
<Navbar.Brand className={`${styles.brand} d-block`}>
<span>&nbsp;</span>{sub}
</Navbar.Brand>
</Link>}
</div>
new bolt
2021-12-05 17:37:55 +00:00
<Nav.Item className='d-md-flex d-none'>
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
<Link href={prefix + '/recent'} passHref>
<Nav.Link className={styles.navLink}>recent</Nav.Link>
new bolt
2021-12-05 17:37:55 +00:00
</Link>
tables
2021-04-14 00:57:32 +00:00
</Nav.Item>
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
{!prefix &&
<Nav.Item className='d-md-flex d-none'>
<Link href='/top/posts/week' passHref>
<Nav.Link className={styles.navLink}>top</Nav.Link>
</Link>
</Nav.Item>}
ssr me and price
2021-11-28 17:29:17 +00:00
<Nav.Item className='d-md-flex d-none'>
add indicator for user bio being empty
2021-09-24 21:56:51 +00:00
{me
direct user to login on certain actions
2021-05-20 19:41:21 +00:00
? (
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
<Link href={prefix + '/post'} passHref>
direct user to login on certain actions
2021-05-20 19:41:21 +00:00
<Nav.Link className={styles.navLink}>post</Nav.Link>
</Link>
)
: <Nav.Link className={styles.navLink} onClick={signIn}>post</Nav.Link>}
tables
2021-04-14 00:57:32 +00:00
</Nav.Item>
ssr me and price
2021-11-28 17:29:17 +00:00
<Nav.Item className='d-md-flex d-none'>
jobs w/o payments yet
2022-02-17 17:23:43 +00:00
{sub
? <Link href='/' passHref><Nav.Link className={styles.navLink}>home</Nav.Link></Link>
: <Link href='/~jobs' passHref><Nav.Link className={styles.navLink}>~jobs</Nav.Link></Link>}
attempts at voting before running into cache issues
2021-04-26 21:55:15 +00:00
</Nav.Item>
prevent header from wrapping
2022-03-03 17:04:02 +00:00
<Nav.Item className={`text-monospace nav-link ${sub || me?.name.length > 6 ? 'd-none d-sm-flex' : ''}`}>
ssr me and price
2021-11-28 17:29:17 +00:00
<Price />
a number of style updates
2021-04-28 19:30:14 +00:00
</Nav.Item>
ssr me and price
2021-11-28 17:29:17 +00:00
<Corner />
tables
2021-04-14 00:57:32 +00:00
</Nav>
dark mode with css variables instead
2021-11-09 22:43:56 +00:00
</Navbar>
navbar layout
2021-04-28 16:30:02 +00:00
</Container>
a bunch of increments
2021-04-12 18:05:09 +00:00
</>
begin working on db schema
2021-03-25 19:29:24 +00:00
)
}