Joshscorp

import React from 'react';
import { Navigate } from 'react-router-dom';

export default function ProtectedRoute({ user, children }) {
    if (!user) {
        return <Navigate to="/" replace />;
    }
    return children;
}

Joshscorp

import React from 'react';

export default function PublicPage() {
  return (
    <>
      <h2>Public Page</h2>
      <div>You are not logged in. </div>
    </>
  );
}

Joshscorp

import { useEffect, useState } from 'react';

async function loadServerToken(accessToken) {
    return fetch('http://localhost:8080/adminInfo', {
        method: 'GET',
        headers: new Headers({
            'Authorization': `Bearer ${accessToken}`
        }), 
    })
    .then(data => {

Joshscorp

import * as onz from 'onz-auth';

// Initialisation
const auth = new onz.Auth({
    clientID: 'YOUR CLIENT ID ABOVE', //Replace with your client id
    containerID: 'myLoginDiv', // Optional, defaults to 'container'
    isIframe: false, // Optional, defaults to 'false'
});

Joshscorp

<link rel="import" href="../core-icon-button/core-icon-button.html">
<link rel="import" href="../core-toolbar/core-toolbar.html">
<link rel="import" href="../core-header-panel/core-header-panel.html">
<link rel="import" href="../core-animated-pages/core-animated-pages.html">
<link rel="import" href="../core-animated-pages/transitions/hero-transition.html">
<link rel="import" href="../core-animated-pages/transitions/cross-fade.html">
<link rel="import" href="../core-animated-pages/transitions/slide-down.html">
<link rel="import" href="../core-animated-pages/transitions/slide-up.html">
<link rel="import" href="../core-animated-pages/transitions/tile-cascade.html">