npm - create-next-pro-cli - Versions diffs - 0.1.4 → 0.1.6 - Mend

create-next-pro-cli 0.1.4 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (77) hide show

package/templates/Projects/default/src/app/[locale]/(user)/Dashboard/page.tsx ADDED Viewed

@@ -0,0 +1,5 @@
+import Dashboard from "@/ui/Dashboard/page-ui";
+export default function DashboardPage() {
+  return <Dashboard />;
+}

package/templates/Projects/default/src/app/[locale]/(user)/Settings/page.tsx ADDED Viewed

@@ -0,0 +1,6 @@
+"use client";
+import SettingsPageUI from "@/ui/Settings/page-ui";
+export default function UserInfoPage() {
+  return <SettingsPageUI />;
+}

package/templates/Projects/default/src/app/[locale]/(user)/UserInfo/page.tsx ADDED Viewed

@@ -0,0 +1,6 @@
+"use client";
+import UserInfoPageUI from "@/ui/UserInfo/page-ui";
+export default function UserInfoPage() {
+  return <UserInfoPageUI />;
+}

package/templates/Projects/default/src/app/[locale]/(user)/layout.tsx CHANGED Viewed

@@ -1,8 +1,5 @@
 // app/[locale]/(user)/layout.tsx
-import UserNav from "@/ui/_global/UserNav";
-import LocaleSwitcher from "@/ui/_global/LocaleSwitcher";
 export default function UserLayout({
   children,
 }: {

package/templates/Projects/default/src/app/[locale]/layout.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 // app/[locale]/layout.tsx
+import { NextIntlClientProvider } from "next-intl";
 import { setRequestLocale } from "next-intl/server";
-import { NextIntlClientProvider, hasLocale, Locale } from "next-intl";
 import React from "react";
 import "@/app/styles/globals.css"; // Import global styles
 import GlobalHeader from "@/ui/_global/GlobalHeader";
@@ -16,14 +16,13 @@ export default async function LocaleLayout({
 }) {
   const { locale } = await params;
   setRequestLocale(locale);
-  const isConnectedValue = await isConnected();
+  const isConnectedInitial = await isConnected();
   return (
     <html lang={locale}>
       <body>
         <NextIntlClientProvider>
-          <GlobalHeader isConnected={isConnectedValue} />
+          <GlobalHeader isConnectedInitial={isConnectedInitial} />
           <GlobalMain>{children}</GlobalMain>
         </NextIntlClientProvider>
       </body>

package/templates/Projects/default/src/app/[locale]/loading.tsx CHANGED Viewed

@@ -1,12 +1,9 @@
 // app/[locale]/dashboard/loading.tsx
-"use client";
+import LoadingUI from "@/ui/_global/Loading";
 export default function Loading() {
-  return (
-    <div className="flex flex-col flex-1 items-center justify-center">
-      <p className="text-gray-500">Loading ROOT...</p>
-    </div>
-  );
+  return <LoadingUI />;
 }
 // This component is used to show a loading state while the dashboard is being prepared
 // You can customize it with a spinner, skeletons, or any loading UI you prefer

package/templates/Projects/default/src/app/[locale]/page.tsx CHANGED Viewed

@@ -1,116 +1,6 @@
 import React from "react";
-import Image from "next/image";
 import HomePage from "@/app/[locale]/(public)/_home/page";
-import DashboardPage from "@/app/[locale]/(user)/dashboard/page";
-import PublicNav from "@/ui/_global/PublicNav";
-import UserNav from "@/ui/_global/UserNav";
-import LocaleSwitcher from "@/ui/_global/LocaleSwitcher";
-import { cookies } from "next/headers";
-import { verify } from "jsonwebtoken";
 export default async function FallbackPage() {
-  let isConnected = false;
-  const cookieStore = await cookies();
-  const appToken = cookieStore.get("app_token")?.value;
-  if (appToken) {
-    try {
-      verify(appToken, process.env.APP_JWT_SECRET!);
-      isConnected = true;
-    } catch {
-      isConnected = false;
-    }
-  }
-  return (
-    <HomePage />
-    /*     <main className="min-h-screen bg-neutral-50 font-sans text-gray-900">
-      <header className="sticky top-0 z-30 w-full border-b bg-white/80 backdrop-blur supports-[backdrop-filter]:bg-white/60 shadow-sm">
-        <div className="mx-auto flex h-16 max-w-6xl items-center justify-between px-6">
-          <div className="flex items-center gap-3">
-            <Image
-              src="/cnp-logo.svg"
-              alt="Logo"
-              width={63}
-              height={63}
-              className="mr-2"
-            />
-            <span className="text-lg font-semibold tracking-tight select-none">
-              Create Next Pro
-            </span>
-          </div>
-          <nav className="flex items-center gap-4">
-            {isConnected ? <UserNav /> : <PublicNav />}
-            <LocaleSwitcher />
-          </nav>
-        </div>
-      </header>
-      <section className="mx-auto w-full max-w-3xl py-16 px-6">
-        {isConnected ? <DashboardPage /> : <HomePage />}
-      </section>
-    </main> */
-  );
+  return <HomePage />;
 }
-// Design inspiré de nextjs.org avec Tailwind CSS.
-// import React from "react";
-// import HomePage from "@/app/[locale]/(public)/_home/page";
-// import DashboardPage from "@/app/[locale]/(user)/dashboard/page";
-// import PublicNav from "@/ui/_global/PublicNav";
-// import UserNav from "@/ui/_global/UserNav";
-// import LocaleSwitcher from "@/ui/_global/LocaleSwitcher";
-// export default async function FallbackPage({
-//   params,
-// }: {
-//   params: Promise<{ locale: string }>;
-// }) {
-//   // TODO: Remplacer par la logique réelle d'authentification (next-auth)
-//   const isConnected = false;
-//   const { locale } = await params;
-//   return (
-//     <main className="min-h-screen bg-neutral-50 font-sans text-gray-900">
-//       {/* Header sticky façon nextjs.org */}
-//       <header className="sticky top-0 z-30 w-full border-b bg-white/80 backdrop-blur supports-[backdrop-filter]:bg-white/60 shadow-sm">
-//         <div className="mx-auto flex h-16 max-w-6xl items-center justify-between px-6">
-//           <div className="flex items-center gap-3">
-//             {/* Logo Next.js SVG */}
-//             <svg
-//               width="32"
-//               height="32"
-//               viewBox="0 0 32 32"
-//               fill="none"
-//               xmlns="http://www.w3.org/2000/svg"
-//               className="mr-2"
-//             >
-//               <rect width="32" height="32" rx="16" fill="#000" />
-//               <path
-//                 d="M16.018 29.917c7.66 0 13.899-6.238 13.899-13.899 0-7.66-6.239-13.899-13.899-13.899-7.66 0-13.899 6.239-13.899 13.899 0 7.661 6.239 13.899 13.899 13.899Z"
-//                 fill="#fff"
-//               />
-//               <path
-//                 d="M23.635 22.295 12.7 10.36h-1.68v11.28h1.44v-9.12l10.08 10.08 1.095-1.095ZM19.36 21.64h1.44V10.36h-1.44v11.28Z"
-//                 fill="#000"
-//               />
-//             </svg>
-//             <span className="text-lg font-semibold tracking-tight select-none">
-//               Create Next Pro
-//             </span>
-//           </div>
-//           <nav className="flex items-center gap-4">
-//             {isConnected ? <UserNav /> : <PublicNav />}
-//             <LocaleSwitcher />
-//           </nav>
-//         </div>
-//       </header>
-//       {/* Main content */}
-//       <section className="mx-auto w-full max-w-3xl py-16 px-6">
-//         {isConnected ? <DashboardPage /> : <HomePage />}
-//       </section>
-//     </main>
-//   );
-// }
-// // Design inspiré de nextjs.org avec Tailwind CSS.

package/templates/Projects/default/src/app/api/auth/[...nextauth]/route.ts CHANGED Viewed

@@ -1,6 +1,4 @@
-import { sign } from "jsonwebtoken";
 import NextAuth from "next-auth";
-//import { authOptions } from "@/auth.config";
 import type {
   NextAuthOptions,
   Session,
@@ -10,8 +8,6 @@ import type {
 } from "next-auth";
 import GoogleProvider from "next-auth/providers/google";
 import type { JWT } from "next-auth/jwt";
-import { getToken } from "next-auth/jwt";
-import { NextRequest, NextResponse } from "next/server";
 const authOptions: NextAuthOptions = {
   providers: [
@@ -28,20 +24,14 @@ const authOptions: NextAuthOptions = {
         token.name = user.name;
       }
       console.log("JWT Callback:", token);
-      // On ne met rien dans le token NextAuth
-      // Le token JWT applicatif est géré dans le middleware
-      // et dans le callback de la route d'authentification
-      // pour éviter de le stocker dans la session NextAuth
-      // et de le renvoyer au client.
-      // Il est uniquement utilisé côté serveur pour vérifier l'authentification.
-      // On peut ajouter des données supplémentaires si nécessaire
-      // mais pour l'instant, on garde le token minimaliste.
-      // Exemple d'ajout de données :
-      // token.customData = "some data";
       return token;
     },
     async session({ session, token }: { session: Session; token: JWT }) {
-      // On ne met rien dans la session NextAuth
+      if (session.user) {
+        session.user.email = token.email;
+        session.user.name = token.name;
+      }
       return session;
     },
     async signIn({
@@ -60,22 +50,13 @@ const authOptions: NextAuthOptions = {
       return true;
     },
     async redirect({ url, baseUrl }: { url: string; baseUrl: string }) {
-      // Après login, redirige vers l'endpoint qui pose le cookie JWT applicatif
-      // console.log("Before Redirect Callback :", { url: url, baseUrl: baseUrl });
       const customCallbackRoute = "/api/auth/post-login";
-      /*  if (url.startsWith(baseUrl)) {
-        console.log("Redirecting to post-login endpoint");
-        return "/api/auth/post-login";
-      } */
-      // console.log("Redirecting to base URL + customCallbackRoute");
       return baseUrl + customCallbackRoute;
     },
   },
-  // Ajoute ici d'autres options/callbacks si besoin
 };
-// Suppression de customJwtCookie : la pose du cookie se fait dans /api/auth/post-login
 const handler = NextAuth(authOptions);
 export { handler as GET, handler as POST };

package/templates/Projects/default/src/app/api/auth/post-login/route.ts CHANGED Viewed

@@ -2,7 +2,6 @@ import { getToken } from "next-auth/jwt";
 import { sign } from "jsonwebtoken";
 import { NextResponse, NextRequest } from "next/server";
 import { redirect } from "@/lib/i18n/navigation";
-// import { NextURL } from "next/dist/server/web/next-url";
 export async function GET(req: NextRequest) {
   const token = await getToken({ req, secret: process.env.NEXTAUTH_SECRET });
@@ -13,7 +12,7 @@ export async function GET(req: NextRequest) {
       { expiresIn: "7d" }
     );
     const res = NextResponse.redirect(req.nextUrl.origin + "/");
-    res.cookies.set("app_token", appJwt, {
+    res.cookies.set("access_token", appJwt, {
       httpOnly: true,
       secure: process.env.NODE_ENV === "production",
       sameSite: "strict",

package/templates/Projects/default/src/app/styles/globals.css CHANGED Viewed

@@ -1,26 +1,305 @@
 @import "tailwindcss";
-:root {
-  --background: #ffffff;
-  --foreground: #171717;
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+/* @import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap"); */
+/* Dark mode : fond noir, texte blanc */
+.dark {
+  --background: 0 0% 0%; /* noir */
+  --foreground: 0 0% 100%; /* blanc */
+  --card: 0 0% 0%;
+  --card-foreground: 0 0% 100%;
+  --popover: 0 0% 0%;
+  --popover-foreground: 0 0% 100%;
+  --primary: 0 0% 100%; /* blanc */
+  --primary-foreground: 0 0% 0%; /* noir */
+  --secondary: 0 0% 20%; /* gris foncé */
+  --secondary-foreground: 0 0% 100%;
+  --muted: 0 0% 20%;
+  --muted-foreground: 0 0% 80%;
+  --accent: 0 0% 20%;
+  --accent-foreground: 0 0% 100%;
+  --destructive: 0 62.8% 30.6%;
+  --destructive-foreground: 0 0% 100%;
+  --border: 0 0% 20%;
+  --input: 0 0% 20%;
+  --ring: 0 0% 100%;
+  --radius: 0.75rem;
 }
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --font-sans: var(--font-geist-sans);
-  --font-mono: var(--font-geist-mono);
+/* Light mode : fond blanc, texte noir */
+.light {
+  --background: 0 0% 100%; /* blanc */
+  --foreground: 0 0% 0%; /* noir */
+  --card: 0 0% 100%;
+  --card-foreground: 0 0% 0%;
+  --popover: 0 0% 100%;
+  --popover-foreground: 0 0% 0%;
+  --primary: 0 0% 0%; /* noir */
+  --primary-foreground: 0 0% 100%; /* blanc */
+  --secondary: 0 0% 95%; /* gris très clair */
+  --secondary-foreground: 0 0% 0%;
+  --muted: 0 0% 95%;
+  --muted-foreground: 0 0% 20%;
+  --accent: 0 0% 95%;
+  --accent-foreground: 0 0% 0%;
+  --destructive: 0 84.2% 60.2%;
+  --destructive-foreground: 0 0% 100%;
+  --border: 0 0% 80%;
+  --input: 0 0% 80%;
+  --ring: 0 0% 0%;
 }
-@media (prefers-color-scheme: dark) {
-  :root {
-    --background: #0a0a0a;
-    --foreground: #ededed;
-  }
+* {
+  border-color: hsl(var(--border));
 }
 body {
-  background: var(--background);
-  color: var(--foreground);
-  font-family: Arial, Helvetica, sans-serif;
+  font-family: "Inter", sans-serif;
+  background: hsl(var(--background));
+  color: hsl(var(--foreground));
+  line-height: 1.6;
+  transition: background 0.3s, color 0.3s;
+}
+.gradient-text {
+  background: linear-gradient(135deg, #fff 0%, #bbb 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+.light .gradient-text {
+  background: linear-gradient(135deg, #000 0%, #888 100%);
+  -webkit-background-clip: text;
+  -webkit-text-fill-color: transparent;
+  background-clip: text;
+}
+.dark .glass-effect {
+  background: rgba(0, 0, 0, 0.8);
+  backdrop-filter: blur(10px);
+  border: 1px solid #444;
+}
+.light .glass-effect {
+  background: rgba(0, 0, 0, 0.08);
+  border: 1px solid #ccc;
+}
+.chat-bubble-user {
+  background: linear-gradient(135deg, #fff 0%, #bbb 100%);
+  border-radius: 18px 18px 4px 18px;
+  color: #000;
+}
+.light .chat-bubble-user {
+  background: linear-gradient(135deg, #000 0%, #888 100%);
+  color: #fff;
+}
+.chat-bubble-ai {
+  background: rgba(255, 255, 255, 0.12);
+  border-radius: 18px 18px 18px 4px;
+  border: 1px solid #444;
+  color: #000;
+}
+.light .chat-bubble-ai {
+  background: rgba(0, 0, 0, 0.12);
+  border: 1px solid #ccc;
+  color: #fff;
+}
+.typing-indicator {
+  display: inline-block;
+  width: 8px;
+  height: 8px;
+  border-radius: 50%;
+  background-color: #fff;
+  animation: typing 1.4s infinite ease-in-out;
+}
+.light .typing-indicator {
+  background-color: #000;
+}
+.typing-indicator:nth-child(1) {
+  animation-delay: -0.32s;
+}
+.typing-indicator:nth-child(2) {
+  animation-delay: -0.16s;
+}
+@keyframes typing {
+  0%,
+  80%,
+  100% {
+    transform: scale(0);
+    opacity: 0.5;
+  }
+  40% {
+    transform: scale(1);
+    opacity: 1;
+  }
+}
+.hero-pattern {
+  background-image: radial-gradient(
+      circle at 25% 25%,
+      rgba(255, 255, 255, 0.18) 0%,
+      transparent 50%
+    ),
+    radial-gradient(
+      circle at 75% 75%,
+      rgba(180, 180, 180, 0.18) 0%,
+      transparent 50%
+    );
+}
+.light .hero-pattern {
+  background-image: radial-gradient(
+      circle at 25% 25%,
+      rgba(0, 0, 0, 0.08) 0%,
+      transparent 50%
+    ),
+    radial-gradient(
+      circle at 75% 75%,
+      rgba(120, 120, 120, 0.08) 0%,
+      transparent 50%
+    );
+}
+.light .mobil-menu {
+  background: rgba(255, 255, 255, 0.9);
+}
+.dark .mobil-menu {
+  background: rgba(0, 0, 0, 0.9);
+}
+.light .text-white,
+.light .text-gray-300,
+.light .text-gray-400 {
+  color: black;
+}
+.light button.text-white:hover,
+.light a:hover {
+  color: rgb(142, 197, 255);
+}
+.gsi-material-button {
+  user-select: none;
+  -webkit-user-select: none;
+  -ms-user-select: none;
+  appearance: none;
+  -webkit-appearance: none;
+  /* background-color: linear-gradient(135deg, #fff 0%, #a78bfa 100%);
+  backdrop-filter: blur(8px); */
+  /* background-color: #131314; */
+  /* background-image: none; */
+  /* background: linear-gradient(135deg, #ffffff 0%, #a78bfa 100%); */
+  backdrop-filter: blur(8px);
+  border: 1px solid #747775;
+  border-radius: 4px;
+  box-sizing: border-box;
+  color: #e3e3e3;
+  /* color: #000000; */
+  cursor: pointer;
+  font-family: "Roboto", arial, sans-serif;
+  font-size: 14px;
+  height: 40px;
+  letter-spacing: 0.25px;
+  outline: none;
+  overflow: hidden;
+  padding: 0 12px;
+  position: relative;
+  text-align: center;
+  transition: background-color 0.218s, border-color 0.218s, box-shadow 0.218s;
+  vertical-align: middle;
+  white-space: nowrap;
+  width: auto;
+  max-width: 400px;
+  min-width: min-content;
+  border-color: #8e918f;
+}
+.light .gsi-material-button {
+  color: #222;
+  background: #fff;
+  border-color: #d1d5db;
+}
+.gsi-material-button .gsi-material-button-icon {
+  height: 20px;
+  margin-right: 12px;
+  min-width: 20px;
+  width: 20px;
+}
+.gsi-material-button .gsi-material-button-content-wrapper {
+  -webkit-align-items: center;
+  align-items: center;
+  display: flex;
+  -webkit-flex-direction: row;
+  flex-direction: row;
+  -webkit-flex-wrap: nowrap;
+  flex-wrap: nowrap;
+  height: 100%;
+  justify-content: space-between;
+  position: relative;
+  width: 100%;
+}
+.gsi-material-button .gsi-material-button-contents {
+  -webkit-flex-grow: 1;
+  flex-grow: 1;
+  font-family: "Roboto", arial, sans-serif;
+  font-weight: 500;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  vertical-align: top;
+}
+.gsi-material-button .gsi-material-button-state {
+  -webkit-transition: opacity 0.218s;
+  transition: opacity 0.218s;
+  bottom: 0;
+  left: 0;
+  opacity: 0;
+  position: absolute;
+  right: 0;
+  top: 0;
+}
+.gsi-material-button:disabled {
+  cursor: default;
+  background-color: #13131461;
+  border-color: #8e918f1f;
+}
+.gsi-material-button:disabled .gsi-material-button-state {
+  background-color: #e3e3e31f;
+}
+.gsi-material-button:disabled .gsi-material-button-contents {
+  opacity: 38%;
+}
+.gsi-material-button:disabled .gsi-material-button-icon {
+  opacity: 38%;
+}
+.gsi-material-button:not(:disabled):active .gsi-material-button-state,
+.gsi-material-button:not(:disabled):focus .gsi-material-button-state {
+  background-color: white;
+  opacity: 12%;
+}
+.gsi-material-button:not(:disabled):hover {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.3),
+    0 1px 3px 1px rgba(60, 64, 67, 0.15);
+  box-shadow: 0 1px 2px 0 rgba(60, 64, 67, 0.3),
+    0 1px 3px 1px rgba(60, 64, 67, 0.15);
+}
+.gsi-material-button:not(:disabled):hover .gsi-material-button-state {
+  background-color: white;
+  opacity: 8%;
 }

package/templates/Projects/default/src/lib/auth/disconnect.ts ADDED Viewed

@@ -0,0 +1,11 @@
+// src/lib/auth/disconnect.ts
+"use server";
+import { cookies } from "next/headers";
+/**
+ * Supprime le cookie access_token pour déconnecter l'utilisateur côté serveur.
+ */
+export async function disconnect() {
+  const cookieStore = await cookies();
+  cookieStore.delete("access_token");
+}

package/templates/Projects/default/src/lib/auth/isConnected.ts CHANGED Viewed

@@ -1,12 +1,14 @@
+"use server";
+// src/lib/auth/isConnected.ts
 import { cookies } from "next/headers";
 import { verify } from "jsonwebtoken";
 export async function isConnected(): Promise<boolean> {
   const cookieStore = await cookies();
-  const appToken = cookieStore.get("app_token")?.value;
-  if (appToken) {
+  const accessToken = cookieStore.get("access_token")?.value;
+  if (accessToken) {
     try {
-      verify(appToken, process.env.APP_JWT_SECRET!);
+      verify(accessToken, process.env.APP_JWT_SECRET!);
       return true;
     } catch {
       return false;

package/templates/Projects/default/src/lib/utils.ts ADDED Viewed

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

package/templates/Projects/default/src/ui/Dashboard/LogoutButton.tsx ADDED Viewed

@@ -0,0 +1,27 @@
+// src/ui/Dashboard/LogoutButton.tsx
+"use client"; // DO NOT FORGET , this is a client component.
+import { useTranslations } from "next-intl";
+import { Button } from "@/ui/_global/Button";
+import { LogOut } from "lucide-react";
+import { disconnect } from "@/lib/auth/disconnect";
+const LogoutButton = () => {
+  const t = useTranslations("Dashboard");
+  const handleLogout = () => {
+    disconnect().then(() => {
+      window.location.href = "/";
+    });
+  };
+  return (
+    <Button
+      variant="ghost"
+      size="sm"
+      onClick={handleLogout}
+      className="text-gray-400 hover:text-black  glass-effect"
+    >
+      <LogOut className="h-4 w-4 sm:mr-2" />
+      <span className="hidden sm:inline">{t("logout")}</span>
+    </Button>
+  );
+};
+export default LogoutButton;

package/templates/Projects/default/src/ui/{dashboard/page.tsx → Dashboard/page-ui.tsx} RENAMED Viewed

@@ -1,11 +1,12 @@
-("");
+// src/ui/Dashboard/page-ui.tsx
+"use client";
 import { useTranslations } from "next-intl";
 import BackButton from "@/ui/_global/BackButton";
-import WelcomeCard from "@/ui/dashboard/WelcomeCard";
-import StatsCard from "@/ui/dashboard/StatsCard";
+import WelcomeCard from "@/ui/Dashboard/WelcomeCard";
+import StatsCard from "@/ui/Dashboard/StatsCard";
 export default function Dashboard() {
-  const t = useTranslations("dashboard");
+  const t = useTranslations("Dashboard");
   return (
     <>
       <div className="flex items-center justify-between mb-6">