ar-saas 0.3.0 → 0.3.2

package/templates/frontend/src/components/dashboard/header.tsx

@@ -1,89 +1,89 @@
-'use client'
-
-import Link from 'next/link'
-import { usePathname } from 'next/navigation'
-import { User, Settings, CreditCard, LogOut } from 'lucide-react'
-import { useAuth } from '@/lib/hooks/use-auth'
-import { Avatar, AvatarFallback } from '@/components/ui/avatar'
-import {
-  DropdownMenu,
-  DropdownMenuContent,
-  DropdownMenuItem,
-  DropdownMenuLabel,
-  DropdownMenuSeparator,
-  DropdownMenuTrigger,
-} from '@/components/ui/dropdown-menu'
-
-const breadcrumbMap: Record<string, string> = {
-  '/dashboard': 'Dashboard',
-  '/profile': 'Perfil',
-  '/settings': 'Ajustes',
-  '/billing': 'Facturación',
-  '/team': 'Equipo',
-}
-
-function getInitials(name: string) {
-  return name
-    .split(' ')
-    .map((n) => n[0])
-    .slice(0, 2)
-    .join('')
-    .toUpperCase()
-}
-
-export function DashboardHeader() {
-  const { user, logout } = useAuth()
-  const pathname = usePathname()
-  const pageTitle = breadcrumbMap[pathname] ?? 'Dashboard'
-
-  return (
-    <header className="flex h-14 items-center justify-between border-b bg-background px-6">
-      <h1 className="text-sm font-semibold">{pageTitle}</h1>
-
-      <DropdownMenu>
-        <DropdownMenuTrigger asChild>
-          <button className="flex items-center gap-2 rounded-full outline-none focus-visible:ring-2 focus-visible:ring-ring">
-            <Avatar className="size-8">
-              <AvatarFallback className="text-xs">
-                {user?.name ? getInitials(user.name) : 'U'}
-              </AvatarFallback>
-            </Avatar>
-          </button>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent align="end" className="w-52">
-          <DropdownMenuLabel className="font-normal">
-            <p className="font-medium leading-none">{user?.name}</p>
-            <p className="mt-1 text-xs text-muted-foreground">{user?.email}</p>
-          </DropdownMenuLabel>
-          <DropdownMenuSeparator />
-          <DropdownMenuItem asChild>
-            <Link href="/profile">
-              <User className="mr-2 size-4" />
-              Perfil
-            </Link>
-          </DropdownMenuItem>
-          <DropdownMenuItem asChild>
-            <Link href="/settings">
-              <Settings className="mr-2 size-4" />
-              Ajustes
-            </Link>
-          </DropdownMenuItem>
-          <DropdownMenuItem asChild>
-            <Link href="/billing">
-              <CreditCard className="mr-2 size-4" />
-              Facturación
-            </Link>
-          </DropdownMenuItem>
-          <DropdownMenuSeparator />
-          <DropdownMenuItem
-            className="text-destructive focus:text-destructive"
-            onClick={logout}
-          >
-            <LogOut className="mr-2 size-4" />
-            Cerrar sesión
-          </DropdownMenuItem>
-        </DropdownMenuContent>
-      </DropdownMenu>
-    </header>
-  )
-}
+'use client'
+
+import Link from 'next/link'
+import { usePathname } from 'next/navigation'
+import { User, Settings, CreditCard, LogOut } from 'lucide-react'
+import { useAuth } from '@/lib/hooks/use-auth'
+import { Avatar, AvatarFallback } from '@/components/ui/avatar'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from '@/components/ui/dropdown-menu'
+
+const breadcrumbMap: Record<string, string> = {
+  '/dashboard': 'Dashboard',
+  '/profile': 'Perfil',
+  '/settings': 'Ajustes',
+  '/billing': 'Facturación',
+  '/team': 'Equipo',
+}
+
+function getInitials(name: string) {
+  return name
+    .split(' ')
+    .map((n) => n[0])
+    .slice(0, 2)
+    .join('')
+    .toUpperCase()
+}
+
+export function DashboardHeader() {
+  const { user, logout } = useAuth()
+  const pathname = usePathname()
+  const pageTitle = breadcrumbMap[pathname] ?? 'Dashboard'
+
+  return (
+    <header className="flex h-14 items-center justify-between border-b bg-background px-6">
+      <h1 className="text-sm font-semibold">{pageTitle}</h1>
+
+      <DropdownMenu>
+        <DropdownMenuTrigger asChild>
+          <button className="flex items-center gap-2 rounded-full outline-none focus-visible:ring-2 focus-visible:ring-ring">
+            <Avatar className="size-8">
+              <AvatarFallback className="text-xs">
+                {user?.name ? getInitials(user.name) : 'U'}
+              </AvatarFallback>
+            </Avatar>
+          </button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="end" className="w-52">
+          <DropdownMenuLabel className="font-normal">
+            <p className="font-medium leading-none">{user?.name}</p>
+            <p className="mt-1 text-xs text-muted-foreground">{user?.email}</p>
+          </DropdownMenuLabel>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem asChild>
+            <Link href="/profile">
+              <User className="mr-2 size-4" />
+              Perfil
+            </Link>
+          </DropdownMenuItem>
+          <DropdownMenuItem asChild>
+            <Link href="/settings">
+              <Settings className="mr-2 size-4" />
+              Ajustes
+            </Link>
+          </DropdownMenuItem>
+          <DropdownMenuItem asChild>
+            <Link href="/billing">
+              <CreditCard className="mr-2 size-4" />
+              Facturación
+            </Link>
+          </DropdownMenuItem>
+          <DropdownMenuSeparator />
+          <DropdownMenuItem
+            className="text-destructive focus:text-destructive"
+            onClick={logout}
+          >
+            <LogOut className="mr-2 size-4" />
+            Cerrar sesión
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
+    </header>
+  )
+}

package/templates/frontend/src/components/dashboard/sidebar.tsx

@@ -1,71 +1,71 @@
-'use client'
-
-import Link from 'next/link'
-import { usePathname } from 'next/navigation'
-import {
-  LayoutDashboard,
-  User,
-  Settings,
-  CreditCard,
-  Users,
-  LogOut,
-} from 'lucide-react'
-import { siteConfig } from '@/config/site'
-import { useAuth } from '@/lib/hooks/use-auth'
-import { Button } from '@/components/ui/button'
-import { Separator } from '@/components/ui/separator'
-import { cn } from '@/lib/utils'
-
-const navItems = [
-  { label: 'Dashboard', href: '/dashboard', icon: LayoutDashboard },
-  { label: 'Perfil', href: '/profile', icon: User },
-  { label: 'Ajustes', href: '/settings', icon: Settings },
-  { label: 'Facturación', href: '/billing', icon: CreditCard },
-  { label: 'Equipo', href: '/team', icon: Users },
-]
-
-export function DashboardSidebar() {
-  const pathname = usePathname()
-  const { logout } = useAuth()
-
-  return (
-    <aside className="flex w-60 shrink-0 flex-col border-r bg-card">
-      <div className="flex h-14 items-center border-b px-4">
-        <Link href="/" className="text-sm font-bold tracking-tight">
-          {siteConfig.name}
-        </Link>
-      </div>
-
-      <nav className="flex-1 space-y-1 p-3">
-        {navItems.map(({ label, href, icon: Icon }) => (
-          <Button
-            key={href}
-            asChild
-            variant={pathname === href ? 'secondary' : 'ghost'}
-            className={cn(
-              'w-full justify-start',
-              pathname === href && 'font-medium',
-            )}
-          >
-            <Link href={href}>
-              <Icon className="mr-2 size-4" />
-              {label}
-            </Link>
-          </Button>
-        ))}
-      </nav>
-
-      <div className="p-3">
-        <Separator className="mb-3" />
-        <Button
-          variant="ghost"
-          className="w-full justify-start text-muted-foreground hover:text-foreground"
-          onClick={logout}
-        >
-          <LogOut className="mr-2 size-4" />
-          Cerrar sesión
-        </Button>
-      </div>
-    </aside>
-  )
-}
+'use client'
+
+import Link from 'next/link'
+import { usePathname } from 'next/navigation'
+import {
+  LayoutDashboard,
+  User,
+  Settings,
+  CreditCard,
+  Users,
+  LogOut,
+} from 'lucide-react'
+import { siteConfig } from '@/config/site'
+import { useAuth } from '@/lib/hooks/use-auth'
+import { Button } from '@/components/ui/button'
+import { Separator } from '@/components/ui/separator'
+import { cn } from '@/lib/utils'
+
+const navItems = [
+  { label: 'Dashboard', href: '/dashboard', icon: LayoutDashboard },
+  { label: 'Perfil', href: '/profile', icon: User },
+  { label: 'Ajustes', href: '/settings', icon: Settings },
+  { label: 'Facturación', href: '/billing', icon: CreditCard },
+  { label: 'Equipo', href: '/team', icon: Users },
+]
+
+export function DashboardSidebar() {
+  const pathname = usePathname()
+  const { logout } = useAuth()
+
+  return (
+    <aside className="flex w-60 shrink-0 flex-col border-r bg-card">
+      <div className="flex h-14 items-center border-b px-4">
+        <Link href="/" className="text-sm font-bold tracking-tight">
+          {siteConfig.name}
+        </Link>
+      </div>
+
+      <nav className="flex-1 space-y-1 p-3">
+        {navItems.map(({ label, href, icon: Icon }) => (
+          <Button
+            key={href}
+            asChild
+            variant={pathname === href ? 'secondary' : 'ghost'}
+            className={cn(
+              'w-full justify-start',
+              pathname === href && 'font-medium',
+            )}
+          >
+            <Link href={href}>
+              <Icon className="mr-2 size-4" />
+              {label}
+            </Link>
+          </Button>
+        ))}
+      </nav>
+
+      <div className="p-3">
+        <Separator className="mb-3" />
+        <Button
+          variant="ghost"
+          className="w-full justify-start text-muted-foreground hover:text-foreground"
+          onClick={logout}
+        >
+          <LogOut className="mr-2 size-4" />
+          Cerrar sesión
+        </Button>
+      </div>
+    </aside>
+  )
+}

package/templates/frontend/src/components/dashboard/stat-card.tsx

@@ -1,34 +1,34 @@
-import { type LucideIcon } from 'lucide-react'
-import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
-import { cn } from '@/lib/utils'
-
-interface StatCardProps {
-  title: string
-  value: string
-  description?: string
-  icon: LucideIcon
-  trend?: { value: string; positive: boolean }
-  className?: string
-}
-
-export function StatCard({ title, value, description, icon: Icon, trend, className }: StatCardProps) {
-  return (
-    <Card className={cn('', className)}>
-      <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
-        <CardTitle className="text-sm font-medium">{title}</CardTitle>
-        <Icon className="size-4 text-muted-foreground" />
-      </CardHeader>
-      <CardContent>
-        <div className="text-2xl font-bold">{value}</div>
-        {trend && (
-          <p className={cn('mt-1 text-xs', trend.positive ? 'text-green-600' : 'text-red-500')}>
-            {trend.positive ? '+' : ''}{trend.value} vs. mes anterior
-          </p>
-        )}
-        {description && !trend && (
-          <p className="mt-1 text-xs text-muted-foreground">{description}</p>
-        )}
-      </CardContent>
-    </Card>
-  )
-}
+import { type LucideIcon } from 'lucide-react'
+import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card'
+import { cn } from '@/lib/utils'
+
+interface StatCardProps {
+  title: string
+  value: string
+  description?: string
+  icon: LucideIcon
+  trend?: { value: string; positive: boolean }
+  className?: string
+}
+
+export function StatCard({ title, value, description, icon: Icon, trend, className }: StatCardProps) {
+  return (
+    <Card className={cn('', className)}>
+      <CardHeader className="flex flex-row items-center justify-between space-y-0 pb-2">
+        <CardTitle className="text-sm font-medium">{title}</CardTitle>
+        <Icon className="size-4 text-muted-foreground" />
+      </CardHeader>
+      <CardContent>
+        <div className="text-2xl font-bold">{value}</div>
+        {trend && (
+          <p className={cn('mt-1 text-xs', trend.positive ? 'text-green-600' : 'text-red-500')}>
+            {trend.positive ? '+' : ''}{trend.value} vs. mes anterior
+          </p>
+        )}
+        {description && !trend && (
+          <p className="mt-1 text-xs text-muted-foreground">{description}</p>
+        )}
+      </CardContent>
+    </Card>
+  )
+}

package/templates/frontend/src/components/landing/faq.tsx

@@ -1,39 +1,39 @@
-import { siteConfig } from '@/config/site'
-import {
-  Accordion,
-  AccordionContent,
-  AccordionItem,
-  AccordionTrigger,
-} from '@/components/ui/accordion'
-
-export function LandingFaq() {
-  return (
-    <section id="faq" className="py-20 md:py-28">
-      <div className="mx-auto max-w-3xl px-4">
-        <div className="text-center">
-          <h2 className="text-3xl font-bold tracking-tight md:text-4xl">
-            Preguntas frecuentes
-          </h2>
-          <p className="mt-4 text-muted-foreground">
-            Si no encontrás lo que buscás, escribinos a{' '}
-            <a
-              href={`mailto:${siteConfig.supportEmail}`}
-              className="underline underline-offset-4 hover:text-foreground"
-            >
-              {siteConfig.supportEmail}
-            </a>
-          </p>
-        </div>
-
-        <Accordion type="single" collapsible className="mt-12">
-          {siteConfig.faq.map((item, index) => (
-            <AccordionItem key={index} value={`item-${index}`}>
-              <AccordionTrigger className="text-left">{item.question}</AccordionTrigger>
-              <AccordionContent className="text-muted-foreground">{item.answer}</AccordionContent>
-            </AccordionItem>
-          ))}
-        </Accordion>
-      </div>
-    </section>
-  )
-}
+import { siteConfig } from '@/config/site'
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger,
+} from '@/components/ui/accordion'
+
+export function LandingFaq() {
+  return (
+    <section id="faq" className="py-20 md:py-28">
+      <div className="mx-auto max-w-3xl px-4">
+        <div className="text-center">
+          <h2 className="text-3xl font-bold tracking-tight md:text-4xl">
+            Preguntas frecuentes
+          </h2>
+          <p className="mt-4 text-muted-foreground">
+            Si no encontrás lo que buscás, escribinos a{' '}
+            <a
+              href={`mailto:${siteConfig.supportEmail}`}
+              className="underline underline-offset-4 hover:text-foreground"
+            >
+              {siteConfig.supportEmail}
+            </a>
+          </p>
+        </div>
+
+        <Accordion type="single" collapsible className="mt-12">
+          {siteConfig.faq.map((item, index) => (
+            <AccordionItem key={index} value={`item-${index}`}>
+              <AccordionTrigger className="text-left">{item.question}</AccordionTrigger>
+              <AccordionContent className="text-muted-foreground">{item.answer}</AccordionContent>
+            </AccordionItem>
+          ))}
+        </Accordion>
+      </div>
+    </section>
+  )
+}

package/templates/frontend/src/components/landing/features.tsx

@@ -1,54 +1,54 @@
-import {
-  Zap,
-  Shield,
-  BarChart3,
-  Users,
-  Globe,
-  Headphones,
-  type LucideIcon,
-} from 'lucide-react'
-import { siteConfig } from '@/config/site'
-
-const iconMap: Record<string, LucideIcon> = {
-  Zap,
-  Shield,
-  BarChart3,
-  Users,
-  Globe,
-  Headphones,
-}
-
-export function LandingFeatures() {
-  return (
-    <section id="features" className="py-20 md:py-28">
-      <div className="mx-auto max-w-6xl px-4">
-        <div className="mx-auto max-w-2xl text-center">
-          <h2 className="text-3xl font-bold tracking-tight md:text-4xl">
-            Todo lo que necesitás para lanzar
-          </h2>
-          <p className="mt-4 text-muted-foreground">
-            Funcionalidades pensadas para que te enfoques en el negocio, no en la infraestructura.
-          </p>
-        </div>
-
-        <div className="mt-16 grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
-          {siteConfig.features.map((feature) => {
-            const Icon = iconMap[feature.icon] ?? Zap
-            return (
-              <div
-                key={feature.title}
-                className="group rounded-xl border bg-card p-6 transition-shadow hover:shadow-md"
-              >
-                <div className="mb-4 inline-flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10 text-primary">
-                  <Icon className="size-5" />
-                </div>
-                <h3 className="font-semibold">{feature.title}</h3>
-                <p className="mt-2 text-sm text-muted-foreground">{feature.description}</p>
-              </div>
-            )
-          })}
-        </div>
-      </div>
-    </section>
-  )
-}
+import {
+  Zap,
+  Shield,
+  BarChart3,
+  Users,
+  Globe,
+  Headphones,
+  type LucideIcon,
+} from 'lucide-react'
+import { siteConfig } from '@/config/site'
+
+const iconMap: Record<string, LucideIcon> = {
+  Zap,
+  Shield,
+  BarChart3,
+  Users,
+  Globe,
+  Headphones,
+}
+
+export function LandingFeatures() {
+  return (
+    <section id="features" className="py-20 md:py-28">
+      <div className="mx-auto max-w-6xl px-4">
+        <div className="mx-auto max-w-2xl text-center">
+          <h2 className="text-3xl font-bold tracking-tight md:text-4xl">
+            Todo lo que necesitás para lanzar
+          </h2>
+          <p className="mt-4 text-muted-foreground">
+            Funcionalidades pensadas para que te enfoques en el negocio, no en la infraestructura.
+          </p>
+        </div>
+
+        <div className="mt-16 grid gap-8 sm:grid-cols-2 lg:grid-cols-3">
+          {siteConfig.features.map((feature) => {
+            const Icon = iconMap[feature.icon] ?? Zap
+            return (
+              <div
+                key={feature.title}
+                className="group rounded-xl border bg-card p-6 transition-shadow hover:shadow-md"
+              >
+                <div className="mb-4 inline-flex h-10 w-10 items-center justify-center rounded-lg bg-primary/10 text-primary">
+                  <Icon className="size-5" />
+                </div>
+                <h3 className="font-semibold">{feature.title}</h3>
+                <p className="mt-2 text-sm text-muted-foreground">{feature.description}</p>
+              </div>
+            )
+          })}
+        </div>
+      </div>
+    </section>
+  )
+}