calvin.erfmann/pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2026-08-12 15:30:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

add virtual keys link in header on launcher

Browse Source
This commit is contained in:
miloschwartz
2026-08-11 12:09:11 -04:00
parent 2187f23588
commit b33e776072
8 changed files with 123 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files
messages/en-US.json
+2
View File
@@ -1646,6 +1646,8 @@
"sidebarAiProviders": "Providers",
"commandAiProviders": "AI Providers",
"sidebarVirtualApiKeys": "Virtual API Keys",
"sidebarMyApiKeys": "Your API Keys",
"sidebarAccount": "Launcher",
"commandVirtualApiKeys": "Virtual API Keys",
"virtualApiKeysTitle": "Manage Virtual API Keys",
"virtualApiKeysDescription": "Create and manage manual API keys for AI Gateway access to public inference resources",
src/app/[orgId]/keys/page.tsx
+1
View File
@@ -104,6 +104,7 @@ export default async function KeysPage(props: KeysPageProps) {
isPrimaryOrg: primaryOrg
})}
showSidebar={false}
launcherMode
showViewAsAdmin={isAdminOrOwner}
>
<UserVirtualApiKeys orgId={orgId} initialData={keysData} />
src/app/[orgId]/resource/[resourceGuid]/keys/page.tsx
+1
View File
@@ -108,6 +108,7 @@ export default async function ResourceKeysPage(props: ResourceKeysPageProps) {
isPrimaryOrg: primaryOrg
})}
showSidebar={false}
launcherMode
showViewAsAdmin={isAdminOrOwner}
>
<UserVirtualApiKeys
src/app/navigation.tsx
+5
View File
@@ -53,6 +53,11 @@ export const orgLangingNavItems: SidebarNavItem[] = [
title: "sidebarAccount",
href: "/{orgId}",
icon: <LayoutGrid className="size-4 flex-none" />
},
{
title: "sidebarMyApiKeys",
href: "/{orgId}/keys",
icon: <KeyRound className="size-4 flex-none" />
}
];
src/components/Layout.tsx
+11 -3
View File
@@ -1,10 +1,12 @@
import React from "react";
import { cn } from "@app/lib/cn";
import { ListUserOrgsResponse } from "@server/routers/org";
import type {
CommandBarNavSection,
SidebarNavSection
import {
orgLangingNavItems,
type CommandBarNavSection,
type SidebarNavSection
} from "@app/app/navigation";
import type { SidebarNavItem } from "@app/components/SidebarNav";
import { LayoutSidebar } from "@app/components/LayoutSidebar";
import { LayoutHeader } from "@app/components/LayoutHeader";
import { LayoutMobileMenu } from "@app/components/LayoutMobileMenu";
@@ -46,6 +48,10 @@ export async function Layout({
sidebarStateCookie === "collapsed" ||
(sidebarStateCookie !== "expanded" && defaultSidebarCollapsed);
const launcherNavItems: SidebarNavItem[] = launcherMode
? orgLangingNavItems
: [];
return (
<CommandPaletteProvider
orgId={orgId}
@@ -77,6 +83,7 @@ export async function Layout({
orgId={orgId}
orgs={orgs}
navItems={navItems}
launcherNavItems={launcherNavItems}
showSidebar={showSidebar}
showTopBar={showTopBar}
launcherMode={launcherMode}
@@ -92,6 +99,7 @@ export async function Layout({
orgId={orgId}
orgs={orgs}
showViewAsAdmin={showViewAsAdmin}
launcherNavItems={launcherNavItems}
/>
)}
src/components/LayoutHeader.tsx
+43 -1
View File
@@ -2,6 +2,7 @@
import React, { useEffect, useState } from "react";
import Link from "next/link";
import { usePathname } from "next/navigation";
import ProfileIcon from "@app/components/ProfileIcon";
import ThemeSwitcher from "@app/components/ThemeSwitcher";
import { useTheme } from "next-themes";
@@ -13,6 +14,8 @@ import { LauncherOrgSelector } from "@app/components/resource-launcher/LauncherO
import { Button } from "@app/components/ui/button";
import { useTranslations } from "next-intl";
import { CommandPaletteTrigger } from "@app/components/command-palette/CommandPaletteTrigger";
import type { SidebarNavItem } from "@app/components/SidebarNav";
import { cn } from "@app/lib/cn";
type LayoutHeaderProps = {
showTopBar: boolean;
@@ -20,6 +23,7 @@ type LayoutHeaderProps = {
orgId?: string;
orgs?: ListUserOrgsResponse["orgs"];
showViewAsAdmin?: boolean;
launcherNavItems?: SidebarNavItem[];
};
export function LayoutHeader({
@@ -27,13 +31,15 @@ export function LayoutHeader({
launcherMode = false,
orgId,
orgs,
showViewAsAdmin = false
showViewAsAdmin = false,
launcherNavItems = []
}: LayoutHeaderProps) {
const { theme } = useTheme();
const [path, setPath] = useState<string>("");
const { env } = useEnvContext();
const { isUnlocked } = useLicenseStatusContext();
const t = useTranslations();
const pathname = usePathname();
const logoWidth = isUnlocked()
? env.branding.logo?.navbar?.width || 98
@@ -85,6 +91,42 @@ export function LayoutHeader({
orgId={orgId}
orgs={orgs}
/>
{orgId
? launcherNavItems
.filter((item) => item.href)
.map((item) => {
const href =
item.href!.replace(
"{orgId}",
orgId
);
const isActive =
href === `/${orgId}`
? pathname === href
: pathname === href ||
pathname?.startsWith(
`${href}/`
);
return (
<Button
key={href}
variant="text"
size="sm"
className={cn(
"p-0",
isActive &&
"text-foreground font-medium underline-offset-4 underline"
)}
asChild
>
<Link href={href}>
{t(item.title)}
</Link>
</Button>
);
})
: null}
{showViewAsAdmin && orgId ? (
<Button
variant="text"
src/components/LayoutMobileMenu.tsx
+54 -5
View File
@@ -4,7 +4,7 @@ import type { SidebarNavSection } from "@app/app/navigation";
import { CommandPaletteTrigger } from "@app/components/command-palette/CommandPaletteTrigger";
import { OrgSelector } from "@app/components/OrgSelector";
import ProfileIcon from "@app/components/ProfileIcon";
import { SidebarNav } from "@app/components/SidebarNav";
import { SidebarNav, type SidebarNavItem } from "@app/components/SidebarNav";
import ThemeSwitcher from "@app/components/ThemeSwitcher";
import { Button } from "@app/components/ui/button";
import {
@@ -27,6 +27,7 @@ interface LayoutMobileMenuProps {
orgId?: string;
orgs?: ListUserOrgsResponse["orgs"];
navItems: SidebarNavSection[];
launcherNavItems?: SidebarNavItem[];
showSidebar: boolean;
showTopBar: boolean;
launcherMode?: boolean;
@@ -37,6 +38,7 @@ export function LayoutMobileMenu({
orgId,
orgs,
navItems,
launcherNavItems = [],
showSidebar,
showTopBar,
launcherMode = false,
@@ -95,8 +97,55 @@ export function LayoutMobileMenu({
/>
</div>
</div>
{showViewAsAdmin && orgId ? (
<div className="px-3">
<div className="px-3">
{orgId
? launcherNavItems
.filter(
(item) =>
item.href
)
.map((item) => {
const href =
item.href!.replace(
"{orgId}",
orgId
);
return (
<div
key={href}
className="mb-1"
>
<Link
href={
href
}
className={
mobileNavLinkClassName
}
onClick={() =>
setIsMobileMenuOpen(
false
)
}
>
{item.icon ? (
<span className="flex-shrink-0 w-5 h-5 flex items-center justify-center text-muted-foreground mr-3">
{
item.icon
}
</span>
) : null}
<span className="flex-1">
{t(
item.title
)}
</span>
</Link>
</div>
);
})
: null}
{showViewAsAdmin && orgId ? (
<div className="mb-1">
<Link
href={`/${orgId}/settings`}
@@ -119,8 +168,8 @@ export function LayoutMobileMenu({
</span>
</Link>
</div>
</div>
) : null}
) : null}
</div>
</>
) : (
<>
src/components/command-palette/useCommandPaletteActions.tsx
+6
View File
@@ -75,6 +75,12 @@ export function useCommandPaletteActions(
});
}
} else if (orgId) {
actions.push({
id: "my-api-keys",
label: t("sidebarMyApiKeys"),
icon: <KeyRound className="size-4" />,
href: `/${orgId}/keys`
});
actions.push({
id: "create-site",
label: t("commandPaletteCreateSite"),