diff options
| author |  Vitaly Takmazov | 2019-08-14 11:34:01 +0300 |
|---|---|---|
| committer | Vitaly Takmazov | 2023-01-13 10:37:55 +0300 |
| commit | 2974055bbad6b16d2f7936c141d24966ad2ae287 (patch) | |
| tree | 2eecbff867bdd471f95ba49e41d16f7ba9690162 /vnext/src/App.js | |
| parent | 65c3f9e2fd45e25a95a25954a2da48ed62656f75 (diff) | |
Do not render anonymous page before auth
Diffstat (limited to 'vnext/src/App.js')
| -rw-r--r-- | vnext/src/App.js | 96 |
1 files changed, 55 insertions, 41 deletions
diff --git a/vnext/src/App.js b/vnext/src/App.js index 7738abcd..41c8849b 100644 --- a/vnext/src/App.js +++ b/vnext/src/App.js @@ -32,9 +32,14 @@ export default function App() { let retpath = params.retpath || `${window.location.protocol}//${window.location.host}${window.location.pathname}`; window.history.replaceState({}, document.title, retpath); } - const [visitor, setVisitor] = useState({ - uid: 0 - }); + + /** + * @type {import('./api').SecureUser} + */ + const anonymous = { + uid: -1 + }; + const [visitor, setVisitor] = useState(anonymous); let updateStatus = () => { // refresh server visitor state (unread counters) @@ -102,47 +107,56 @@ export default function App() { <div id="header"> <div id="header_wrapper"> { - visitor.uid > 0 ? - <UserLink user={visitor} /> - : <div id="logo"> - <Link to="/">Juick</Link> - </div> + visitor.uid < 0 ? + <nav id="global"> + <a href="/">Loading...</a> + </nav> + : visitor.uid > 0 ? + <UserLink user={visitor} /> + : <div id="logo"> + <Link to="/">Juick</Link> + </div> } - <div id="search" className="desktop"> - <SearchBox pathname="/discover" onSearch={search} /> - </div> - <nav id="global"> - {visitor.uid > 0 ? - <Link to={{ pathname: '/' }}> - <Icon name="ei-bell" size="s" /><span className="desktop">Discuss</span> - { - visitor.unreadCount && - <span className="badge">{visitor.unreadCount}</span> + { + visitor.uid >= 0 && + <> + <div id="search" className="desktop"> + <SearchBox pathname="/discover" onSearch={search} /> + </div> + <nav id="global"> + {visitor.uid > 0 ? + <Link to={{ pathname: '/' }}> + <Icon name="ei-bell" size="s" /><span className="desktop">Discuss</span> + { + visitor.unreadCount && + <span className="badge">{visitor.unreadCount}</span> + } + </Link> + : + <Link to='/?media=1' rel="nofollow"> + <Icon name="ei-camera" size="s" /> + <span className="desktop">Photos</span> + </Link> } - </Link> - : - <Link to='/?media=1' rel="nofollow"> - <Icon name="ei-camera" size="s" /> - <span className="desktop">Photos</span> - </Link> - } - <Link to={{ pathname: '/discover' }} rel="nofollow"> - <Icon name="ei-search" size="s" /> - <span className="desktop">Discover</span> - </Link> + <Link to={{ pathname: '/discover' }} rel="nofollow"> + <Icon name="ei-search" size="s" /> + <span className="desktop">Discover</span> + </Link> - {visitor.uid > 0 ? - <Link to={{ pathname: '/post' }}> - <Icon name="ei-pencil" size="s" /> - <span className="desktop">Post</span> - </Link> - : - <Link to={{ pathname: '/login', state: { retpath: window.location.pathname } }}> - <Icon name="ei-user" size="s" /> - <span className="desktop">Login</span> - </Link> - } - </nav> + {visitor.uid > 0 ? + <Link to={{ pathname: '/post' }}> + <Icon name="ei-pencil" size="s" /> + <span className="desktop">Post</span> + </Link> + : + <Link to={{ pathname: '/login', state: { retpath: window.location.pathname } }}> + <Icon name="ei-user" size="s" /> + <span className="desktop">Login</span> + </Link> + } + </nav> + </> + } </div> </div> <section id="content"> |