package.json

@@ -26,6 +26,7 @@
     "@tanstack/react-start": "^1.166.8",
     "@tanstack/router-plugin": "^1.166.7",
     "lucide-react": "^0.577.0",
+    "maplibre-gl": "^5.19.0",
     "nitro": "^3.0.1-alpha.2",
     "react": "^19.2.4",
     "react-dom": "^19.2.4",
@@ -49,7 +50,6 @@
     "typescript": "^5.9.3",
     "vite": "^7.3.1",
     "vite-tsconfig-paths": "^6.1.1",
-    "vitest": "^3.2.4",
+    "vitest": "^3.2.4"
-    "@inlang/cli": "^3.0.0"
   }
 }

src/lib/utils.ts

@@ -0,0 +1,6 @@
+import { type ClassValue, clsx } from "clsx"
+import { twMerge } from "tailwind-merge"
+
+export function cn(...inputs: ClassValue[]) {
+	return twMerge(clsx(inputs))
+}

src/routeTree.gen.ts

@@ -16,9 +16,13 @@ import { Route as AuthedRouteImport } from './routes/_authed'
 import { Route as IndexRouteImport } from './routes/index'
 import { Route as DemoTanstackQueryRouteImport } from './routes/demo/tanstack-query'
 import { Route as DemoI18nRouteImport } from './routes/demo.i18n'
+<<<<<<< HEAD
 import { Route as AccessRegisterRouteImport } from './routes/access.register'
 import { Route as AccessLoginRouteImport } from './routes/access.login'
 import { Route as AuthedDashboardRouteImport } from './routes/_authed/dashboard'
+=======
+import { Route as AuthDashboardRouteImport } from './routes/auth/dashboard'
+>>>>>>> main
 import { Route as DemoSentryTestingRouteImport } from './routes/demo/sentry.testing'
 
 const LogoutRoute = LogoutRouteImport.update({
@@ -55,6 +59,7 @@ const DemoI18nRoute = DemoI18nRouteImport.update({
   path: '/demo/i18n',
   getParentRoute: () => rootRouteImport,
 } as any)
+<<<<<<< HEAD
 const AccessRegisterRoute = AccessRegisterRouteImport.update({
   id: '/register',
   path: '/register',
@@ -69,6 +74,12 @@ const AuthedDashboardRoute = AuthedDashboardRouteImport.update({
   id: '/dashboard',
   path: '/dashboard',
   getParentRoute: () => AuthedRoute,
+=======
+const AuthDashboardRoute = AuthDashboardRouteImport.update({
+  id: '/auth/dashboard',
+  path: '/auth/dashboard',
+  getParentRoute: () => rootRouteImport,
+>>>>>>> main
 } as any)
 const DemoSentryTestingRoute = DemoSentryTestingRouteImport.update({
   id: '/demo/sentry/testing',
@@ -78,24 +89,34 @@ const DemoSentryTestingRoute = DemoSentryTestingRouteImport.update({
 
 export interface FileRoutesByFullPath {
   '/': typeof IndexRoute
+<<<<<<< HEAD
   '/access': typeof AccessRouteWithChildren
   '/login': typeof LoginRoute
   '/logout': typeof LogoutRoute
   '/dashboard': typeof AuthedDashboardRoute
   '/access/login': typeof AccessLoginRoute
   '/access/register': typeof AccessRegisterRoute
+=======
+  '/login': typeof LoginRouteRoute
+  '/auth/dashboard': typeof AuthDashboardRoute
+>>>>>>> main
   '/demo/i18n': typeof DemoI18nRoute
   '/demo/tanstack-query': typeof DemoTanstackQueryRoute
   '/demo/sentry/testing': typeof DemoSentryTestingRoute
 }
 export interface FileRoutesByTo {
   '/': typeof IndexRoute
+<<<<<<< HEAD
   '/access': typeof AccessRouteWithChildren
   '/login': typeof LoginRoute
   '/logout': typeof LogoutRoute
   '/dashboard': typeof AuthedDashboardRoute
   '/access/login': typeof AccessLoginRoute
   '/access/register': typeof AccessRegisterRoute
+=======
+  '/login': typeof LoginRouteRoute
+  '/auth/dashboard': typeof AuthDashboardRoute
+>>>>>>> main
   '/demo/i18n': typeof DemoI18nRoute
   '/demo/tanstack-query': typeof DemoTanstackQueryRoute
   '/demo/sentry/testing': typeof DemoSentryTestingRoute
@@ -103,6 +124,7 @@ export interface FileRoutesByTo {
 export interface FileRoutesById {
   __root__: typeof rootRouteImport
   '/': typeof IndexRoute
+<<<<<<< HEAD
   '/_authed': typeof AuthedRouteWithChildren
   '/access': typeof AccessRouteWithChildren
   '/login': typeof LoginRoute
@@ -110,6 +132,10 @@ export interface FileRoutesById {
   '/_authed/dashboard': typeof AuthedDashboardRoute
   '/access/login': typeof AccessLoginRoute
   '/access/register': typeof AccessRegisterRoute
+=======
+  '/login': typeof LoginRouteRoute
+  '/auth/dashboard': typeof AuthDashboardRoute
+>>>>>>> main
   '/demo/i18n': typeof DemoI18nRoute
   '/demo/tanstack-query': typeof DemoTanstackQueryRoute
   '/demo/sentry/testing': typeof DemoSentryTestingRoute
@@ -120,10 +146,14 @@ export interface FileRouteTypes {
     | '/'
     | '/access'
     | '/login'
+<<<<<<< HEAD
     | '/logout'
     | '/dashboard'
     | '/access/login'
     | '/access/register'
+=======
+    | '/auth/dashboard'
+>>>>>>> main
     | '/demo/i18n'
     | '/demo/tanstack-query'
     | '/demo/sentry/testing'
@@ -132,10 +162,14 @@ export interface FileRouteTypes {
     | '/'
     | '/access'
     | '/login'
+<<<<<<< HEAD
     | '/logout'
     | '/dashboard'
     | '/access/login'
     | '/access/register'
+=======
+    | '/auth/dashboard'
+>>>>>>> main
     | '/demo/i18n'
     | '/demo/tanstack-query'
     | '/demo/sentry/testing'
@@ -145,10 +179,14 @@ export interface FileRouteTypes {
     | '/_authed'
     | '/access'
     | '/login'
+<<<<<<< HEAD
     | '/logout'
     | '/_authed/dashboard'
     | '/access/login'
     | '/access/register'
+=======
+    | '/auth/dashboard'
+>>>>>>> main
     | '/demo/i18n'
     | '/demo/tanstack-query'
     | '/demo/sentry/testing'
@@ -156,10 +194,15 @@ export interface FileRouteTypes {
 }
 export interface RootRouteChildren {
   IndexRoute: typeof IndexRoute
+<<<<<<< HEAD
   AuthedRoute: typeof AuthedRouteWithChildren
   AccessRoute: typeof AccessRouteWithChildren
   LoginRoute: typeof LoginRoute
   LogoutRoute: typeof LogoutRoute
+=======
+  LoginRouteRoute: typeof LoginRouteRoute
+  AuthDashboardRoute: typeof AuthDashboardRoute
+>>>>>>> main
   DemoI18nRoute: typeof DemoI18nRoute
   DemoTanstackQueryRoute: typeof DemoTanstackQueryRoute
   DemoSentryTestingRoute: typeof DemoSentryTestingRoute
@@ -216,6 +259,7 @@ declare module '@tanstack/react-router' {
       preLoaderRoute: typeof DemoI18nRouteImport
       parentRoute: typeof rootRouteImport
     }
+<<<<<<< HEAD
     '/access/register': {
       id: '/access/register'
       path: '/register'
@@ -236,6 +280,14 @@ declare module '@tanstack/react-router' {
       fullPath: '/dashboard'
       preLoaderRoute: typeof AuthedDashboardRouteImport
       parentRoute: typeof AuthedRoute
+=======
+    '/auth/dashboard': {
+      id: '/auth/dashboard'
+      path: '/auth/dashboard'
+      fullPath: '/auth/dashboard'
+      preLoaderRoute: typeof AuthDashboardRouteImport
+      parentRoute: typeof rootRouteImport
+>>>>>>> main
     }
     '/demo/sentry/testing': {
       id: '/demo/sentry/testing'
@@ -273,10 +325,15 @@ const AccessRouteWithChildren =
 
 const rootRouteChildren: RootRouteChildren = {
   IndexRoute: IndexRoute,
+<<<<<<< HEAD
   AuthedRoute: AuthedRouteWithChildren,
   AccessRoute: AccessRouteWithChildren,
   LoginRoute: LoginRoute,
   LogoutRoute: LogoutRoute,
+=======
+  LoginRouteRoute: LoginRouteRoute,
+  AuthDashboardRoute: AuthDashboardRoute,
+>>>>>>> main
   DemoI18nRoute: DemoI18nRoute,
   DemoTanstackQueryRoute: DemoTanstackQueryRoute,
   DemoSentryTestingRoute: DemoSentryTestingRoute,

src/routes/auth/dashboard.tsx

@@ -0,0 +1,79 @@
+import { Card } from "@heroui/react"
+import { createFileRoute } from "@tanstack/react-router"
+import { Drone } from "lucide-react"
+import { useState } from "react"
+import {
+	Map as MapComponent,
+	MapMarker,
+	MapViewport,
+	MarkerContent,
+	MarkerPopup,
+	MarkerTooltip
+} from "@/components/maps/map"
+
+export const Route = createFileRoute("/auth/dashboard")({
+	component: RouteComponent
+})
+
+function RouteComponent() {
+	const locations = [
+		{
+			id: 1,
+			name: "Location 1",
+			lat: 40.76,
+			lng: -73.98
+		},
+		{
+			id: 2,
+			name: "Location 2",
+			lat: 40.77,
+			lng: -73.99
+		},
+		{
+			id: 3,
+			name: "Location 3",
+			lat: 40.5874827,
+			lng: -1.7925343
+		}
+	]
+	const [viewport, setViewport] = useState<MapViewport>({
+		center: [40.5874827, -1.7925343],
+		zoom: 8,
+		bearing: 0,
+		pitch: 0
+	})
+	return (
+		<div>
+			<Card className="h-[800px] p-0 overflow-hidden">
+				<MapComponent
+					center={[40.5874827, -1.7925343]}
+					zoom={10}
+					viewport={viewport}
+					onViewportChange={setViewport}
+				>
+					{locations.map((location) => (
+						<MapMarker
+							key={location.id}
+							longitude={location.lng}
+							latitude={location.lat}
+						>
+							{/* Prueba para ssl */}
+							<MarkerContent>
+								<Drone size={24} color="green" className="text-green-200" />
+							</MarkerContent>
+							<MarkerTooltip>{location.name}</MarkerTooltip>
+							<MarkerPopup>
+								<div className="space-y-1">
+									<p className="font-medium text-foreground">{location.name}</p>
+									<p className="text-xs text-muted-foreground">
+										{location.lat.toFixed(4)}, {location.lng.toFixed(4)}
+									</p>
+								</div>
+							</MarkerPopup>
+						</MapMarker>
+					))}
+				</MapComponent>
+			</Card>
+		</div>
+	)
+}