.env.development

@@ -3,6 +3,7 @@
 # SUPABASE_ANON_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InFzc3Npa3pnd29tdWRrd2ZtZ2FkIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NTQzMjY1NTQsImV4cCI6MjA2OTkwMjU1NH0.BTSscdTcPP1GVmMB-H5caLpWsfuAw1V6mXiqogF8TjU"
 DATABASE_URL="postgresql://postgres.qsssikzgwomudkwfmgad:Wrongly1-Untimed0-Peculiar0-Unlikable7-Cubbyhole8@aws-0-eu-north-1.pooler.supabase.com:6543/postgres"
 APIKEY_MAPS="AIzaSyAwfOShBqkBcS46WqmlsIVWQJ8gpdOPk_4"
-VITE_SUPABASE_URL="https://qsssikzgwomudkwfmgad.supabase.co"
+SUPABASE_URL="https://qsssikzgwomudkwfmgad.supabase.co"
-VITE_SUPABASE_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InFzc3Npa3pnd29tdWRrd2ZtZ2FkIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NTQzMjY1NTQsImV4cCI6MjA2OTkwMjU1NH0.BTSscdTcPP1GVmMB-H5caLpWsfuAw1V6mXiqogF8TjU"
+SUPABASE_KEY="eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJpc3MiOiJzdXBhYmFzZSIsInJlZiI6InFzc3Npa3pnd29tdWRrd2ZtZ2FkIiwicm9sZSI6ImFub24iLCJpYXQiOjE3NTQzMjY1NTQsImV4cCI6MjA2OTkwMjU1NH0.BTSscdTcPP1GVmMB-H5caLpWsfuAw1V6mXiqogF8TjU"
-        
+VITE_LOGIN_USER="test@test.com"
+VITE_PASSWORD_USER=""

src/integrations/supabase/supabase.ts

@@ -3,10 +3,10 @@ import { createServerOnlyFn } from "@tanstack/react-start"
 import { getCookies, setCookie } from "@tanstack/react-start/server"
 
 const supabase_url = createServerOnlyFn(
-	() => process.env.VITE_SUPABASE_URL as string
+	() => process.env.SUPABASE_URL as string
 )
 const supabase_key = createServerOnlyFn(
-	() => process.env.VITE_SUPABASE_KEY as string
+	() => process.env.SUPABASE_KEY as string
 )
 
 export function getSupabaseServerClient() {

src/routeTree.gen.ts

@@ -9,6 +9,8 @@
 // Additionally, you should also exclude this file from your linter and/or formatter to prevent it from being checked or modified.
 
 import { Route as rootRouteImport } from './routes/__root'
+import { Route as LogoutRouteImport } from './routes/logout'
+import { Route as LoginRouteImport } from './routes/login'
 import { Route as AccessRouteImport } from './routes/access'
 import { Route as AuthedRouteImport } from './routes/_authed'
 import { Route as IndexRouteImport } from './routes/index'
@@ -19,6 +21,16 @@ import { Route as AccessLoginRouteImport } from './routes/access.login'
 import { Route as AuthedDashboardRouteImport } from './routes/_authed/dashboard'
 import { Route as DemoSentryTestingRouteImport } from './routes/demo/sentry.testing'
 
+const LogoutRoute = LogoutRouteImport.update({
+  id: '/logout',
+  path: '/logout',
+  getParentRoute: () => rootRouteImport,
+} as any)
+const LoginRoute = LoginRouteImport.update({
+  id: '/login',
+  path: '/login',
+  getParentRoute: () => rootRouteImport,
+} as any)
 const AccessRoute = AccessRouteImport.update({
   id: '/access',
   path: '/access',
@@ -67,6 +79,8 @@ const DemoSentryTestingRoute = DemoSentryTestingRouteImport.update({
 export interface FileRoutesByFullPath {
   '/': typeof IndexRoute
   '/access': typeof AccessRouteWithChildren
+  '/login': typeof LoginRoute
+  '/logout': typeof LogoutRoute
   '/dashboard': typeof AuthedDashboardRoute
   '/access/login': typeof AccessLoginRoute
   '/access/register': typeof AccessRegisterRoute
@@ -77,6 +91,8 @@ export interface FileRoutesByFullPath {
 export interface FileRoutesByTo {
   '/': typeof IndexRoute
   '/access': typeof AccessRouteWithChildren
+  '/login': typeof LoginRoute
+  '/logout': typeof LogoutRoute
   '/dashboard': typeof AuthedDashboardRoute
   '/access/login': typeof AccessLoginRoute
   '/access/register': typeof AccessRegisterRoute
@@ -89,6 +105,8 @@ export interface FileRoutesById {
   '/': typeof IndexRoute
   '/_authed': typeof AuthedRouteWithChildren
   '/access': typeof AccessRouteWithChildren
+  '/login': typeof LoginRoute
+  '/logout': typeof LogoutRoute
   '/_authed/dashboard': typeof AuthedDashboardRoute
   '/access/login': typeof AccessLoginRoute
   '/access/register': typeof AccessRegisterRoute
@@ -101,6 +119,8 @@ export interface FileRouteTypes {
   fullPaths:
     | '/'
     | '/access'
+    | '/login'
+    | '/logout'
     | '/dashboard'
     | '/access/login'
     | '/access/register'
@@ -111,6 +131,8 @@ export interface FileRouteTypes {
   to:
     | '/'
     | '/access'
+    | '/login'
+    | '/logout'
     | '/dashboard'
     | '/access/login'
     | '/access/register'
@@ -122,6 +144,8 @@ export interface FileRouteTypes {
     | '/'
     | '/_authed'
     | '/access'
+    | '/login'
+    | '/logout'
     | '/_authed/dashboard'
     | '/access/login'
     | '/access/register'
@@ -134,6 +158,8 @@ export interface RootRouteChildren {
   IndexRoute: typeof IndexRoute
   AuthedRoute: typeof AuthedRouteWithChildren
   AccessRoute: typeof AccessRouteWithChildren
+  LoginRoute: typeof LoginRoute
+  LogoutRoute: typeof LogoutRoute
   DemoI18nRoute: typeof DemoI18nRoute
   DemoTanstackQueryRoute: typeof DemoTanstackQueryRoute
   DemoSentryTestingRoute: typeof DemoSentryTestingRoute
@@ -141,6 +167,20 @@ export interface RootRouteChildren {
 
 declare module '@tanstack/react-router' {
   interface FileRoutesByPath {
+    '/logout': {
+      id: '/logout'
+      path: '/logout'
+      fullPath: '/logout'
+      preLoaderRoute: typeof LogoutRouteImport
+      parentRoute: typeof rootRouteImport
+    }
+    '/login': {
+      id: '/login'
+      path: '/login'
+      fullPath: '/login'
+      preLoaderRoute: typeof LoginRouteImport
+      parentRoute: typeof rootRouteImport
+    }
     '/access': {
       id: '/access'
       path: '/access'
@@ -235,6 +275,8 @@ const rootRouteChildren: RootRouteChildren = {
   IndexRoute: IndexRoute,
   AuthedRoute: AuthedRouteWithChildren,
   AccessRoute: AccessRouteWithChildren,
+  LoginRoute: LoginRoute,
+  LogoutRoute: LogoutRoute,
   DemoI18nRoute: DemoI18nRoute,
   DemoTanstackQueryRoute: DemoTanstackQueryRoute,
   DemoSentryTestingRoute: DemoSentryTestingRoute,

src/routes/__root.tsx

@@ -21,7 +21,9 @@ export const Route = createRootRouteWithContext<MyRouterContext>()({
 		if (typeof document !== "undefined") {
 			document.documentElement.setAttribute("lang", getLocale())
 		}
-		return await user.userData()
+		return {
+			user: await user.userData()
+		}
 	},
 	head: () => ({
 		meta: [

src/routes/access.register.tsx

@@ -1,4 +1,13 @@
-import { Button, Form, Input, Label, Spinner } from "@heroui/react"
+import {
+	Button,
+	FieldError,
+	Fieldset,
+	Form,
+	Input,
+	Label,
+	Spinner,
+	TextField
+} from "@heroui/react"
 import { createFileRoute } from "@tanstack/react-router"
 import { LogIn } from "lucide-react"
 import { useSignup } from "@/lib/hooks/useSignup"
@@ -29,28 +38,32 @@ function RouteComponent() {
 	return (
 		<div>
 			<Form onSubmit={handleFormSubmit} className="flex flex-col gap-4">
-				<Label isRequired className="ml-4 text-lg">
+				<Fieldset>
-					Correo
+					<Fieldset.Group>
-				</Label>
+						<TextField
-				<Input
-					placeholder="Introduce tu correo"
 							type="email"
 							name="email"
 							variant="secondary"
 							className="py-4 text-lg"
-					required
+							isRequired
-				/>
+						>
-				<Label isRequired className="ml-4 text-lg">
+							<Label>Correo</Label>
-					Contraseña
+							<Input placeholder="Introduce tu correo" />
-				</Label>
+							<FieldError />
-				<Input
+						</TextField>
-					placeholder="Introduce tu contraseña"
+					</Fieldset.Group>
+				</Fieldset>
+				<TextField
 					type="password"
 					name="password"
 					variant="secondary"
 					className="py-4 text-lg"
-					required
+					isRequired
-				/>
+				>
+					<Label>Contraseña</Label>
+					<Input placeholder="Introduce tu contraseña" />
+					<FieldError />
+				</TextField>
 				<div className="flex justify-end">
 					<Button
 						type="submit"

src/routes/login.tsx

@@ -0,0 +1,11 @@
+import { createFileRoute, redirect } from "@tanstack/react-router"
+
+export const Route = createFileRoute("/login")({
+	beforeLoad: () => {
+		redirect({
+			to: "/access/login",
+			replace: true,
+			throw: true
+		})
+	}
+})

src/routes/logout.tsx

@@ -0,0 +1,5 @@
+import { createFileRoute } from "@tanstack/react-router"
+
+export const Route = createFileRoute("/logout")({
+	beforeLoad: async ({ context }) => {}
+})