From 3ac14c3be3fcc5423526ae4e8ff65704103ca184 Mon Sep 17 00:00:00 2001 From: Ricardo Castro Date: Tue, 23 Apr 2024 22:58:40 -0400 Subject: [PATCH] so much new stuff --- next.config.js | 36 ++-- src/app/_components/floating-nav.tsx | 52 ++++++ src/app/_components/side-nav.tsx | 256 +++++++++++++-------------- src/app/manifest.ts | 21 +++ src/app/page.tsx | 223 +++++++++++++---------- src/app/robots.ts | 12 ++ src/components/ui/button.tsx | 3 +- src/components/ui/carousel.tsx | 2 +- src/components/ui/textarea.tsx | 2 +- 9 files changed, 362 insertions(+), 245 deletions(-) create mode 100644 src/app/_components/floating-nav.tsx create mode 100644 src/app/manifest.ts create mode 100644 src/app/robots.ts diff --git a/next.config.js b/next.config.js index 6a11e04..663a78f 100644 --- a/next.config.js +++ b/next.config.js @@ -26,23 +26,25 @@ const coreConfig = { }, }; +export default coreConfig; + // Injected content via Sentry wizard below -import { withSentryConfig } from "@sentry/nextjs"; +// import { withSentryConfig } from "@sentry/nextjs"; -export default withSentryConfig( - coreConfig, - { - silent: true, - org: "ricardo-castro", - project: "penim", - }, - { - widenClientFileUpload: true, - transpileClientSDK: true, - tunnelRoute: "/monitoring", - hideSourceMaps: true, - disableLogger: true, - automaticVercelMonitors: true, - }, -); +// export default withSentryConfig( +// coreConfig, +// { +// silent: true, +// org: "ricardo-castro", +// project: "penim", +// }, +// { +// widenClientFileUpload: true, +// transpileClientSDK: true, +// tunnelRoute: "/monitoring", +// hideSourceMaps: true, +// disableLogger: true, +// automaticVercelMonitors: true, +// }, +// ); diff --git a/src/app/_components/floating-nav.tsx b/src/app/_components/floating-nav.tsx new file mode 100644 index 0000000..9cce3aa --- /dev/null +++ b/src/app/_components/floating-nav.tsx @@ -0,0 +1,52 @@ +import Link from "next/link"; +import { Brain, Camera, CircleEllipsis, Home } from "lucide-react"; + +export function FloatingNav() { + const items = [ + { + name: "Inicio", + icon: Home, + href: "/", + }, + { + name: "Galeria", + icon: Camera, + href: "/galeria", + }, + { + name: "Mas opciones", + icon: CircleEllipsis, + href: "/opciones", + }, + ]; + + return ( + + ); +} diff --git a/src/app/_components/side-nav.tsx b/src/app/_components/side-nav.tsx index c304334..d454795 100644 --- a/src/app/_components/side-nav.tsx +++ b/src/app/_components/side-nav.tsx @@ -1,147 +1,139 @@ "use client"; -import { SignedIn, SignedOut, UserButton, useAuth } from "@clerk/nextjs"; +import { SignInButton, SignedIn, SignedOut, UserButton } from "@clerk/nextjs"; import React from "react"; import Link from "next/link"; import { - Brain, - Camera, - CircleEllipsis, - Home, - Pencil, - User, + Brain, + Camera, + CircleEllipsis, + Home, } from "lucide-react"; +import { Button } from "~/components/ui/button"; function SideUserActions() { - return ( -
-
- - -
-
- ); + return ( +
+ + + + + + + +
+ ); } export function SideNav() { - const items = [ - { - name: "Inicio", - icon: Home, - href: "/", - }, - { - name: "Pensamientos", - icon: Pencil, - href: "/penin", - }, - { - name: "Galeria", - icon: Camera, - href: "/galeria", - }, - { - name: "Perfil", - icon: User, - href: "/perfil", - }, - { - name: "Mas opciones", - icon: CircleEllipsis, - href: "/opciones", - }, - ]; + const items = [ + { + name: "Inicio", + icon: Home, + href: "/", + }, + { + name: "Galeria", + icon: Camera, + href: "/galeria", + }, + { + name: "Mas opciones", + icon: CircleEllipsis, + href: "/opciones", + }, + ]; - return ( -
-
-
-
-
- {/* Logo */} -
-

- - - -

-
- {/* Navigation */} -
- -
- {/* Escribir btn */} -
- -
- - - Escribir - -
- -
-
- {/* User Menu */} -
- -
-
-
-
-
- ); + return ( +
+
+
+
+
+ {/* Logo */} +
+

+ + + +

+
+ {/* Navigation */} +
+ +
+ {/* Escribir btn */} +
+ +
+ + + Escribir + +
+ +
+
+ {/* User Menu */} +
+ +
+
+
+
+
+ ); } diff --git a/src/app/manifest.ts b/src/app/manifest.ts new file mode 100644 index 0000000..13613fe --- /dev/null +++ b/src/app/manifest.ts @@ -0,0 +1,21 @@ +import type { MetadataRoute } from "next"; + +export default function manifest(): MetadataRoute.Manifest { + return { + name: "Next.js App", + short_name: "Next.js App", + description: "Next.js App", + start_url: "/", + display: "standalone", + background_color: "#fff", + theme_color: "#fff", + scope: "/", + icons: [ + { + src: "/favicon.ico", + sizes: "any", + type: "image/x-icon", + }, + ], + }; +} diff --git a/src/app/page.tsx b/src/app/page.tsx index a67fdeb..ccf3384 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -1,6 +1,7 @@ "use client"; -import { useEffect, useState } from "react"; +import { useUser } from "@clerk/nextjs"; +import React, { useCallback, useEffect, useState } from "react"; import { Button } from "~/components/ui/button"; import { Card, CardContent } from "~/components/ui/card"; import { @@ -9,12 +10,55 @@ import { CarouselContent, CarouselItem, CarouselNext, - CarouselPrevious, + useCarousel, } from "~/components/ui/carousel"; import { Label } from "~/components/ui/label"; import { Textarea } from "~/components/ui/textarea"; +import { cn } from "~/lib/utils"; +import { ArrowLeft } from "lucide-react"; + +const ButtonPrevious = React.forwardRef< + HTMLButtonElement, + React.ComponentProps +>(({ className, ...props }, ref) => { + const { scrollPrev, canScrollPrev } = useCarousel(); + + return ( + + ); +}); + +const ButtonNext = React.forwardRef< + HTMLButtonElement, + React.ComponentProps +>(({ className, ...props }, ref) => { + const { scrollNext, canScrollNext } = useCarousel(); + + return ( + + ); +}); export default function HomePage() { + const { user } = useUser(); const [api, setApi] = useState(); const [current, setCurrent] = useState(0); const [count, setCount] = useState(0); @@ -31,101 +75,94 @@ export default function HomePage() { }, [api]); return ( -
-
-
- {/* Main Form Content */} -
- - {/* Sidebar Main */} -
-
-
- -
-
-
-
- {/* Premium Aside */} -
-
- -
-
-
-
+
+ + +
+
e.preventDefault()}> + + + +