mirror of
https://github.com/tailscale/tailscale.git
synced 2025-04-21 06:01:42 +00:00
client/web: add route management for ui pages
Using wouter, a lightweight React routing library. Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
This commit is contained in:
parent
a97ead9ce4
commit
7df2c5d6b1
@ -10,7 +10,8 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"classnames": "^2.3.1",
|
"classnames": "^2.3.1",
|
||||||
"react": "^18.2.0",
|
"react": "^18.2.0",
|
||||||
"react-dom": "^18.2.0"
|
"react-dom": "^18.2.0",
|
||||||
|
"wouter": "^2.11.0"
|
||||||
},
|
},
|
||||||
"devDependencies": {
|
"devDependencies": {
|
||||||
"@types/classnames": "^2.2.10",
|
"@types/classnames": "^2.2.10",
|
||||||
|
@ -6,22 +6,32 @@ import ManagementClientView from "src/components/views/management-client-view"
|
|||||||
import ReadonlyClientView from "src/components/views/readonly-client-view"
|
import ReadonlyClientView from "src/components/views/readonly-client-view"
|
||||||
import useAuth, { AuthResponse, SessionsCallbacks } from "src/hooks/auth"
|
import useAuth, { AuthResponse, SessionsCallbacks } from "src/hooks/auth"
|
||||||
import useNodeData from "src/hooks/node-data"
|
import useNodeData from "src/hooks/node-data"
|
||||||
|
import { Route, Switch } from "wouter"
|
||||||
|
|
||||||
export default function App() {
|
export default function App() {
|
||||||
const { data: auth, loading: loadingAuth, sessions } = useAuth()
|
const { data: auth, loading: loadingAuth, sessions } = useAuth()
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="flex flex-col items-center min-w-sm max-w-lg mx-auto py-14">
|
<main className="flex flex-col items-center min-w-sm max-w-lg mx-auto py-14">
|
||||||
{loadingAuth ? (
|
{loadingAuth ? (
|
||||||
<div className="text-center py-14">Loading...</div> // TODO(sonia): add a loading view
|
<div className="text-center py-14">Loading...</div> // TODO(sonia): add a loading view
|
||||||
) : (
|
) : (
|
||||||
<WebClient auth={auth} sessions={sessions} />
|
<Switch>
|
||||||
|
<Route path="/">
|
||||||
|
<HomeView auth={auth} sessions={sessions} />
|
||||||
|
</Route>
|
||||||
|
<Route path="/details">{/* TODO */}Device details</Route>
|
||||||
|
<Route path="/subnets">{/* TODO */}Subnet router</Route>
|
||||||
|
<Route path="/ssh">{/* TODO */}Tailscale SSH server</Route>
|
||||||
|
<Route path="/serve">{/* TODO */}Share local content</Route>
|
||||||
|
<Route>Page not found</Route>
|
||||||
|
</Switch>
|
||||||
)}
|
)}
|
||||||
</div>
|
</main>
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
|
||||||
function WebClient({
|
function HomeView({
|
||||||
auth,
|
auth,
|
||||||
sessions,
|
sessions,
|
||||||
}: {
|
}: {
|
||||||
|
@ -1765,6 +1765,11 @@ update-browserslist-db@^1.0.11:
|
|||||||
escalade "^3.1.1"
|
escalade "^3.1.1"
|
||||||
picocolors "^1.0.0"
|
picocolors "^1.0.0"
|
||||||
|
|
||||||
|
use-sync-external-store@^1.0.0:
|
||||||
|
version "1.2.0"
|
||||||
|
resolved "https://registry.yarnpkg.com/use-sync-external-store/-/use-sync-external-store-1.2.0.tgz#7dbefd6ef3fe4e767a0cf5d7287aacfb5846928a"
|
||||||
|
integrity sha512-eEgnFxGQ1Ife9bzYs6VLi8/4X6CObHMw9Qr9tPY43iKwsPw8xE8+EFsf/2cFZ5S3esXgpWgtSCtLNS41F+sKPA==
|
||||||
|
|
||||||
util-deprecate@^1.0.2:
|
util-deprecate@^1.0.2:
|
||||||
version "1.0.2"
|
version "1.0.2"
|
||||||
resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
|
resolved "https://registry.yarnpkg.com/util-deprecate/-/util-deprecate-1.0.2.tgz#450d4dc9fa70de732762fbd2d4a28981419a0ccf"
|
||||||
@ -1857,6 +1862,13 @@ why-is-node-running@^2.2.2:
|
|||||||
siginfo "^2.0.0"
|
siginfo "^2.0.0"
|
||||||
stackback "0.0.2"
|
stackback "0.0.2"
|
||||||
|
|
||||||
|
wouter@^2.11.0:
|
||||||
|
version "2.12.1"
|
||||||
|
resolved "https://registry.yarnpkg.com/wouter/-/wouter-2.12.1.tgz#11d913324c6320b679873783acb15ea3523b8521"
|
||||||
|
integrity sha512-G7a6JMSLSNcu6o8gdOfIzqxuo8Qx1qs+9rpVnlurH69angsSFPZP5gESNuVNeJct/MGpQg191pDo4HUjTx7IIQ==
|
||||||
|
dependencies:
|
||||||
|
use-sync-external-store "^1.0.0"
|
||||||
|
|
||||||
wrappy@1:
|
wrappy@1:
|
||||||
version "1.0.2"
|
version "1.0.2"
|
||||||
resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
|
resolved "https://registry.yarnpkg.com/wrappy/-/wrappy-1.0.2.tgz#b5243d8f3ec1aa35f1364605bc0d1036e30ab69f"
|
||||||
|
Loading…
x
Reference in New Issue
Block a user