visual enhacements

This commit is contained in:
miloschwartz
2025-12-18 10:26:13 -05:00
parent 16653dd524
commit 416fd914cb
12 changed files with 38 additions and 111 deletions

View File

@@ -1196,7 +1196,7 @@
"sidebarUserDevices": "Users", "sidebarUserDevices": "Users",
"sidebarMachineClients": "Machines", "sidebarMachineClients": "Machines",
"sidebarDomains": "Domains", "sidebarDomains": "Domains",
"sidebarGeneral": "General", "sidebarGeneral": "Manage",
"sidebarLogAndAnalytics": "Log & Analytics", "sidebarLogAndAnalytics": "Log & Analytics",
"sidebarBluePrints": "Blueprints", "sidebarBluePrints": "Blueprints",
"sidebarOrganization": "Organization", "sidebarOrganization": "Organization",
@@ -2146,7 +2146,7 @@
"unverified": "Unverified", "unverified": "Unverified",
"domainSetting": "Domain Settings", "domainSetting": "Domain Settings",
"domainSettingDescription": "Configure settings for the domain", "domainSettingDescription": "Configure settings for the domain",
"preferWildcardCertDescription": "Attempt to generate a wildcard certificate (require a properly configured certificate resolver).", "preferWildcardCertDescription": "Attempt to generate a wildcard certificate (requires a properly configured certificate resolver).",
"recordName": "Record Name", "recordName": "Record Name",
"auto": "Auto", "auto": "Auto",
"TTL": "TTL", "TTL": "TTL",

View File

@@ -700,29 +700,6 @@ export default function Page() {
id="create-idp-form" id="create-idp-form"
onSubmit={form.handleSubmit(onSubmit)} onSubmit={form.handleSubmit(onSubmit)}
> >
<Alert variant="neutral">
<InfoIcon className="h-4 w-4" />
<AlertTitle className="font-semibold">
{t("idpJmespathAbout")}
</AlertTitle>
<AlertDescription>
{t(
"idpJmespathAboutDescription"
)}{" "}
<a
href="https://jmespath.org"
target="_blank"
rel="noopener noreferrer"
className="text-primary hover:underline inline-flex items-center"
>
{t(
"idpJmespathAboutDescriptionLink"
)}{" "}
<ExternalLink className="ml-1 h-4 w-4" />
</a>
</AlertDescription>
</Alert>
<FormField <FormField
control={form.control} control={form.control}
name="identifierPath" name="identifierPath"

View File

@@ -319,19 +319,6 @@ export default function CreateRemoteExitNodePage() {
id: "${defaults?.remoteExitNodeId}" id: "${defaults?.remoteExitNodeId}"
secret: "${defaults?.secret}"`} secret: "${defaults?.secret}"`}
/> />
<Alert variant="neutral" className="mt-4">
<InfoIcon className="h-4 w-4" />
<AlertTitle className="font-semibold">
{t(
"remoteExitNodeCreate.generate.saveCredentialsTitle"
)}
</AlertTitle>
<AlertDescription>
{t(
"remoteExitNodeCreate.generate.saveCredentialsDescription"
)}
</AlertDescription>
</Alert>
</SettingsSectionBody> </SettingsSectionBody>
</SettingsSection> </SettingsSection>
)} )}

View File

@@ -523,18 +523,6 @@ export default function Page() {
</InfoSectionContent> </InfoSectionContent>
</InfoSection> </InfoSection>
</InfoSections> </InfoSections>
<Alert variant="neutral" className="">
<InfoIcon className="h-4 w-4" />
<AlertTitle className="font-semibold">
{t("clientCredentialsSave")}
</AlertTitle>
<AlertDescription>
{t(
"clientCredentialsSaveDescription"
)}
</AlertDescription>
</Alert>
</SettingsSectionBody> </SettingsSectionBody>
</SettingsSection> </SettingsSection>
<SettingsSection> <SettingsSection>

View File

@@ -820,18 +820,6 @@ WantedBy=default.target`
</InfoSection> </InfoSection>
</InfoSections> </InfoSections>
<Alert variant="neutral" className="">
<InfoIcon className="h-4 w-4" />
<AlertTitle className="font-semibold">
{t("siteCredentialsSave")}
</AlertTitle>
<AlertDescription>
{t(
"siteCredentialsSaveDescription"
)}
</AlertDescription>
</Alert>
{/* <Form {...form}> */} {/* <Form {...form}> */}
{/* <form */} {/* <form */}
{/* className="space-y-4" */} {/* className="space-y-4" */}
@@ -1067,17 +1055,6 @@ WantedBy=default.target`
</div> </div>
</div> </div>
</div> </div>
<Alert variant="neutral">
<InfoIcon className="h-4 w-4" />
<AlertTitle className="font-semibold">
{t("siteCredentialsSave")}
</AlertTitle>
<AlertDescription>
{t(
"siteCredentialsSaveDescription"
)}
</AlertDescription>
</Alert>
</SettingsSectionBody> </SettingsSectionBody>
</SettingsSection> </SettingsSection>
)} )}

View File

@@ -40,7 +40,7 @@
} }
.dark { .dark {
--background: oklch(0.17 0.006 285.885); --background: oklch(0.19 0.006 285.885);
--foreground: oklch(0.985 0 0); --foreground: oklch(0.985 0 0);
--card: oklch(0.21 0.006 285.885); --card: oklch(0.21 0.006 285.885);
--card-foreground: oklch(0.985 0 0); --card-foreground: oklch(0.985 0 0);
@@ -56,7 +56,7 @@
--accent-foreground: oklch(0.985 0 0); --accent-foreground: oklch(0.985 0 0);
--destructive: oklch(0.5382 0.1949 22.216); --destructive: oklch(0.5382 0.1949 22.216);
--border: oklch(1 0 0 / 13%); --border: oklch(1 0 0 / 13%);
--input: oklch(1 0 0 / 15%); --input: oklch(1 0 0 / 18%);
--ring: oklch(0.646 0.222 41.116); --ring: oklch(0.646 0.222 41.116);
--chart-1: oklch(0.488 0.243 264.376); --chart-1: oklch(0.488 0.243 264.376);
--chart-2: oklch(0.696 0.17 162.48); --chart-2: oklch(0.696 0.17 162.48);

View File

@@ -82,6 +82,11 @@ export const orgNavSections = (): SidebarNavSection[] => [
} }
] ]
}, },
{
title: "sidebarDomains",
href: "/{orgId}/settings/domains",
icon: <Globe className="size-4 flex-none" />
},
...(build == "saas" ...(build == "saas"
? [ ? [
{ {
@@ -91,12 +96,7 @@ export const orgNavSections = (): SidebarNavSection[] => [
showEE: true showEE: true
} }
] ]
: []), : [])
{
title: "sidebarDomains",
href: "/{orgId}/settings/domains",
icon: <Globe className="size-4 flex-none" />
}
] ]
}, },
{ {

View File

@@ -114,6 +114,7 @@ export function DNSRecordsDataTable<TData, TValue>({
href="https://docs.pangolin.net/manage/domains" href="https://docs.pangolin.net/manage/domains"
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
className="hidden sm:block"
> >
<Button variant="outline"> <Button variant="outline">
<ExternalLink className="h-4 w-4 mr-1" /> <ExternalLink className="h-4 w-4 mr-1" />

View File

@@ -44,7 +44,7 @@ export function HorizontalTabs({
} }
return ( return (
<div className="space-y-6"> <div className="space-y-3">
<div className="relative"> <div className="relative">
<div className="overflow-x-auto scrollbar-hide"> <div className="overflow-x-auto scrollbar-hide">
<div className="flex space-x-4 border-b min-w-max"> <div className="flex space-x-4 border-b min-w-max">
@@ -66,9 +66,9 @@ export function HorizontalTabs({
key={hydratedHref} key={hydratedHref}
href={isProfessional ? "#" : hydratedHref} href={isProfessional ? "#" : hydratedHref}
className={cn( className={cn(
"px-4 py-2 text-sm font-medium transition-colors whitespace-nowrap", "px-4 py-2 text-sm font-medium transition-colors whitespace-nowrap relative",
isActive isActive
? "border-b-2 border-primary text-primary" ? "text-primary after:absolute after:bottom-0 after:left-0 after:right-0 after:h-0.75 after:bg-primary after:rounded-full"
: "text-muted-foreground hover:text-foreground", : "text-muted-foreground hover:text-foreground",
isDisabled && "cursor-not-allowed" isDisabled && "cursor-not-allowed"
)} )}

View File

@@ -32,6 +32,12 @@ export default function ResourceInfoBox({}: ResourceInfoBoxType) {
<InfoSections <InfoSections
cols={resource.http && env.flags.usePangolinDns ? 5 : 4} cols={resource.http && env.flags.usePangolinDns ? 5 : 4}
> >
<InfoSection>
<InfoSectionTitle>URL</InfoSectionTitle>
<InfoSectionContent>
<CopyToClipboard text={fullUrl} isLink={true} />
</InfoSectionContent>
</InfoSection>
<InfoSection> <InfoSection>
<InfoSectionTitle>{t("identifier")}</InfoSectionTitle> <InfoSectionTitle>{t("identifier")}</InfoSectionTitle>
<InfoSectionContent> <InfoSectionContent>
@@ -62,15 +68,6 @@ export default function ResourceInfoBox({}: ResourceInfoBoxType) {
)} )}
</InfoSectionContent> </InfoSectionContent>
</InfoSection> </InfoSection>
<InfoSection>
<InfoSectionTitle>URL</InfoSectionTitle>
<InfoSectionContent>
<CopyToClipboard
text={fullUrl}
isLink={true}
/>
</InfoSectionContent>
</InfoSection>
{/* {isEnabled && ( {/* {isEnabled && (
<InfoSection> <InfoSection>
<InfoSectionTitle>Socket</InfoSectionTitle> <InfoSectionTitle>Socket</InfoSectionTitle>

View File

@@ -11,7 +11,7 @@ export default function SettingsSectionTitle({
}: SettingsSectionTitleProps) { }: SettingsSectionTitleProps) {
return ( return (
<div <div
className={`space-y-0.5 ${!size || size === "2xl" ? "mb-8 md:mb-8" : ""}`} className={`space-y-0.5 ${!size || size === "2xl" ? "mb-6 md:mb-6" : ""}`}
> >
<h2 <h2
className={`text-${ className={`text-${

View File

@@ -104,6 +104,23 @@ export default function ShareLinksTable({
} }
const columns: ExtendedColumnDef<ShareLinkRow>[] = [ const columns: ExtendedColumnDef<ShareLinkRow>[] = [
{
accessorKey: "title",
friendlyName: t("title"),
header: ({ column }) => {
return (
<Button
variant="ghost"
onClick={() =>
column.toggleSorting(column.getIsSorted() === "asc")
}
>
{t("title")}
<ArrowUpDown className="ml-2 h-4 w-4" />
</Button>
);
}
},
{ {
accessorKey: "resourceName", accessorKey: "resourceName",
enableHiding: false, enableHiding: false,
@@ -135,23 +152,6 @@ export default function ShareLinksTable({
); );
} }
}, },
{
accessorKey: "title",
friendlyName: t("title"),
header: ({ column }) => {
return (
<Button
variant="ghost"
onClick={() =>
column.toggleSorting(column.getIsSorted() === "asc")
}
>
{t("title")}
<ArrowUpDown className="ml-2 h-4 w-4" />
</Button>
);
}
},
// { // {
// accessorKey: "domain", // accessorKey: "domain",
// header: "Link", // header: "Link",