mirror/fosrl.pangolin
1
0
Fork 0
mirror of https://github.com/fosrl/pangolin.git synced 2025-07-23 20:24:34 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

add branding logo component

Browse source
This commit is contained in:
miloschwartz 2025-07-15 16:24:16 -07:00
parent e99905e3c9
commit 19d54778f5
No known key found for this signature in database
5 changed files with 97 additions and 61 deletions
Download patch file Download diff file Expand all files Collapse all files

8
server/setup/copyInConfig.ts
View file

@ -69,7 +69,13 @@ async function copyInDomains() {
} else {
await trx
.insert(domains)
.values({ domainId, baseDomain, configManaged: true, type: "wildcard" })
.values({
domainId,
baseDomain,
configManaged: true,
type: "wildcard",
verified: true
})
.execute();
}
}

23
src/app/[orgId]/settings/domains/DomainsTable.tsx
View file

@ -210,18 +210,17 @@ export default function DomainsTable({ domains }: Props) {
: t("restart", { fallback: "Restart" })}
</Button>
)}
{!domain.configManaged && (
<Button
variant="secondary"
size="sm"
onClick={() => {
setSelectedDomain(domain);
setIsDeleteModalOpen(true);
}}
>
{t("delete")}
</Button>
)}
<Button
variant="secondary"
size="sm"
disabled={domain.configManaged}
onClick={() => {
setSelectedDomain(domain);
setIsDeleteModalOpen(true);
}}
>
{t("delete")}
</Button>
</div>
);
}

41
src/app/auth/login/DashboardLoginForm.tsx
View file

@ -14,6 +14,7 @@ import { useRouter } from "next/navigation";
import { useEffect } from "react";
import Image from "next/image";
import { cleanRedirect } from "@app/lib/cleanRedirect";
import BrandingLogo from "@app/components/BrandingLogo";
import { useTranslations } from "next-intl";
type DashboardLoginFormProps = {
@ -26,42 +27,24 @@ export default function DashboardLoginForm({
idps
}: DashboardLoginFormProps) {
const router = useRouter();
// const api = createApiClient(useEnvContext());
//
// useEffect(() => {
// const logout = async () => {
// try {
// await api.post("/auth/logout");
// console.log("user logged out");
// } catch (e) {}
// };
//
// logout();
// });
const { env } = useEnvContext();
const t = useTranslations();
function getSubtitle() {
return t("loginStart");
}
return (
<Card className="w-full max-w-md">
<CardHeader>
<Card className="shadow-md w-full max-w-md">
<CardHeader className="border-b">
<div className="flex flex-row items-center justify-center">
<Image
src={`/logo/pangolin_orange.svg`}
alt={t('pangolinLogoAlt')}
width={100}
height={100}
/>
<BrandingLogo height={58} width={175} />
</div>
<div className="text-center space-y-1">
<h1 className="text-2xl font-bold mt-1">
{t('welcome')}
</h1>
<p className="text-sm text-muted-foreground">
{t('loginStart')}
</p>
<div className="text-center space-y-1 pt-3">
<p className="text-muted-foreground">{getSubtitle()}</p>
</div>
</CardHeader>
<CardContent>
<CardContent className="pt-6">
<LoginForm
redirect={redirect}
idps={idps}

36
src/app/auth/signup/SignupForm.tsx
View file

@ -32,6 +32,7 @@ import { useEnvContext } from "@app/hooks/useEnvContext";
import Image from "next/image";
import { cleanRedirect } from "@app/lib/cleanRedirect";
import { useTranslations } from "next-intl";
import BrandingLogo from "@app/components/BrandingLogo";
type SignupFormProps = {
redirect?: string;
@ -88,9 +89,7 @@ export default function SignupForm({
})
.catch((e) => {
console.error(e);
setError(
formatAxiosError(e, t('signupError'))
);
setError(formatAxiosError(e, t("signupError")));
});
if (res && res.status === 200) {
@ -117,24 +116,21 @@ export default function SignupForm({
setLoading(false);
}
function getSubtitle() {
return t("authCreateAccount");
}
return (
<Card className="w-full max-w-md shadow-md">
<CardHeader className="border-b">
<div className="flex flex-row items-center justify-center">
<Image
src={`/logo/pangolin_orange.svg`}
alt={t('pangolinLogoAlt')}
width="100"
height="100"
<BrandingLogo
height={58}
width={175}
/>
</div>
<div className="text-center space-y-1">
<h1 className="text-2xl font-bold mt-1">
{t('welcome')}
</h1>
<p className="text-sm text-muted-foreground">
{t('authCreateAccount')}
</p>
<div className="text-center space-y-1 pt-3">
<p className="text-muted-foreground">{getSubtitle()}</p>
</div>
</CardHeader>
<CardContent className="pt-6">
@ -148,7 +144,7 @@ export default function SignupForm({
name="email"
render={({ field }) => (
<FormItem>
<FormLabel>{t('email')}</FormLabel>
<FormLabel>{t("email")}</FormLabel>
<FormControl>
<Input {...field} />
</FormControl>
@ -161,7 +157,7 @@ export default function SignupForm({
name="password"
render={({ field }) => (
<FormItem>
<FormLabel>{t('password')}</FormLabel>
<FormLabel>{t("password")}</FormLabel>
<FormControl>
<Input type="password" {...field} />
</FormControl>
@ -174,7 +170,9 @@ export default function SignupForm({
name="confirmPassword"
render={({ field }) => (
<FormItem>
<FormLabel>{t('confirmPassword')}</FormLabel>
<FormLabel>
{t("confirmPassword")}
</FormLabel>
<FormControl>
<Input type="password" {...field} />
</FormControl>
@ -190,7 +188,7 @@ export default function SignupForm({
)}
<Button type="submit" className="w-full">
{t('createAccount')}
{t("createAccount")}
</Button>
</form>
</Form>

50
src/components/BrandingLogo.tsx Normal file
View file

@ -0,0 +1,50 @@
"use client";
import { useEnvContext } from "@app/hooks/useEnvContext";
import { useTheme } from "next-themes";
import Image from "next/image";
import { useEffect, useState } from "react";
type BrandingLogoProps = {
width: number;
height: number;
};
export default function BrandingLogo(props: BrandingLogoProps) {
const { env } = useEnvContext();
const { theme } = useTheme();
const [path, setPath] = useState<string>(""); // Default logo path
useEffect(() => {
function getPath() {
let lightOrDark = theme;
if (theme === "system" || !theme) {
lightOrDark = window.matchMedia("(prefers-color-scheme: dark)")
.matches
? "dark"
: "light";
}
if (lightOrDark === "light") {
return "/logo/word_mark_black.png";
}
return "/logo/word_mark_white.png";
}
const path = getPath();
setPath(path);
}, [theme, env]);
return (
path && (
<Image
src={path}
alt="Logo"
width={props.width}
height={props.height}
/>
)
);
}