summaryrefslogtreecommitdiffhomepage
path: root/client/web/src/components/views
AgeCommit message (Collapse)AuthorFilesLines
2025-01-24client/web: remove advanced options from web client login (#14770)Mario Minardi1-35/+1
Removing the advanced options collapsible from the web client login for now ahead of our next client release. Updates https://github.com/tailscale/tailscale/issues/14568 Signed-off-by: Mario Minardi <mario@tailscale.com>
2024-02-26client/web: use grants on web UI frontendSonia Appasamy2-7/+13
Starts using peer capabilities to restrict the management client on a per-view basis. This change also includes a bulky cleanup of the login-toggle.tsx file, which was getting pretty unwieldy in its previous form. Updates tailscale/corp#16695 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2024-02-22client/web: update vite-plugin-svgr to latest version (#11197)Mario Minardi5-9/+9
Update vite-plugin-svgr to the latest version (4.2.0) ahead of updating vite to 5.x. This is a major version bump from our previous 3.x, and requires changing the import paths used for SVGs. Updates https://github.com/tailscale/corp/issues/17715 Signed-off-by: Mario Minardi <mario@tailscale.com>
2024-02-08client/web: use smart quotes in web UI frontendWill Norris2-2/+2
add the curly-quotes eslint plugin (same that we use for the admin panel), and fix existing straight quotes in the current web UI. Updates #cleanup Signed-off-by: Will Norris <will@tailscale.com>
2024-01-08client/web: rename Disconnect to Log outSonia Appasamy2-9/+28
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>
2023-12-12client/web: fix key expiry text when expiry disabledSonia Appasamy1-1/+3
Displays "No expiry" when disabled. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-12client/web: add debug card to details pageWill Norris1-0/+17
Add a new "Debug" card at the bottom of the details page. It's maybe premature to add a separate card for this, since all it currently lists is whether the device is using TUN mode and (for Synology) the DSM version. But I think it may be helpful to add client connectivity data (like shown on admin console machine page) as well as a bug report button. Those can come soon after the 1.56 launch. Updates #10261 Signed-off-by: Will Norris <will@tailscale.com>
2023-12-11client/web: add endpoint for logging device detail click metric (#10505)Mario Minardi1-2/+2
Add an endpoint for logging the device detail click metric to allow for this metric to be logged without having a valid session which is the case when in readonly mode. Updates https://github.com/tailscale/tailscale/issues/10261 Signed-off-by: Mario Minardi <mario@tailscale.com>
2023-12-08client/web: add confirmation dialogsSonia Appasamy2-19/+55
Add confirmation dialogs for disconnecting and stopping advertisement of a subnet route. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-08client/web: small UI cleanupsSonia Appasamy4-77/+107
Updates: * Card component used throughout instead of custom card class * SSH toggle changed to non-editable text/status icon in readonly * Red error text on subnet route input when route post failed Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-07client/web: restructure api mutations into hookSonia Appasamy6-85/+54
This commit makes some restructural changes to how we handle api posting from the web client frontend. Now that we're using SWR, we have less of a need for hooks like useNodeData that return a useSWR response alongside some mutation callbacks. SWR makes it easy to mutate throughout the UI without needing access to the original data state in order to reflect updates. So, we can fetch data without having to tie it to post callbacks that have to be passed around through components. In an effort to consolidate our posting endpoints, and make it easier to add more api handlers cleanly in the future, this change introduces a new `useAPI` hook that returns a single `api` callback that can make any changes from any component in the UI. The hook itself handles using SWR to mutate the relevant data keys, which get globally reflected throughout the UI. As a concurrent cleanup, node types are also moved to their own types.ts file, to consolidate data types across the app. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-07client/web: add additional web client metrics logging (#10462)Mario Minardi3-6/+16
Add additional web client metric logging. Namely, add logging events for auth / deauth, enable / disable using exit node, enable / disable SSH, enable / disable advertise routes, and click events on the device details button. Updates https://github.com/tailscale/tailscale/issues/10261 Signed-off-by: Mario Minardi <mario@tailscale.com>
2023-12-06client/web: start using swr for some fetchingSonia Appasamy1-2/+1
Adds swr to the web client, and starts by using it from the useNodeData hook. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-06client/web: style tweaksSonia Appasamy3-24/+30
Style changes made in live pairing session. Updates #10261 Co-authored-by: Will Norris <will@tailscale.com> Co-authored-by: Alessandro Mingione <alessandro@tailscale.com> Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-06client/web: add licenses and policies linksSonia Appasamy1-10/+44
Adds a footer to the device details page that mirrors license and policy content on other Tailscale clients. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-06client/web: use IPv4 instead of IP in login view (#10483)Mario Minardi1-1/+1
The IP property in node data was renamed to IPv4 but refactoring the usage of the property was missed in this file. Updates https://github.com/tailscale/tailscale/issues/10261 Signed-off-by: Mario Minardi <mario@tailscale.com>
2023-12-05client/web: add copyable components throughout UISonia Appasamy3-10/+59
Updates the IP address on home view to open a copyable list of node addresses on click. And makes various values on the details view copyable text items, mirroring the machine admin panel table. As part of these changes, pulls the AddressCard, NiceIP and QuickCopy components from the admin panel, with the AddressCard slightly modified to avoid needing to also pull in the CommandLine component. A new toaster interface is also added, allowing us to display success and failure toasts throughout the UI. The toaster code is slightly modified from it's admin form to avoid the need for some excess libraries. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-04client/web: update device and connected iconSonia Appasamy1-4/+13
Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-04client/web: add cancel button to subnet router input sectionSonia Appasamy1-22/+27
Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-04client/web: button, link, and other small UI updatesSonia Appasamy5-145/+212
Makes the following changes: * Use “link” class in various spots * Remove button appearance on Exit Node dropdown in readonly mode * Update `-stone-` colors to `-gray-` (couple spots missed by original color config commit) * Pull full ui/button component from admin panel, and update buttons throughout UI to use this component * Remove various buttons in readonly view to match mocks * Add route (and “pending approval”) highlights to Subnet router settings card * Delete legacy client button styles from index.css * Fix overflow of IPv6 address on device details view Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-01client/web: show features based on platform supportSonia Appasamy2-29/+37
Hiding/disabling UI features when not available on the running client. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-12-01client/web: adjust colors and some UI marginsSonia Appasamy4-24/+19
Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-29client/web: hide admin panel links for non-tailscale control serversSonia Appasamy3-35/+34
Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-29client/web: add subnet routes viewSonia Appasamy3-14/+159
Add UI view for mutating the node's advertised subnet routes. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-28client/web: add eslintSonia Appasamy3-2/+12
Add eslint to require stricter typescript rules, particularly around required hook dependencies. This commit also updates any files that were now throwing errors with eslint. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-28scripts/check_license_headers: enforce license on ts/tsx filesSonia Appasamy5-0/+15
Enforcing inclusion of our OSS license at the top of .ts and .tsx files. Also updates any relevant files in the repo that were previously missing the license comment. An additional `@license` comment is added to client/web/src/index.tsx to preserve the license in generated Javascript. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-17client/web: add advanced login optionsWill Norris1-2/+42
This adds an expandable section of the login view to allow users to specify an auth key and an alternate control URL. Input and Collapsible components and accompanying styles were brought over from the adminpanel. Updates #10261 Signed-off-by: Will Norris <will@tailscale.com>
2023-11-17client/web: add Inter fontSonia Appasamy3-5/+5
Adds Inter font and uses it as the default for the web UI. Creates a new /assets folder to house the /fonts, and moves /icons to live here too. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-17client/web: add exit node selectorSonia Appasamy1-1/+4
Add exit node selector (in full management client only) that allows for advertising as an exit node, or selecting another exit node on the Tailnet for use. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-17client/web: split login from nodeUpdateWill Norris1-8/+46
This creates a new /api/up endpoint which is exposed in the login client, and is solely focused on logging in. Login has been removed from the nodeUpdate endpoint. This also adds support in the LoginClientView for a stopped node that just needs to reconnect, but not necessarily reauthenticate. This follows the same pattern in `tailscale up` of just setting the WantRunning user pref. Updates tailscale/corp#14335 Signed-off-by: Will Norris <will@tailscale.com>
2023-11-17client/web: hide unimplemented linksSonia Appasamy1-4/+5
Hiding links to unimplemented settings pages. Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-15client/web: remove legacy-client-view.tsxSonia Appasamy1-232/+0
Updates #10261 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-15client/{tailscale,web}: add initial webUI frontend for self-updates (#10191)Naman Sood2-0/+96
Updates #10187. Signed-off-by: Naman Sood <mail@nsood.in>
2023-11-13client/web: add Tailscale SSH viewSonia Appasamy3-5/+79
Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-10client/web: add readonly/manage toggleSonia Appasamy3-78/+16
Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-08client/web: populate device details viewSonia Appasamy1-28/+39
Fills /details page with real values, passed back from the /data endpoint. Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-07client/web: add initial framework for exit node selectorSonia Appasamy1-22/+16
Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-07client/web: add device details viewSonia Appasamy2-22/+125
Initial addition of device details view on the frontend. A little more backend piping work to come to fill all of the detail fields, for now using placeholders. Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-07client/web: show manage button in readonly viewWill Norris1-13/+17
We render the readonly view in two situations: - the client is in login mode, and the device is connected - the client is in manage mode, but the user does not yet have a session If the user is not authenticated, and they are not currently on the Tailscale IP address, render a "Manage" button that will take them to the Tailcale IP of the device and immediately start check mode. Still to do is detecting if they have connectivity to the Tailscale IP, and disabling the button if not. Updates tailscale/corp#14335 Signed-off-by: Will Norris <will@tailscale.com>
2023-11-06client/web: build out client home pageSonia Appasamy1-12/+84
Hooks up more of the home page UI. Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-11-03client/web: move auth session creation out of /api/authSonia Appasamy1-6/+8
Splits auth session creation into two new endpoints: /api/auth/session/new - to request a new auth session /api/auth/session/wait - to block until user has completed auth url Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
2023-10-31client/web: split out UI componentsSonia Appasamy4-0/+401
This commit makes the following structural changes to the web client interface. No user-visible changes. 1. Splits login, legacy, readonly, and full management clients into their own components, and pulls them out into their own view files. 2. Renders the same Login component for all scenarios when the client is not logged in, regardless of legacy or debug mode. Styling comes from the existing legacy login, which is removed from legacy.tsx now that it is shared. 3. Adds a ui folder to hold non-Tailscale-specific components, starting with ProfilePic, previously housed in app.tsx. Updates tailscale/corp#14335 Signed-off-by: Sonia Appasamy <sonia@tailscale.com>
Copyright © 2025 - 2026 Wayne Cole. WTFPL. Attribution appreciated. No warranty. Not liable for bodily damages.