From c78520ec9a26b0e7a711006d3fb69d64cc4649e3 Mon Sep 17 00:00:00 2001 From: Huilensolis Date: Fri, 17 May 2024 13:36:42 -0300 Subject: [PATCH 1/2] feat: add anonymous sign in - not working because of webpack error on server action call --- src/actions/create-profile.ts | 28 ++++++++++ src/actions/new-post.ts | 2 +- .../revalidate-path/{index.tsx => index.ts} | 0 src/actions/update-profile.ts | 2 +- src/app/(site)/(guest)/auth/log-in/page.tsx | 9 ++++ .../(guest)/auth/sign-up/callback/route.ts | 3 +- src/app/(site)/(guest)/auth/sign-up/page.tsx | 9 ++++ .../feature/sign-in-anonymously/index.tsx | 52 +++++++++++++++++++ src/middleware.ts | 2 +- 9 files changed, 103 insertions(+), 4 deletions(-) create mode 100644 src/actions/create-profile.ts rename src/actions/revalidate-path/{index.tsx => index.ts} (100%) create mode 100644 src/components/feature/sign-in-anonymously/index.tsx diff --git a/src/actions/create-profile.ts b/src/actions/create-profile.ts new file mode 100644 index 0000000..1b5cb31 --- /dev/null +++ b/src/actions/create-profile.ts @@ -0,0 +1,28 @@ +"use server"; + +import { getSuapabaseServerComponent } from "@/supabase/models/index.models"; +import { randomUUID } from "crypto"; + +export async function createDefaultProfile() { + const supabase = getSuapabaseServerComponent(); + + const randomUsername = randomUUID({ disableEntropyCache: true }).slice(0, 12); + + const { + data: { user }, + } = await supabase.auth.getUser(); + + if (!user) throw new Error("error getting user"); + + const { error: errorCreatingUserProfile } = await supabase + .from("profiles") + .insert({ + name: randomUsername, + user_id: user.id, + username: randomUsername, + }); + + if (errorCreatingUserProfile) { + throw new Error("error creating profile"); + } +} diff --git a/src/actions/new-post.ts b/src/actions/new-post.ts index 4dc6bc3..b3c8ce9 100644 --- a/src/actions/new-post.ts +++ b/src/actions/new-post.ts @@ -31,7 +31,7 @@ export async function createNewPost( throw new Error("error validating formData schema"); } - const supabase = await getSuapabaseServerComponent(); + const supabase = getSuapabaseServerComponent(); let imageUrl: string | null = null; diff --git a/src/actions/revalidate-path/index.tsx b/src/actions/revalidate-path/index.ts similarity index 100% rename from src/actions/revalidate-path/index.tsx rename to src/actions/revalidate-path/index.ts diff --git a/src/actions/update-profile.ts b/src/actions/update-profile.ts index d23c623..62e58f8 100644 --- a/src/actions/update-profile.ts +++ b/src/actions/update-profile.ts @@ -34,7 +34,7 @@ export async function updateProfile(formData: TFormData) { if (!originUrl) throw new Error("no origin header found"); - const supabase = await getSuapabaseServerComponent(); + const supabase = getSuapabaseServerComponent(); const { data: { session }, diff --git a/src/app/(site)/(guest)/auth/log-in/page.tsx b/src/app/(site)/(guest)/auth/log-in/page.tsx index 711a2a2..e136913 100644 --- a/src/app/(site)/(guest)/auth/log-in/page.tsx +++ b/src/app/(site)/(guest)/auth/log-in/page.tsx @@ -12,6 +12,7 @@ import { Logo } from "@/components/ui/logo"; import { AuthFormAreas } from "../auth-form.models"; import { Alert } from "@/components/ui/alert"; import { useProtectRouteFromAuthUsers } from "@/utils/auth-validations/client-side-validations"; +import { SignInAnonymouslyBtn } from "@/components/feature/sign-in-anonymously"; export default function LogInPage() { const [errorLogginIn, setErrorLogginIn] = useState(false); @@ -154,6 +155,14 @@ export default function LogInPage() { )} +
+
+
+ or +
+
+ +
); } diff --git a/src/app/(site)/(guest)/auth/sign-up/callback/route.ts b/src/app/(site)/(guest)/auth/sign-up/callback/route.ts index 4dacfc6..0586dab 100644 --- a/src/app/(site)/(guest)/auth/sign-up/callback/route.ts +++ b/src/app/(site)/(guest)/auth/sign-up/callback/route.ts @@ -28,10 +28,11 @@ export async function GET(request: NextRequest) { 0, 12, ); + const { error: errorCreatingUserProfile } = await supabase .from("profiles") .insert({ - name: user.email?.split("@")[0], + name: randomUsername, user_id: user.id, username: randomUsername, }); diff --git a/src/app/(site)/(guest)/auth/sign-up/page.tsx b/src/app/(site)/(guest)/auth/sign-up/page.tsx index a037582..cbbeaab 100644 --- a/src/app/(site)/(guest)/auth/sign-up/page.tsx +++ b/src/app/(site)/(guest)/auth/sign-up/page.tsx @@ -11,6 +11,7 @@ import { useState } from "react"; import { Alert } from "@/components/ui/alert"; import Link from "next/link"; import { useProtectRouteFromAuthUsers } from "@/utils/auth-validations/client-side-validations"; +import { SignInAnonymouslyBtn } from "@/components/feature/sign-in-anonymously"; export default function SingUpPage() { const [wasEmailSent, setWasEmailSent] = useState(false); @@ -138,6 +139,14 @@ export default function SingUpPage() { /> )} +
+
+
+ or +
+
+ +
); } diff --git a/src/components/feature/sign-in-anonymously/index.tsx b/src/components/feature/sign-in-anonymously/index.tsx new file mode 100644 index 0000000..7fc4997 --- /dev/null +++ b/src/components/feature/sign-in-anonymously/index.tsx @@ -0,0 +1,52 @@ +"use client"; + +import { createDefaultProfile } from "@/actions/create-profile"; +import { PlainButton } from "@/components/ui/buttons/plain"; +import { useSupabase } from "@/hooks/use-supabase"; +import { ClientRouting } from "@/models/routing/client"; +import { VenetianMask } from "lucide-react"; +import { useRouter } from "next/navigation"; +import { useState } from "react"; + +export function SignInAnonymouslyBtn() { + const [loading, setLoading] = useState(false); + const [error, setError] = useState(""); + + const { supabase } = useSupabase(); + + const router = useRouter(); + + async function SignInAnonymously() { + setLoading(true); + + try { + const { error } = await supabase.auth.signInAnonymously(); + + if (error) { + setError("there has been an error"); + setLoading(false); + return; + } + + await createDefaultProfile(); + + router.push(ClientRouting.app); + } catch (error) { + console.log({ error }); + } + } + + return ( + <> + + Sign In Anonymously + + {error &&

{error}

} + + ); +} diff --git a/src/middleware.ts b/src/middleware.ts index 6e0e807..9ea01fb 100644 --- a/src/middleware.ts +++ b/src/middleware.ts @@ -34,8 +34,8 @@ export async function middleware(req: NextRequest) { // if the path is only for unauthenticated users, we only allow unauthenticated users if (isPathUnauthenticated) { if (session) { - console.log({ session }); console.log("path is protected for authenticated users, redirecting"); + console.log(req.nextUrl.origin); return NextResponse.redirect(`${req.nextUrl.origin}/`); } else { return res; From 97fd2549e1e902d514e150b9a46834ba6354cba4 Mon Sep 17 00:00:00 2001 From: Huilensolis Date: Fri, 17 May 2024 13:46:37 -0300 Subject: [PATCH 2/2] feat: add anonymous sign in - not working because of webpack error on server action call --- src/components/feature/sign-in-anonymously/index.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/feature/sign-in-anonymously/index.tsx b/src/components/feature/sign-in-anonymously/index.tsx index 7fc4997..42ef884 100644 --- a/src/components/feature/sign-in-anonymously/index.tsx +++ b/src/components/feature/sign-in-anonymously/index.tsx @@ -42,7 +42,7 @@ export function SignInAnonymouslyBtn() { className="bg-indigo-600 dark:bg-indigo-700 text-neutral-50" isLoading={loading} disabled={loading} - onClick={SignInAnonymously} + onClick={() => SignInAnonymously()} > Sign In Anonymously