Function ProxyMenu

site/src/modules/dashboard/Navbar/ProxyMenu.tsx:28–198

({ proxyContextValue })

}

export const ProxyMenu: FC<ProxyMenuProps> = ({ proxyContextValue }) => {
	const [open, setOpen] = useState(false);
	const [refetchDate, setRefetchDate] = useState<Date>();
	const selectedProxy = proxyContextValue.proxy.proxy;
	const refreshLatencies = proxyContextValue.refetchProxyLatencies;
	const closeMenu = () => setOpen(false);
	const latencies = proxyContextValue.proxyLatencies;
	const isLoadingLatencies = Object.keys(latencies).length === 0;
	const isLoading = proxyContextValue.isLoading || isLoadingLatencies;
	const { permissions } = useAuthenticated();

	const proxyLatencyLoading = (proxy: TypesGen.Region): boolean => {
		if (!refetchDate) {
			// Only show loading if the user manually requested a refetch
			return false;
		}

		// Only show a loading spinner if:
		//  - A latency exists. This means the latency was fetched at some point, so
		//    the loader *should* be resolved.
		//  - The proxy is healthy. If it is not, the loader might never resolve.
		//  - The latency reported is older than the refetch date. This means the
		//    latency is stale and we should show a loading spinner until the new
		//    latency is fetched.
		const latency = latencies[proxy.id];
		return proxy.healthy && latency !== undefined && latency.at < refetchDate;
	};

	// This endpoint returns a 404 when not using enterprise.
	// If we don't return null, then it looks like this is
	// loading forever!
	if (proxyContextValue.error) {
		return null;
	}

	if (isLoading) {
		return (
			<Skeleton
				width="110px"
				height={40}
				className="rounded-[6px] transform-none"
			/>
		);
	}

	return (
		<DropdownMenu open={open} onOpenChange={setOpen}>
			<DropdownMenuTrigger asChild>
				<Button variant="outline" size="lg">
					<span className="sr-only">
						Latency for {selectedProxy?.display_name ?? "your region"}
					</span>

					{selectedProxy ? (
						<>
							<ExternalImage
								// Empty alt text used because we don't want to double up on
								// screen reader announcements from visually-hidden span