mirror of
https://github.com/fosrl/pangolin.git
synced 2026-06-23 15:51:49 +00:00
standardize and fix branding on new resources auth pages
This commit is contained in:
miloschwartz
@@ -22,7 +22,8 @@ import {
|
||||
CardTitle,
|
||||
CardDescription
|
||||
} from "@app/components/ui/card";
|
||||
import Link from "next/link";
|
||||
import BrandedAuthSurface from "@app/components/BrandedAuthSurface";
|
||||
import PoweredByPangolin from "@app/components/PoweredByPangolin";
|
||||
|
||||
declare module "react" {
|
||||
namespace JSX {
|
||||
@@ -60,10 +61,12 @@ const isIronError = (error: unknown): error is IronError => {
|
||||
|
||||
export default function RdpClient({
|
||||
target,
|
||||
error
|
||||
error,
|
||||
primaryColor
|
||||
}: {
|
||||
target: GetBrowserTargetResponse | null;
|
||||
error: string | null;
|
||||
primaryColor?: string | null;
|
||||
}) {
|
||||
const STORAGE_KEY = "pangolin_rdp_credentials";
|
||||
|
||||
@@ -315,20 +318,8 @@ export default function RdpClient({
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div>
|
||||
<div className="text-center mb-2">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
Powered by{" "}
|
||||
<Link
|
||||
href="https://pangolin.net/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
>
|
||||
Pangolin
|
||||
</Link>
|
||||
</span>
|
||||
</div>
|
||||
<BrandedAuthSurface primaryColor={primaryColor}>
|
||||
<PoweredByPangolin />
|
||||
<Card className="w-full">
|
||||
<CardHeader>
|
||||
<CardTitle>RDP</CardTitle>
|
||||
@@ -337,27 +328,15 @@ export default function RdpClient({
|
||||
<p className="text-destructive text-sm">{error}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</BrandedAuthSurface>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{showLogin && (
|
||||
<div>
|
||||
<div className="text-center mb-2">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
Powered by{" "}
|
||||
<Link
|
||||
href="https://pangolin.net/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
>
|
||||
Pangolin
|
||||
</Link>
|
||||
</span>
|
||||
</div>
|
||||
<BrandedAuthSurface primaryColor={primaryColor}>
|
||||
<PoweredByPangolin />
|
||||
<Card className="w-full">
|
||||
<CardHeader>
|
||||
<CardTitle>Sign in to Remote Desktop</CardTitle>
|
||||
@@ -441,7 +420,7 @@ export default function RdpClient({
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</BrandedAuthSurface>
|
||||
)}
|
||||
|
||||
<div
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { generateBrowserGatewayMetadata } from "@app/lib/browserGatewayMetadata";
|
||||
import { getBrowserTargetForRequest } from "@app/lib/getBrowserTargetForRequest";
|
||||
import { loadOrgLoginPageBranding } from "@app/lib/loadOrgLoginPageBranding";
|
||||
import RdpClient from "./RdpClient";
|
||||
import AuthFooter from "@app/components/AuthFooter";
|
||||
|
||||
@@ -12,12 +13,19 @@ export async function generateMetadata() {
|
||||
export default async function RdpPage() {
|
||||
const { target } = await getBrowserTargetForRequest();
|
||||
const error = target ? null : "No resource found for this domain";
|
||||
const { primaryColor } = target
|
||||
? await loadOrgLoginPageBranding(target.orgId)
|
||||
: { primaryColor: null };
|
||||
|
||||
return (
|
||||
<div className="h-full flex flex-col">
|
||||
<div className="flex-1 flex md:items-center justify-center">
|
||||
<div className="w-full max-w-md p-3">
|
||||
<RdpClient target={target} error={error} />
|
||||
<RdpClient
|
||||
target={target}
|
||||
error={error}
|
||||
primaryColor={primaryColor}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<AuthFooter />
|
||||
|
||||
@@ -20,6 +20,8 @@ import { Alert, AlertDescription } from "@/components/ui/alert";
|
||||
import { HorizontalTabs } from "@app/components/HorizontalTabs";
|
||||
import type { SignSshKeyResponse } from "@server/routers/ssh/types";
|
||||
import { useTranslations } from "next-intl";
|
||||
import BrandedAuthSurface from "@app/components/BrandedAuthSurface";
|
||||
import PoweredByPangolin from "@app/components/PoweredByPangolin";
|
||||
|
||||
type AuthTab = "password" | "privateKey";
|
||||
|
||||
@@ -40,12 +42,14 @@ export default function SshClient({
|
||||
target,
|
||||
error,
|
||||
signedKeyData,
|
||||
privateKey: signedPrivateKey
|
||||
privateKey: signedPrivateKey,
|
||||
primaryColor
|
||||
}: {
|
||||
target: GetBrowserTargetResponse | null;
|
||||
error: string | null;
|
||||
signedKeyData?: SignSshKeyResponse | null;
|
||||
privateKey?: string | null;
|
||||
primaryColor?: string | null;
|
||||
}) {
|
||||
const STORAGE_KEY = "pangolin_ssh_credentials";
|
||||
|
||||
@@ -377,20 +381,8 @@ export default function SshClient({
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div>
|
||||
<div className="text-center mb-2">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
{t("sshPoweredBy")}{" "}
|
||||
<Link
|
||||
href="https://pangolin.net/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
>
|
||||
Pangolin
|
||||
</Link>
|
||||
</span>
|
||||
</div>
|
||||
<BrandedAuthSurface primaryColor={primaryColor}>
|
||||
<PoweredByPangolin />
|
||||
<Card className="w-full">
|
||||
<CardHeader>
|
||||
<CardTitle>{t("sshTitle")}</CardTitle>
|
||||
@@ -399,27 +391,15 @@ export default function SshClient({
|
||||
<p className="text-destructive text-sm">{error}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</BrandedAuthSurface>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{!connected && (
|
||||
<div>
|
||||
<div className="text-center mb-2">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
{t("sshPoweredBy")}{" "}
|
||||
<Link
|
||||
href="https://pangolin.net/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
>
|
||||
Pangolin
|
||||
</Link>
|
||||
</span>
|
||||
</div>
|
||||
<BrandedAuthSurface primaryColor={primaryColor}>
|
||||
<PoweredByPangolin />
|
||||
<Card className="w-full">
|
||||
<CardHeader>
|
||||
<CardTitle>{t("sshSignInTitle")}</CardTitle>
|
||||
@@ -496,10 +476,10 @@ export default function SshClient({
|
||||
href="https://docs.pangolin.net/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline inline-flex items-center gap-1"
|
||||
className="text-primary hover:underline inline-flex items-center gap-1"
|
||||
>
|
||||
{t("sshLearnMore")}
|
||||
<ExternalLink className="h-3 w-3" />
|
||||
<ExternalLink className="size-3.5 shrink-0" />
|
||||
</Link>
|
||||
</p>
|
||||
<Field
|
||||
@@ -573,7 +553,7 @@ export default function SshClient({
|
||||
</HorizontalTabs>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</BrandedAuthSurface>
|
||||
)}
|
||||
|
||||
{connected && (
|
||||
|
||||
@@ -2,6 +2,7 @@ import { headers } from "next/headers";
|
||||
import { priv } from "@app/lib/api";
|
||||
import { generateBrowserGatewayMetadata } from "@app/lib/browserGatewayMetadata";
|
||||
import { getBrowserTargetForRequest } from "@app/lib/getBrowserTargetForRequest";
|
||||
import { loadOrgLoginPageBranding } from "@app/lib/loadOrgLoginPageBranding";
|
||||
import { AxiosResponse } from "axios";
|
||||
import { GetBrowserTargetResponse } from "@server/routers/browserGatewayTarget";
|
||||
import SshClient from "./SshClient";
|
||||
@@ -154,6 +155,10 @@ export default async function SshPage() {
|
||||
}
|
||||
}
|
||||
|
||||
const { primaryColor } = target
|
||||
? await loadOrgLoginPageBranding(target.orgId)
|
||||
: { primaryColor: null };
|
||||
|
||||
return (
|
||||
<div className="h-full flex flex-col">
|
||||
<div className="flex-1 flex md:items-center justify-center">
|
||||
@@ -163,6 +168,7 @@ export default async function SshPage() {
|
||||
error={error}
|
||||
signedKeyData={signedKeyData}
|
||||
privateKey={privateKey}
|
||||
primaryColor={primaryColor}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -13,7 +13,8 @@ import {
|
||||
CardTitle,
|
||||
CardDescription
|
||||
} from "@app/components/ui/card";
|
||||
import Link from "next/link";
|
||||
import BrandedAuthSurface from "@app/components/BrandedAuthSurface";
|
||||
import PoweredByPangolin from "@app/components/PoweredByPangolin";
|
||||
|
||||
type FormState = {
|
||||
password: string;
|
||||
@@ -21,10 +22,12 @@ type FormState = {
|
||||
|
||||
export default function VncClient({
|
||||
target,
|
||||
error
|
||||
error,
|
||||
primaryColor
|
||||
}: {
|
||||
target: GetBrowserTargetResponse | null;
|
||||
error: string | null;
|
||||
primaryColor?: string | null;
|
||||
}) {
|
||||
const STORAGE_KEY = "pangolin_vnc_credentials";
|
||||
|
||||
@@ -152,20 +155,8 @@ export default function VncClient({
|
||||
|
||||
if (error) {
|
||||
return (
|
||||
<div>
|
||||
<div className="text-center mb-2">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
Powered by{" "}
|
||||
<Link
|
||||
href="https://pangolin.net/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
>
|
||||
Pangolin
|
||||
</Link>
|
||||
</span>
|
||||
</div>
|
||||
<BrandedAuthSurface primaryColor={primaryColor}>
|
||||
<PoweredByPangolin />
|
||||
<Card className="w-full">
|
||||
<CardHeader>
|
||||
<CardTitle>VNC</CardTitle>
|
||||
@@ -174,27 +165,15 @@ export default function VncClient({
|
||||
<p className="text-destructive text-sm">{error}</p>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</BrandedAuthSurface>
|
||||
);
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
{!connected && (
|
||||
<div>
|
||||
<div className="text-center mb-2">
|
||||
<span className="text-sm text-muted-foreground">
|
||||
Powered by{" "}
|
||||
<Link
|
||||
href="https://pangolin.net/"
|
||||
target="_blank"
|
||||
rel="noopener noreferrer"
|
||||
className="underline"
|
||||
>
|
||||
Pangolin
|
||||
</Link>
|
||||
</span>
|
||||
</div>
|
||||
<BrandedAuthSurface primaryColor={primaryColor}>
|
||||
<PoweredByPangolin />
|
||||
<Card className="w-full">
|
||||
<CardHeader>
|
||||
<CardTitle>VNC</CardTitle>
|
||||
@@ -224,7 +203,7 @@ export default function VncClient({
|
||||
</div>
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
</BrandedAuthSurface>
|
||||
)}
|
||||
|
||||
<div
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
import { generateBrowserGatewayMetadata } from "@app/lib/browserGatewayMetadata";
|
||||
import { getBrowserTargetForRequest } from "@app/lib/getBrowserTargetForRequest";
|
||||
import { loadOrgLoginPageBranding } from "@app/lib/loadOrgLoginPageBranding";
|
||||
import VncClient from "./VncClient";
|
||||
import AuthFooter from "@app/components/AuthFooter";
|
||||
|
||||
@@ -12,12 +13,19 @@ export async function generateMetadata() {
|
||||
export default async function VncPage() {
|
||||
const { target } = await getBrowserTargetForRequest();
|
||||
const error = target ? null : "No resource found for this domain";
|
||||
const { primaryColor } = target
|
||||
? await loadOrgLoginPageBranding(target.orgId)
|
||||
: { primaryColor: null };
|
||||
|
||||
return (
|
||||
<div className="h-full flex flex-col">
|
||||
<div className="flex-1 flex md:items-center justify-center">
|
||||
<div className="w-full max-w-md p-3">
|
||||
<VncClient target={target} error={error} />
|
||||
<VncClient
|
||||
target={target}
|
||||
error={error}
|
||||
primaryColor={primaryColor}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<AuthFooter />
|
||||
|
||||
Reference in New Issue
Block a user