import type { ReactNode } from "react";import { Link } from "@tanstack/react-router";import { useAtomValue } from "@effect/atom-react"; import { orgMembersAtom } from "../api/account-atoms";import { isAsyncResultLoading } from "../lib/async-result";import { useCanCreateWorkspaceConnections } from "../multiplayer/use-admin-nav";import { Button } from "./button";import { PageContainer, PageHeader } from "./page";import { Skeleton } from "./skeleton"; /** Keep integration creation flows behind the same role gate as edit and delete. */export function IntegrationCreationGate({ children }: { readonly children: ReactNode }) {  const canCreate = useCanCreateWorkspaceConnections();  const members = useAtomValue(orgMembersAtom);  if (canCreate) return children;  if (isAsyncResultLoading(members)) {    return (      <PageContainer>        <Skeleton className="h-8 w-64" />      </PageContainer>    );  }   return (    <PageContainer>      <PageHeader        title="An admin must add integrations"        description="Ask a workspace admin to add the integration. You can add personal connections to existing integrations."      />      <Button asChild variant="outline">        <Link to="/{-$orgSlug}">Back to integrations</Link>      </Button>    </PageContainer>  );}