+
+
+
+
{tx("settings.sections.cliApps", "CLI Apps")}
+
+ {tx("settings.cliApps.summary", "{{installed}} of {{total}} CLIs installed")
+ .replace("{{installed}}", String(payload?.installed_count ?? 0))
+ .replace("{{total}}", String(apps.length))}
+
+
+
onInstallFilterChange(value as "all" | "installed" | "notInstalled")}
+ />
+
+
+
+
+
+
+ {categoryLabel}
+
+
+
+ {categories.map((item) => (
+ onCategoryChange(item)}>
+ {item === "all" ? tx("settings.cliApps.allCategories", "All categories") : item}
+
+ ))}
+
+
+
+
+ {visibleStatusMessage ? (
+
+ {visibleStatusMessage}
+
+ ) : null}
+
+ {focusedApp ? (
+
+ ) : null}
+
+ {loading ? (
+
+
+ ) : (
+
+
+ {filteredApps.map((app) => (
+
+ {!filteredApps.length ? (
+
+ {tx("settings.cliApps.empty", "No CLI Apps match this filter.")}
+
+ ) : null}
+
+ )}
+
+
+
+
+
+ {app.display_name}
+
+
+ {app.category}
+
+
+
+ {app.entry_point || app.name}
+
+
+ {app.requires
+ ? `${tx("settings.cliApps.requires", "Requires")}: ${app.requires}`
+ : app.description || tx("settings.cliApps.noDescription", "No description available.")}
+
+
+ {app.installed ? (
+
+
+
+ {busy ?
+
+
+ onAction("test", app.name)}>
+
+ onAction("update", app.name)}>
+
+ onAction("uninstall", app.name)}>
+
+
+
+ ) : app.install_supported ? (
+
onAction("install", app.name)}
+ className="h-8 rounded-full px-4 text-[12px] font-semibold"
+ >
+ {installBusy ?
+ ) : (
+
+ {tx("settings.cliApps.unavailable", "Unavailable")}
+
+ )}
+
+ );
+}
+
+function CliAppLogo({ app, showBrandLogos }: { app: CliAppInfo; showBrandLogos: boolean }) {
+ const [failed, setFailed] = useState(false);
+ const bg = app.brand_color || "hsl(var(--muted))";
+ const initials = app.display_name
+ .split(/\s+/)
+ .filter(Boolean)
+ .slice(0, 2)
+ .map((part) => part[0]?.toUpperCase())
+ .join("") || app.name.slice(0, 2).toUpperCase();
+ if (showBrandLogos && app.logo_url && !failed) {
+ return (
+
+ {t("settings.legal.thirdPartyBrands", {
+ defaultValue:
+ "Product names, logos, and brands are property of their respective owners. Use is for identification only and does not imply endorsement.",
+ })}
+
+ );
+}
+
function orderUnconfiguredProviders(
providers: SettingsPayload["providers"],
): SettingsPayload["providers"] {
@@ -2126,6 +2614,63 @@ function providerLabel(
return providers.find((provider) => provider.name === value)?.label ?? value;
}
+interface ProviderBrand {
+ logoUrl: string;
+ color: string;
+ initials: string;
+}
+
+function faviconUrl(domain: string): string {
+ return `https://www.google.com/s2/favicons?domain=${domain}&sz=64`;
+}
+
+const PROVIDER_BRAND_ALIASES: Record