summaryrefslogtreecommitdiffhomepage
path: root/client/web/src/components/control-components.tsx
blob: 42ed25107c9860daa115ae5581630f7f2d4cc9b2 (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
// Copyright (c) Tailscale Inc & contributors
// SPDX-License-Identifier: BSD-3-Clause

import React from "react"
import { NodeData } from "src/types"

/**
 * AdminContainer renders its contents only if the node's control
 * server has an admin panel.
 *
 * TODO(sonia,will): Similarly, this could also hide the contents
 * if the viewing user is a non-admin.
 */
export function AdminContainer({
  node,
  children,
  className,
}: {
  node: NodeData
  children: React.ReactNode
  className?: string
}) {
  if (!node.ControlAdminURL.includes("tailscale.com")) {
    // Admin panel only exists on Tailscale control servers.
    return null
  }
  return <div className={className}>{children}</div>
}

/**
 * AdminLink renders its contents wrapped in a link to the node's control
 * server admin panel.
 *
 * AdminLink is meant for use only inside of a AdminContainer component,
 * to avoid rendering a link when the node's control server does not have
 * an admin panel.
 */
export function AdminLink({
  node,
  children,
  path,
}: {
  node: NodeData
  children: React.ReactNode
  path: string // admin path, e.g. "/settings/webhooks"
}) {
  return (
    <a
      href={`${node.ControlAdminURL}${path}`}
      className="link"
      target="_blank"
      rel="noreferrer"
    >
      {children}
    </a>
  )
}