Remove org switcher tooltip (#8269)

This commit is contained in:
Matt Rubens 2025-09-23 18:59:06 -04:00 • committed by GitHub
parent d8dd19a6ed
commit fc4ee93585
No known key found for this signature in database
GPG key ID: B5690EEEBB952194

View file

@ -1,7 +1,6 @@
import { useState, useEffect } from "react"
import { Building2 } from "lucide-react"
import { Select, SelectContent, SelectItem, SelectTrigger, SelectSeparator } from "@/components/ui/select"
import { StandardTooltip } from "@src/components/ui"
import { useAppTranslation } from "@src/i18n/TranslationContext"
import { vscode } from "@src/utils/vscode"
import { useExtensionState } from "@src/context/ExtensionStateContext"
@ -86,64 +85,62 @@ export const CloudAccountSwitcher = () => {
}
return (
<StandardTooltip content={t("cloud:switchAccount")}>
<div className="inline-block ml-1">
<Select value={currentValue} onValueChange={handleOrganizationChange} disabled={isLoading}>
<SelectTrigger
className={cn(
"h-4.5 w-4.5 p-0 gap-0",
"bg-transparent opacity-90 hover:opacity-50",
"flex items-center justify-center",
"rounded-lg overflow-clip",
"border border-vscode-dropdown-border",
"[&>svg]:hidden", // Hide the default chevron/caret
isLoading && "opacity-50",
)}
aria-label={selectedOrgId ? currentOrg?.organization.name : t("cloud:personalAccount")}>
{renderAccountIcon()}
</SelectTrigger>
<div className="inline-block ml-1">
<Select value={currentValue} onValueChange={handleOrganizationChange} disabled={isLoading}>
<SelectTrigger
className={cn(
"h-4.5 w-4.5 p-0 gap-0",
"bg-transparent opacity-90 hover:opacity-50",
"flex items-center justify-center",
"rounded-lg overflow-clip",
"border border-vscode-dropdown-border",
"[&>svg]:hidden", // Hide the default chevron/caret
isLoading && "opacity-50",
)}
aria-label={selectedOrgId ? currentOrg?.organization.name : t("cloud:personalAccount")}>
{renderAccountIcon()}
</SelectTrigger>
<SelectContent>
{/* Personal Account Option */}
<SelectItem value="personal">
<SelectContent>
{/* Personal Account Option */}
<SelectItem value="personal">
<div className="flex items-center gap-2">
{cloudUserInfo.picture ? (
<img
src={cloudUserInfo.picture}
alt={cloudUserInfo.name || cloudUserInfo.email}
className="w-4.5 h-4.5 rounded-full object-cover overflow-clip"
/>
) : (
<div className="w-4.5 h-4.5 rounded-full flex items-center justify-center bg-vscode-button-background text-vscode-button-foreground text-xs">
{cloudUserInfo.name?.charAt(0) || cloudUserInfo.email?.charAt(0) || "?"}
</div>
)}
<span>{t("cloud:personalAccount")}</span>
</div>
</SelectItem>
{cloudOrganizations.length > 0 && <SelectSeparator />}
{/* Organization Options */}
{cloudOrganizations.map((org) => (
<SelectItem key={org.organization.id} value={org.organization.id}>
<div className="flex items-center gap-2">
{cloudUserInfo.picture ? (
{org.organization.image_url ? (
<img
src={cloudUserInfo.picture}
alt={cloudUserInfo.name || cloudUserInfo.email}
src={org.organization.image_url}
alt=""
className="w-4.5 h-4.5 rounded-full object-cover overflow-clip"
/>
) : (
<div className="w-4.5 h-4.5 rounded-full flex items-center justify-center bg-vscode-button-background text-vscode-button-foreground text-xs">
{cloudUserInfo.name?.charAt(0) || cloudUserInfo.email?.charAt(0) || "?"}
</div>
<Building2 className="w-4.5 h-4.5" />
)}
<span>{t("cloud:personalAccount")}</span>
<span className="truncate">{org.organization.name}</span>
</div>
</SelectItem>
{cloudOrganizations.length > 0 && <SelectSeparator />}
{/* Organization Options */}
{cloudOrganizations.map((org) => (
<SelectItem key={org.organization.id} value={org.organization.id}>
<div className="flex items-center gap-2">
{org.organization.image_url ? (
<img
src={org.organization.image_url}
alt=""
className="w-4.5 h-4.5 rounded-full object-cover overflow-clip"
/>
) : (
<Building2 className="w-4.5 h-4.5" />
)}
<span className="truncate">{org.organization.name}</span>
</div>
</SelectItem>
))}
</SelectContent>
</Select>
</div>
</StandardTooltip>
))}
</SelectContent>
</Select>
</div>
)
}