TheArchive/tailscale
1
0
Fork 0
mirror of https://github.com/tailscale/tailscale.git synced 2025-04-21 14:11:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

client/web: rename Disconnect to Log out

Browse Source 
For consistency w/ the CLI command. And to be more accurate to what
is actually happening on this action - node key is expired.

Also updates the disconnected view shown after logout.

Updates #10261

Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
This commit is contained in:
Sonia Appasamy 2024-01-05 14:09:24 -05:00 committed by Sonia Appasamy
parent 133699284e
commit 55d302b48e
3 changed files with 30 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
client/web/src/components/app.tsx
View File

@ -5,6 +5,7 @@ import React from "react"
import { ReactComponent as TailscaleIcon } from "src/assets/icons/tailscale-icon.svg" import { ReactComponent as TailscaleIcon } from "src/assets/icons/tailscale-icon.svg"
import LoginToggle from "src/components/login-toggle" import LoginToggle from "src/components/login-toggle"
import DeviceDetailsView from "src/components/views/device-details-view" import DeviceDetailsView from "src/components/views/device-details-view"
import DisconnectedView from "src/components/views/disconnected-view"
import HomeView from "src/components/views/home-view" import HomeView from "src/components/views/home-view"
import LoginView from "src/components/views/login-view" import LoginView from "src/components/views/login-view"
import SSHView from "src/components/views/ssh-view" import SSHView from "src/components/views/ssh-view"
@ -74,9 +75,7 @@ function WebClient({
/> />
</FeatureRoute> </FeatureRoute>
<Route path="/disconnected"> <Route path="/disconnected">
<Card className="mt-8"> <DisconnectedView />
<EmptyState description="You have been disconnected" />
</Card>
</Route> </Route>
<Route> <Route>
<Card className="mt-8"> <Card className="mt-8">

16
client/web/src/components/views/device-details-view.tsx
View File

@ -226,24 +226,22 @@ function DisconnectDialog() {
return ( return (
<Dialog <Dialog
className="max-w-md" className="max-w-md"
title="Disconnect" title="Log out"
trigger={<Button sizeVariant="small">Disconnect…</Button>} trigger={<Button sizeVariant="small">Log out…</Button>}
> >
<Dialog.Form <Dialog.Form
cancelButton cancelButton
submitButton="Disconnect" submitButton="Log out"
destructive destructive
onSubmit={() => { onSubmit={() => {
api({ action: "logout" }) api({ action: "logout" })
setLocation("/disconnected") setLocation("/disconnected")
}} }}
> >
You are about to disconnect this device from your tailnet. To reconnect, Logging out of this device will disconnect it from your tailnet and
you will be required to re-authenticate this device. expire its node key. You won’t be able to use this web interface until
<p className="mt-4 text-sm text-text-muted"> you re-authenticate the device from either the Tailscale app or the
Your connection to this web interface will end as soon as you click Tailscale command line interface.
disconnect.
</p>
</Dialog.Form> </Dialog.Form>
</Dialog> </Dialog>
) )

21
client/web/src/components/views/disconnected-view.tsx Normal file
View File

@ -0,0 +1,21 @@
// Copyright (c) Tailscale Inc & AUTHORS
// SPDX-License-Identifier: BSD-3-Clause
import React from "react"
import { ReactComponent as TailscaleIcon } from "src/assets/icons/tailscale-icon.svg"
/**
* DisconnectedView is rendered after node logout.
*/
export default function DisconnectedView() {
return (
<>
<TailscaleIcon className="mx-auto" />
<p className="mt-12 text-center text-text-muted">
You logged out of this device. To reconnect it you will have to
re-authenticate the device from either the Tailscale app or the
Tailscale command line interface.
</p>
</>
)
}