client/web: use grants on web UI frontend

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>

client/web/src/components/views/home-view.tsx

@@ -8,17 +8,18 @@ import ArrowRight from "src/assets/icons/arrow-right.svg?react"
 import Machine from "src/assets/icons/machine.svg?react"
 import AddressCard from "src/components/address-copy-card"
 import ExitNodeSelector from "src/components/exit-node-selector"
+import { AuthResponse, canEdit } from "src/hooks/auth"
 import { NodeData } from "src/types"
 import Card from "src/ui/card"
 import { pluralize } from "src/utils/util"
 import { Link, useLocation } from "wouter"
 
 export default function HomeView({
-  readonly,
   node,
+  auth,
 }: {
-  readonly: boolean
   node: NodeData
+  auth: AuthResponse
 }) {
   const [allSubnetRoutes, pendingSubnetRoutes] = useMemo(
     () => [
@@ -63,7 +64,11 @@ export default function HomeView({
         </div>
         {(node.Features["advertise-exit-node"] ||
           node.Features["use-exit-node"]) && (
-          <ExitNodeSelector className="mb-5" node={node} disabled={readonly} />
+          <ExitNodeSelector
+            className="mb-5"
+            node={node}
+            disabled={!canEdit("exitnodes", auth)}
+          />
         )}
         <Link
           className="link font-medium"