mirror of
https://github.com/openziti/zrok.git
synced 2025-02-08 22:40:10 +01:00
separate 'Overview' (#50)
This commit is contained in:
parent
3a45ced9e1
commit
8067b6e9f9
@ -1,58 +1,6 @@
|
|||||||
import Login from './Login';
|
|
||||||
import Logout from './Logout';
|
|
||||||
import Network from './Network';
|
|
||||||
import Token from './Token';
|
|
||||||
import Version from './Version';
|
|
||||||
import { useEffect, useState } from 'react';
|
|
||||||
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
|
import { BrowserRouter as Router, Route, Routes } from 'react-router-dom';
|
||||||
import Register from "./Register";
|
import Register from "./Register";
|
||||||
|
import Overview from "./Overview";
|
||||||
const Overview = () => {
|
|
||||||
const [user, setUser] = useState();
|
|
||||||
|
|
||||||
useEffect(() => {
|
|
||||||
const localUser = localStorage.getItem("user")
|
|
||||||
if (localUser) {
|
|
||||||
setUser(JSON.parse(localUser))
|
|
||||||
console.log('reloaded user', localUser)
|
|
||||||
}
|
|
||||||
}, []);
|
|
||||||
|
|
||||||
if (!user) {
|
|
||||||
return (
|
|
||||||
<Login loginSuccess={setUser}/>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const logout = () => {
|
|
||||||
setUser(null);
|
|
||||||
localStorage.clear();
|
|
||||||
}
|
|
||||||
|
|
||||||
return (
|
|
||||||
<div className="zrok">
|
|
||||||
<div className="container">
|
|
||||||
<div className="header">
|
|
||||||
<img alt="ziggy goes to space" src="ziggy.svg" width="65px"/>
|
|
||||||
<p className="header-title">zrok</p>
|
|
||||||
<div className={"header-status"}>
|
|
||||||
<div>
|
|
||||||
<p>{user.email}</p>
|
|
||||||
<Version/>
|
|
||||||
</div>
|
|
||||||
<div className={"header-controls"}>
|
|
||||||
<Token user={user}/>
|
|
||||||
<Logout user={user} logout={logout}/>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div className="main">
|
|
||||||
<Network />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
|
|
||||||
const App = () => {
|
const App = () => {
|
||||||
return (
|
return (
|
||||||
|
55
ui/src/Overview.js
Normal file
55
ui/src/Overview.js
Normal file
@ -0,0 +1,55 @@
|
|||||||
|
import {useEffect, useState} from "react";
|
||||||
|
import Login from "./Login";
|
||||||
|
import Version from "./Version";
|
||||||
|
import Token from "./Token";
|
||||||
|
import Logout from "./Logout";
|
||||||
|
import Network from "./Network";
|
||||||
|
|
||||||
|
const Overview = () => {
|
||||||
|
const [user, setUser] = useState();
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const localUser = localStorage.getItem("user")
|
||||||
|
if (localUser) {
|
||||||
|
setUser(JSON.parse(localUser))
|
||||||
|
console.log('reloaded user', localUser)
|
||||||
|
}
|
||||||
|
}, []);
|
||||||
|
|
||||||
|
if (!user) {
|
||||||
|
return (
|
||||||
|
<Login loginSuccess={setUser}/>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
const logout = () => {
|
||||||
|
setUser(null);
|
||||||
|
localStorage.clear();
|
||||||
|
}
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="zrok">
|
||||||
|
<div className="container">
|
||||||
|
<div className="header">
|
||||||
|
<img alt="ziggy goes to space" src="ziggy.svg" width="65px"/>
|
||||||
|
<p className="header-title">zrok</p>
|
||||||
|
<div className={"header-status"}>
|
||||||
|
<div>
|
||||||
|
<p>{user.email}</p>
|
||||||
|
<Version/>
|
||||||
|
</div>
|
||||||
|
<div className={"header-controls"}>
|
||||||
|
<Token user={user}/>
|
||||||
|
<Logout user={user} logout={logout}/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="main">
|
||||||
|
<Network />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
export default Overview;
|
Loading…
Reference in New Issue
Block a user