create-next-pro-cli 0.1.13 → 0.1.14

package/templates/Projects/default/src/ui/_global/GlobalHeader.tsx

@@ -1,55 +0,0 @@
-"use client";
-import Image from "next/image";
-import UserNav from "@/ui/_global/UserNav";
-import LocaleSwitcher from "@/ui/_global/LocaleSwitcher";
-import PublicNav from "@/ui/_global/PublicNav";
-import { useEffect, useState } from "react";
-import { Link } from "@/lib/i18n/navigation";
-import { isConnected } from "@/lib/auth/isConnected";
-
-type GlobalHeaderProps = {
-  isConnectedInitial: boolean;
-};
-
-export default function GlobalHeader({
-  isConnectedInitial,
-}: GlobalHeaderProps) {
-  const [isConnectedState, setIsConnectedState] = useState(isConnectedInitial);
-
-  // Vérification dynamique côté client (exemple via /api/me)
-  useEffect(() => {
-    async function checkConnection() {
-      setIsConnectedState(await isConnected());
-    }
-    checkConnection();
-    // Optionnel : timer pour rafraîchir périodiquement
-    // const interval = setInterval(checkConnection, 60000);
-    // return () => clearInterval(interval);
-  }, []);
-
-  return (
-    <header className="fixed top-0 w-full z-50 glass-effect border-b">
-      <div className="mx-auto flex h-16 max-w-6xl items-center justify-between px-6">
-        <Link href="/" className="">
-          <div className="flex items-center h-16">
-            <Image
-              src="/cnp-logo.svg"
-              alt="Logo"
-              width={63}
-              height={63}
-              className="mr-2"
-            />
-            <h1 className="text-lg font-semibold tracking-tight select-none">
-              Create Next Pro
-            </h1>
-          </div>
-        </Link>
-
-        {isConnectedState ? <UserNav /> : <PublicNav />}
-        <div className="flex items-center h-16">
-          <LocaleSwitcher />
-        </div>
-      </div>
-    </header>
-  );
-}

package/templates/Projects/default/src/ui/_global/GlobalMain.tsx

@@ -1,15 +0,0 @@
-import React from "react";
-
-export default function GlobalMain({
-  children,
-}: {
-  children: React.ReactNode;
-}) {
-  return (
-    <main className="mt-0 min-h-screen bg-neutral-50 font-sans text-gray-900 flex flex-col">
-      <div className="flex-1 flex flex-col justify-center items-stretch mx-auto w-full  px-6 self-stretch">
-        {children}
-      </div>
-    </main>
-  );
-}

package/templates/Projects/default/src/ui/_global/Loading.tsx

@@ -1,13 +0,0 @@
-"use client"; // DO NOT FORGET , this is a client component.
-import { useTranslations } from "next-intl";
-
-const Loading = () => {
-  const t = useTranslations("_global_ui");
-  return (
-    <div className="rounded border bg-white p-6 shadow-sm">
-      <h2 className="text-lg font-semibold mb-2">{t("Loading.title")}</h2>
-      <p className="text-gray-600">{t("Loading.description")}</p>
-    </div>
-  );
-};
-export default Loading;

package/templates/Projects/default/src/ui/_global/LocaleSwitcher.tsx

@@ -1,38 +0,0 @@
-"use client"; // DO NOT FORGET , this is a client component.
-import { useRouter, usePathname } from "next/navigation";
-import { useParams } from "next/navigation";
-
-const locales = [
-  { code: "fr", label: "Français" },
-  { code: "en", label: "English" },
-];
-
-export default function LocaleSwitcher() {
-  const router = useRouter();
-  const pathname = usePathname();
-  const params = useParams();
-  const currentLocale = params?.locale || "fr";
-
-  const handleChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
-    const newLocale = e.target.value;
-    if (newLocale === currentLocale) return;
-    // Replace locale in pathname
-    const newPath = pathname.replace(`/${currentLocale}`, `/${newLocale}`);
-    router.push(newPath);
-  };
-
-  return (
-    <select
-      className="ml-2 ring rounded px-2 py-1 text-sm  dark:bg-gray-800 dark:text-gray-200"
-      value={currentLocale}
-      onChange={handleChange}
-      aria-label="Select language"
-    >
-      {locales.map((l) => (
-        <option key={l.code} value={l.code}>
-          {l.label}
-        </option>
-      ))}
-    </select>
-  );
-}

package/templates/Projects/default/src/ui/_global/PublicNav.tsx

@@ -1,91 +0,0 @@
-"use client"; // DO NOT FORGET , this is a client component.
-import { Link } from "@/lib/i18n/navigation";
-import { useTranslations } from "next-intl";
-import { useEffect, useState, useRef } from "react";
-import { Button } from "@/ui/_global/Button";
-import ThemeToggle from "@/ui/_global/ThemeToggle";
-import { Menu, X } from "lucide-react";
-
-const navLinks = [
-  { href: "/", labelKey: "public_nav.links.home" },
-  { href: "/Login", labelKey: "public_nav.links.login" },
-  { href: "/Register", labelKey: "public_nav.links.register" },
-];
-
-const PublicNav = () => {
-  const t = useTranslations("_global_ui");
-  const [open, setOpen] = useState(false);
-  const menuRef = useRef<HTMLDivElement>(null);
-  useEffect(() => {
-    const handleClickOutside = (event: MouseEvent) => {
-      if (menuRef.current && !menuRef.current.contains(event.target as Node)) {
-        setOpen(false);
-      }
-    };
-
-    if (open) {
-      document.addEventListener("mousedown", handleClickOutside);
-    }
-
-    return () => {
-      document.removeEventListener("mousedown", handleClickOutside);
-    };
-  }, [open]);
-
-  return (
-    <nav aria-label="Public navigation">
-      <div className="flex justify-between items-center h-16">
-        <ul className="flex gap-2 md:gap-4 hidden md:flex items-center space-x-4">
-          {navLinks.map((link) => (
-            <li key={link.href}>
-              <Link
-                href={link.href}
-                className="inline-block rounded px-3 py-1.5 text-sm font-medium dark:text-gray-400 light:text-gray-700 hover:text-blue-600 hover:bg-blue-50 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500"
-              >
-                {t(link.labelKey)}
-              </Link>
-            </li>
-          ))}
-        </ul>
-        <div className="flex items-center space-x-4">
-          <ThemeToggle />
-        </div>
-        <div className="md:hidden flex items-center">
-          <Button
-            variant="default"
-            onClick={() => setOpen((o) => !o)}
-            className="focus:outline-none"
-            aria-label="Menu"
-          >
-            {open ? <X className="h-7 w-7" /> : <Menu className="h-7 w-7" />}
-          </Button>
-        </div>
-      </div>
-
-      {open && (
-        <div className="fixed inset-0 z-40 md:hidden">
-          <div className="absolute inset-0 bg-black/40" aria-hidden="true" />
-          <div
-            ref={menuRef}
-            className="mobil-menu absolute top-4 left-1/2 -translate-x-1/2 flex flex-col gap-2  rounded-xl p-4 shadow-lg animate-fade-in z-50 w-11/12 max-w-xs"
-          >
-            <Link href="/Login" onClick={() => setOpen(false)}>
-              <Button
-                variant="ghost"
-                className="w-full text-white justify-center hover:text-blue-300  cursor-pointer glass-effect"
-              >
-                {t("public_nav.links.login")}
-              </Button>
-            </Link>
-            <Link href="/Register" onClick={() => setOpen(false)}>
-              <Button className="w-full bg-gradient-to-r from-blue-500 to-purple-600 hover:from-blue-600 hover:to-purple-700 justify-center cursor-pointer">
-                {t("public_nav.links.register")}
-              </Button>
-            </Link>
-          </div>
-        </div>
-      )}
-    </nav>
-  );
-};
-export default PublicNav;

package/templates/Projects/default/src/ui/_global/ThemeToggle.tsx

@@ -1,53 +0,0 @@
-"use client";
-import { useEffect, useState } from "react";
-import { Moon, Sun } from "lucide-react";
-import { Button } from "./Button";
-
-export default function ThemeToggle() {
-  const [isDark, setIsDark] = useState(false);
-
-  useEffect(() => {
-    // Initial state from html class
-    setIsDark(document.documentElement.classList.contains("dark"));
-  }, []);
-
-  const toggleTheme = () => {
-    const html = document.documentElement;
-    if (html.classList.contains("dark")) {
-      html.classList.add("light");
-      html.classList.remove("dark");
-      setIsDark(false);
-      localStorage.setItem("theme", "light");
-    } else {
-      html.classList.add("dark");
-      html.classList.remove("light");
-      setIsDark(true);
-      localStorage.setItem("theme", "dark");
-    }
-  };
-
-  useEffect(() => {
-    // On mount, set theme from localStorage
-    const theme = localStorage.getItem("theme");
-    if (theme === "dark") {
-      document.documentElement.classList.add("dark");
-      document.documentElement.classList.remove("light");
-      setIsDark(true);
-    } else if (theme === "light") {
-      document.documentElement.classList.add("light");
-      document.documentElement.classList.remove("dark");
-      setIsDark(false);
-    }
-  }, []);
-
-  return (
-    <Button
-      onClick={toggleTheme}
-      className="ml-2 p-2 rounded-full hover:bg-white/10 transition-colors  "
-      aria-label="Toggle theme"
-      type="button"
-    >
-      {isDark ? <Sun className="h-5 w-5" /> : <Moon className="h-5 w-5" />}
-    </Button>
-  );
-}

package/templates/Projects/default/src/ui/_global/UserNav.tsx

@@ -1,35 +0,0 @@
-"use client"; // DO NOT FORGET , this is a client component.
-import { Link } from "@/lib/i18n/navigation";
-import { useTranslations } from "next-intl";
-import LogoutButton from "../Dashboard/LogoutButton";
-
-const navLinks = [
-  { href: "/Dashboard", labelKey: "user_nav.links.dashboard" },
-  { href: "/Settings", labelKey: "user_nav.links.settings" },
-  { href: "/UserInfo", labelKey: "user_nav.links.user_info" },
-];
-
-const UserNav = () => {
-  const t = useTranslations("_global_ui");
-  return (
-    <nav aria-label="User navigation">
-      <ul className="flex gap-2 md:gap-4 h-16 items-center">
-        {navLinks.map((link) => (
-          <li key={link.href}>
-            <Link
-              href={link.href}
-              className="inline-block rounded px-3 py-1.5 text-sm font-medium text-gray-700 hover:text-blue-600 hover:bg-blue-50 transition-colors focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500"
-            >
-              {t(link.labelKey)}
-            </Link>
-          </li>
-        ))}
-        <li>
-          <LogoutButton />
-        </li>
-      </ul>
-    </nav>
-  );
-};
-
-export default UserNav;

package/templates/Projects/default/src/ui/_home/page-ui.tsx

@@ -1,27 +0,0 @@
-// src/ui/_home/page-ui.tsx
-"use client";
-
-import { useTranslations } from "next-intl";
-
-export default function HomePageUI() {
-  const t = useTranslations("_home");
-
-  return (
-    <>
-      <section className="pt-32 pb-20 px-4 sm:px-6 lg:px-8 hero-pattern">
-        <div className="max-w-7xl mx-auto">
-          <div className="grid lg:grid-cols-2 gap-12 items-center">
-            <h1 className="text-5xl lg:text-6xl font-bold mb-6 leading-tight">
-              {t.rich("title", {
-                span: (chunks) => (
-                  <span className="gradient-text">{chunks}</span>
-                ),
-              })}
-            </h1>
-            <p className="text-lg text-gray-400">{t("description")}</p>
-          </div>
-        </div>
-      </section>
-    </>
-  );
-}