3pp-mirror/rallly
1
0
Fork 0
mirror of https://github.com/lukevella/rallly.git synced 2025-07-30 06:29:11 +02:00
Code Issues Projects Releases Packages Wiki Activity

💄 Add loading ui to auth pages (#953)

Browse source
This commit is contained in:
Luke Vella 2023-12-04 11:57:10 +07:00 • committed by GitHub
parent de2ebf567a
commit 28599e7a78
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 15 additions and 12 deletions
Download patch file Download diff file Expand all files Collapse all files

9
apps/web/src/app/[locale]/(auth)/login/loading.tsx Normal file
View file

@ -0,0 +1,9 @@
import { Spinner } from "@/components/spinner";
export default function Loading() {
return (
<div className="flex justify-center items-center h-72">
<Spinner className="text-muted-foreground" />
</div>
);
}

6
apps/web/src/app/[locale]/(auth)/login/page.tsx
View file

@ -5,11 +5,11 @@ import { LoginForm } from "@/app/[locale]/(auth)/login/login-form";
import { Params } from "@/app/[locale]/types"; import { Params } from "@/app/[locale]/types";
import { getTranslation } from "@/app/i18n"; import { getTranslation } from "@/app/i18n";
import { AuthCard } from "@/components/auth/auth-layout"; import { AuthCard } from "@/components/auth/auth-layout";
import { isOIDCEnabled, isSelfHosted, oidcName } from "@/utils/constants"; import { isOIDCEnabled, oidcName } from "@/utils/constants";
// Self-hosted instances only have env vars for OIDC at runtime, so we need to // Self-hosted instances only have env vars for OIDC at runtime, so we need to
// use force-dynamic to avoid statically rendering this page during build time.. // use force-dynamic to avoid statically rendering this page during build time.
export const dynamic = isSelfHosted ? "force-dynamic" : "auto"; export const dynamic = "force-dynamic";
export default async function LoginPage({ params }: { params: Params }) { export default async function LoginPage({ params }: { params: Params }) {
const { t } = await getTranslation(params.locale); const { t } = await getTranslation(params.locale);

10
apps/web/src/components/login-link.tsx
View file

@ -1,23 +1,17 @@
import Link, { LinkProps } from "next/link"; import Link, { LinkProps } from "next/link";
import { usePathname, useRouter } from "next/navigation"; import { usePathname } from "next/navigation";
import React from "react"; import React from "react";
export const LoginLink = React.forwardRef< export const LoginLink = React.forwardRef<
HTMLAnchorElement, HTMLAnchorElement,
React.PropsWithChildren<Omit<LinkProps, "href"> & { className?: string }> React.PropsWithChildren<Omit<LinkProps, "href"> & { className?: string }>
>(function LoginLink({ children, ...props }, ref) { >(function LoginLink({ children, ...props }, ref) {
const router = useRouter();
const pathname = usePathname() ?? "/"; const pathname = usePathname() ?? "/";
return ( return (
<Link <Link
ref={ref} ref={ref}
{...props} {...props}
href="/login" href={`/login?callbackUrl=${encodeURIComponent(pathname)}`}
onClick={async (e) => {
e.preventDefault();
props.onClick?.(e);
router.push("/login?callbackUrl=" + encodeURIComponent(pathname));
}}
> >
{children} {children}
</Link> </Link>

2
apps/web/src/utils/auth.ts
View file

@ -25,7 +25,7 @@ import { emailClient } from "@/utils/emails";
const providers: Provider[] = [ const providers: Provider[] = [
// When a user registers, we don't want to go through the email verification process // When a user registers, we don't want to go through the email verification process
// so this providers allows us exchange the registration token for a session token // so this provider allows us exchange the registration token for a session token
CredentialsProvider({ CredentialsProvider({
id: "registration-token", id: "registration-token",
name: "Registration Token", name: "Registration Token",