Merge pull request 'feature/syasya/testlayout' (#8) from feature/syasya/testlayout into master

Reviewed-on: #8
2025-08-21 08:58:03 +00:00 · 2025-08-21 08:58:03 +00:00 · 9b65e38542
commit 9b65e38542
parent 175b759611 5041c5a27d
22 changed files with 344 additions and 308 deletions
--- a/.env.example
+++ b/.env.example
@ -1,11 +1,6 @@
-NEXT_PUBLIC_API_BASE_URL=http://localhost:3005
+FASTAPI_URL="http://localhost:8000"
+INTERNAL_API_BASE_URL="http://localhost:3005"
+

 DATABASE_URL="postgresql://postgres:root@localhost:5432/rooftop?schema=public"
 JWT_SECRET="secret_key"
-
-#SUNGROW
-SUNGROW_SECRET_KEY=
-SUNGROW_APP_KEY=
-
-#CHINT
-NEXT_PUBLIC_CHINT_TOKEN=
--- a/.gitea/workflows/pr-build-check.yml
+++ b/.gitea/workflows/pr-build-check.yml
@ -27,8 +27,8 @@ jobs:
      - name: Build
        run: npm run build
        env:
-          NEXT_PUBLIC_URL: 'http://localhost:3000'
-          NEXT_PUBLIC_FORECAST_URL: 'http://localhost:3001'
+          NEXT_PUBLIC_URL: 'http://localhost:3005'
+          NEXT_PUBLIC_FORECAST_URL: 'http://localhost:3005'
          DATABASE_URL: 'postgresql://dummy:dummy@localhost:5432/dummy'
          SMTP_EMAIL: 'dummy@example.com'
          SMTP_EMAIL_PASSWORD: 'dummy'
--- a/26
+++ b/26
@ -0,0 +1,26 @@
+FROM node:18
+
+WORKDIR /app
+COPY . .
+
+# Accept build-time arguments
+ARG FASTAPI_URL
+ARG INTERNAL_API_BASE_URL
+ARG DATABASE_URL
+ARG JWT_SECRET
+
+# Assign them to environment variables inside the image
+ENV FASTAPI_URL=$FASTAPI_URL
+ENV INTERNAL_API_BASE_URL=$INTERNAL_API_BASE_URL
+ENV DATABASE_URL=$DATABASE_URL
+ENV JWT_SECRET=$JWT_SECRET
+
+RUN npm install --force
+
+# Build Next.js app
+RUN npx prisma generate
+RUN npm run build
+
+EXPOSE 3005 
+
+CMD ["npm", "start"]
--- a/app/(admin)/adminDashboard/page.tsx
+++ b/app/(admin)/adminDashboard/page.tsx
@ -59,6 +59,7 @@ const AdminDashboard = () => {
  const router = useRouter();
  const pathname = usePathname();
  const searchParams = useSearchParams();
+  const [authChecked, setAuthChecked] = useState(false);

  // --- load CRM projects dynamically ---
  const [sites, setSites] = useState<CrmProject[]>([]);
@ -67,6 +68,42 @@ const AdminDashboard = () => {
  // near other refs
  const loggingRef = useRef<HTMLDivElement | null>(null);

+  const API = process.env.NEXT_PUBLIC_FASTAPI_URL || 'http://127.0.0.1:8000';
+
+useEffect(() => {
+  let cancelled = false;
+
+  const checkAuth = async () => {
+    try {
+      const res = await fetch(`${API}/auth/me`, {
+        credentials: 'include',
+        cache: 'no-store',
+      });
+
+      if (!res.ok) {
+        router.replace('/login');
+        return;
+      }
+
+      const user = await res.json().catch(() => null);
+      if (!user?.id) {
+        router.replace('/login');
+        return;
+      }
+      // authenticated
+    } catch {
+      router.replace('/login');
+      return;
+    } finally {
+      if (!cancelled) setAuthChecked(true);
+    }
+  };
+
+  checkAuth();
+  return () => { cancelled = true; };
+}, [router, API]);
+
+  

  useEffect(() => {
    setSitesLoading(true);
@ -288,7 +325,7 @@ const AdminDashboard = () => {
            setHasTodayData(true);   // and today has data too
            break;
          }
-        } catch {
+  } catch {
          // ignore and keep polling
        }
        await new Promise(r => setTimeout(r, 3000));
@ -300,6 +337,10 @@ const AdminDashboard = () => {
  };

  // ---------- RENDER ----------
+  if (!authChecked) {
+    return <div>Checking authentication…</div>;
+  }
+  
  if (sitesLoading) {
    return (
      <DashboardLayout>
--- a/app/(auth)/login/page.tsx
+++ b/app/(auth)/login/page.tsx
@ -1,73 +1,115 @@
+// app/login/page.tsx
+'use client';
+
 import Link from 'next/link';
-import { Metadata } from 'next';
-import React from 'react';
+import React, { useEffect, useState } from 'react';
+import { useRouter } from 'next/navigation';
 import ComponentsAuthLoginForm from '@/components/auth/components-auth-login-form';

-type Props = {}
+export default function LoginPage() {
+  const router = useRouter();
+  const [ready, setReady] = useState(false); // gate to avoid UI flash

-const LoginPage = (props: Props) => {
-    return (
-        <div className="relative min-h-screen overflow-hidden bg-[#060818] text-white">
-            {/* Background gradient layer */}
-            <div className="absolute inset-0 -z-10">
-                <img
-                    src="/assets/images/auth/bg-gradient.png"
-                    alt="background gradient"
-                    className="h-full w-full object-cover"
-                />
-                <div className="absolute inset-0 bg-black/50 backdrop-blur-sm" />
-            </div>
+  // Use ONE client-exposed API env var everywhere
+  const API = process.env.NEXT_PUBLIC_FASTAPI_URL || 'http://127.0.0.1:8000';

-            {/* Background decorative objects */}
-            <img
-                src="/assets/images/auth/coming-soon-object1.png"
-                alt="left decor"
-                className="absolute left-0 top-1/2 hidden h-full max-h-[893px] -translate-y-1/2 brightness-125 md:block"
-            />
-            <img
-                src="/assets/images/auth/coming-soon-object3.png"
-                alt="right decor"
-                className="absolute right-0 top-0 hidden h-[300px] brightness-125 md:block"
-            />
+  useEffect(() => {
+    let cancelled = false;
+    const controller = new AbortController();

-            {/* Centered card wrapper */}
-            <div className="relative flex min-h-screen items-center justify-center px-6 py-10 sm:px-16">
-                <div
-                    className="relative w-full max-w-[870px] rounded-2xl p-1
-                               bg-[linear-gradient(45deg,#fffbe6_0%,rgba(255,251,230,0)_25%,rgba(255,251,230,0)_75%,#fffbe6_100%)]
-                               dark:bg-[linear-gradient(52.22deg,#facc15_0%,rgba(250,204,21,0)_20%,rgba(250,204,21,0)_80%,#facc15_100%)]"
+    (async () => {
+      try {
+        const res = await fetch(`${API}/auth/me`, {
+          credentials: 'include',
+          cache: 'no-store',        // don't reuse a cached 401
+          signal: controller.signal,
+        });
+
+        if (!res.ok) {
+          if (!cancelled) setReady(true);
+          return;
+        }
+
+        const user = await res.json().catch(() => null);
+        if (user?.id) {
+          // already logged in -> go straight to dashboard
+          router.replace('/adminDashboard');
+          return;
+        }
+
+        // not logged in -> show form
+        if (!cancelled) setReady(true);
+      } catch {
+        // network/error -> show form
+        if (!cancelled) setReady(true);
+      }
+    })();
+
+    return () => {
+      cancelled = true;
+      controller.abort();
+    };
+  }, [router, API]);
+
+  if (!ready) return null; // or a spinner/skeleton
+
+  return (
+    <div className="relative min-h-screen overflow-hidden bg-[#060818] text-white">
+      {/* Background gradient layer */}
+      <div className="absolute inset-0 -z-10">
+        <img
+          src="/assets/images/auth/bg-gradient.png"
+          alt="background gradient"
+          className="h-full w-full object-cover"
+        />
+        <div className="absolute inset-0 bg-black/50 backdrop-blur-sm" />
+      </div>
+
+      {/* Background decorative objects */}
+      <img
+        src="/assets/images/auth/coming-soon-object1.png"
+        alt="left decor"
+        className="absolute left-0 top-1/2 hidden h-full max-h-[893px] -translate-y-1/2 brightness-125 md:block"
+      />
+      <img
+        src="/assets/images/auth/coming-soon-object3.png"
+        alt="right decor"
+        className="absolute right-0 top-0 hidden h-[300px] brightness-125 md:block"
+      />
+
+      {/* Centered card wrapper */}
+      <div className="relative flex min-h-screen items-center justify-center px-6 py-10 sm:px-16">
+        <div
+          className="relative w-full max-w-[870px] rounded-2xl p-1
+                     bg-[linear-gradient(45deg,#fffbe6_0%,rgba(255,251,230,0)_25%,rgba(255,251,230,0)_75%,#fffbe6_100%)]
+                     dark:bg-[linear-gradient(52.22deg,#facc15_0%,rgba(250,204,21,0)_20%,rgba(250,204,21,0)_80%,#facc15_100%)]"
+        >
+          <div className="relative z-10 rounded-2xl bg-white/10 px-8 py-16 backdrop-blur-lg dark:bg-white/10 lg:min-h-[600px]">
+            <div className="mx-auto w-full max-w-[440px] text-center">
+              <h1 className="text-4xl font-extrabold uppercase tracking-wide text-yellow-400 mb-2">
+                Sign In
+              </h1>
+              <p className="text-base font-medium text-gray-200 dark:text-gray-300 mb-8">
+                Enter your email and password to access your account.
+              </p>
+
+              <ComponentsAuthLoginForm />
+
+              <div className="mt-6 text-sm text-gray-200 dark:text-gray-300">
+                Don’t have an account?{' '}
+                <Link
+                  href="/register"
+                  className="text-yellow-400 font-semibold underline transition hover:text-white"
                >
-                    {/* Inner card (glassmorphic effect) */}
-                    <div className="relative z-10 rounded-2xl bg-white/10 px-8 py-16 backdrop-blur-lg dark:bg-white/10 lg:min-h-[600px]">
-                        <div className="mx-auto w-full max-w-[440px] text-center">
-                            {/* Header */}
-                            <h1 className="text-4xl font-extrabold uppercase tracking-wide text-yellow-400 mb-2">
-                                Sign In
-                            </h1>
-                            <p className="text-base font-medium text-gray-200 dark:text-gray-300 mb-8">
-                                Enter your email and password to access your account.
-                            </p>
-
-                            {/* Login form */}
-                            <ComponentsAuthLoginForm />
-
-                            {/* Footer link */}
-                            <div className="mt-6 text-sm text-gray-200 dark:text-gray-300">
-                                Don’t have an account?{" "}
-                                <Link
-                                    href="/register"
-                                    className="text-yellow-400 font-semibold underline transition hover:text-white"
-                                >
-                                    SIGN UP
-                                </Link>
-                            </div>
-                        </div>
-                    </div>
-                </div>
+                  SIGN UP
+                </Link>
+              </div>
            </div>
+          </div>
        </div>
-    );
-};
+      </div>
+    </div>
+  );
+}


-export default LoginPage
--- a/app/layout.tsx
+++ b/app/layout.tsx
@ -1,30 +1,25 @@
-'use client';
-import ProviderComponent from '@/components/layouts/provider-component';
-import 'react-perfect-scrollbar/dist/css/styles.css';
-import '../styles/tailwind.css';
-import { Metadata } from 'next';
-import { Nunito } from 'next/font/google';
+// app/layout.tsx
+import type { Metadata } from "next";
+import ProviderComponent from "@/components/layouts/provider-component";
+import "react-perfect-scrollbar/dist/css/styles.css";
+import "../styles/tailwind.css";
+import { Nunito } from "next/font/google";
 import { Exo_2 } from "next/font/google";

-const exo2 = Exo_2({
-  subsets: ["latin"],
-  variable: "--font-exo2",
-  weight: ["200", "400"],
-});
+const exo2 = Exo_2({ subsets: ["latin"], variable: "--font-exo2", weight: ["200", "400"] });
+const nunito = Nunito({ weight: ["400","500","600","700","800"], subsets: ["latin"], display: "swap", variable: "--font-nunito" });

-const nunito = Nunito({
-    weight: ['400', '500', '600', '700', '800'],
-    subsets: ['latin'],
-    display: 'swap',
-    variable: '--font-nunito',
-});
+export const metadata: Metadata = {
+  title: "Rooftop Meter",
+  icons: { icon: "/favicon.png" }, // or "/favicon.ico"
+};

 export default function RootLayout({ children }: { children: React.ReactNode }) {
-    return (
-        <html lang="en">
-            <body className={exo2.variable}>
-                <ProviderComponent>{children}</ProviderComponent>
-            </body>
-        </html>
-    )
+  return (
+    <html lang="en" className={`${exo2.variable} ${nunito.variable}`}>
+      <body>
+        <ProviderComponent>{children}</ProviderComponent>
+      </body>
+    </html>
+  );
 }
--- a/app/utils/api.ts
+++ b/app/utils/api.ts
@ -10,7 +10,7 @@ export interface TimeSeriesResponse {
 }

 const API_BASE_URL =
-  process.env.NEXT_PUBLIC_API_BASE_URL ?? "http://127.0.0.1:8000";
+  process.env.FASTAPI_URL ?? "http://127.0.0.1:8000";

 export const crmapi = {
  getProjects: async () => {
--- a/components/auth/components-auth-login-form.tsx
+++ b/components/auth/components-auth-login-form.tsx
@ -3,31 +3,46 @@ import IconLockDots from '@/components/icon/icon-lock-dots';
 import IconMail from '@/components/icon/icon-mail';
 import { useRouter } from 'next/navigation';
 import { useState } from 'react';
-import axios from 'axios';
 import toast from 'react-hot-toast';

+type User = { id: string; email: string; is_active: boolean };
+
 const ComponentsAuthLoginForm = () => {
  const [email, setEmail] = useState('');
  const [password, setPassword] = useState('');
  const [loading, setLoading] = useState(false);
  const router = useRouter();
+  const API = process.env.NEXT_PUBLIC_FASTAPI_URL; // e.g. http://localhost:8000

-  const submitForm = async (e: React.FormEvent) => {
+  const submitForm = async (e: React.FormEvent<HTMLFormElement>) => {
    e.preventDefault();
    setLoading(true);
    try {
-      const res = await axios.post('/api/login', { email, password });
-      toast.success(res.data?.message || 'Login successful!');
+      const res = await fetch(`${API}/auth/login`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ email, password }),
+        credentials: 'include', // cookie from FastAPI
+      });
+
+      let data: any = null;
+      try {
+        data = await res.json();
+      } catch {
+        // non-JSON error
+      }
+
+      if (!res.ok) {
+        const msg = data?.detail || data?.message || 'Invalid credentials';
+        throw new Error(msg);
+      }
+
+      const user: User = data;
+      toast.success(`Welcome ${user.email}`);
      router.push('/adminDashboard');
      router.refresh();
-      // token cookie is already set by the server:
    } catch (err: any) {
-      console.error('Login error:', err);
-      const msg =
-        err?.response?.data?.message ||
-        err?.message ||
-        'Invalid credentials';
-      toast.error(msg);
+      toast.error(err?.message ?? 'Login failed');
    } finally {
      setLoading(false);
    }
@ -52,6 +67,7 @@ const ComponentsAuthLoginForm = () => {
          </span>
        </div>
      </div>
+
      <div className="pb-2">
        <label htmlFor="Password" className="text-yellow-400 text-left">Password</label>
        <div className="relative text-white-dark">
@ -70,6 +86,7 @@ const ComponentsAuthLoginForm = () => {
          </span>
        </div>
      </div>
+
      <button
        type="submit"
        disabled={loading}
@ -83,3 +100,4 @@ const ComponentsAuthLoginForm = () => {

 export default ComponentsAuthLoginForm;

+
--- a/components/auth/components-auth-register-form.tsx
+++ b/components/auth/components-auth-register-form.tsx
@ -33,12 +33,14 @@ export default function ComponentsAuthRegisterForm({ redirectTo = "/dashboard" }
      return;
    }

+    const API = process.env.NEXT_PUBLIC_FASTAPI_URL; // e.g. http://localhost:8000
    try {
      setLoading(true);
-      const res = await fetch("/api/register", {
-        method: "POST",
-        headers: { "Content-Type": "application/json" },
+      const res = await fetch(`${API}/auth/register`, {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
        body: JSON.stringify({ email, password }),
+        credentials: 'include',
      });

      const data = await res.json();
--- a/components/layouts/header.tsx
+++ b/components/layouts/header.tsx
@ -3,19 +3,18 @@ import { useEffect, useState } from 'react';
 import { useDispatch, useSelector } from 'react-redux';
 import Link from 'next/link';
 import { IRootState } from '@/store';
-import { toggleTheme, toggleSidebar, toggleRTL } from '@/store/themeConfigSlice';
+import { toggleTheme, toggleSidebar } from '@/store/themeConfigSlice';
 import Image from 'next/image';
 import Dropdown from '@/components/dropdown';
 import IconMenu from '@/components/icon/icon-menu';
 import IconSun from '@/components/icon/icon-sun';
 import IconMoon from '@/components/icon/icon-moon';
 import IconUser from '@/components/icon/icon-user';
-import IconMail from '@/components/icon/icon-mail';
 import IconLockDots from '@/components/icon/icon-lock-dots';
 import IconLogout from '@/components/icon/icon-logout';
 import { usePathname, useRouter } from 'next/navigation';

-type UserData = { id: string; email: string; createdAt: string };
+type UserData = { id: string; email: string; is_active: boolean };

 export default function Header() {
  const pathname = usePathname();
@ -27,17 +26,16 @@ export default function Header() {
  const [user, setUser] = useState<UserData | null>(null);
  const [loadingUser, setLoadingUser] = useState(true);

-  // Highlight active menu (your original effect)
+  const API = process.env.NEXT_PUBLIC_FASTAPI_URL || 'http://127.0.0.1:8000';
+
+  // highlight active menu
  useEffect(() => {
    const selector = document.querySelector(
-      'ul.horizontal-menu a[href="' + window.location.pathname + '"]'
+      `ul.horizontal-menu a[href="${window.location.pathname}"]`
    );
    if (selector) {
      document
-        .querySelectorAll('ul.horizontal-menu .nav-link.active')
-        .forEach((el) => el.classList.remove('active'));
-      document
-        .querySelectorAll('ul.horizontal-menu a.active')
+        .querySelectorAll('ul.horizontal-menu .nav-link.active, ul.horizontal-menu a.active')
        .forEach((el) => el.classList.remove('active'));
      selector.classList.add('active');
      const ul: any = selector.closest('ul.sub-menu');
@ -48,16 +46,16 @@ export default function Header() {
    }
  }, [pathname]);

-  async function loadUser() {
+  async function loadUser(signal?: AbortSignal) {
  try {
-    const res = await fetch('/api/auth/me', {
-      method: 'GET',
-      credentials: 'include', // send cookie
-      cache: 'no-store',      // avoid stale cached responses
+    const res = await fetch(`${API}/auth/me`, {
+      credentials: 'include',
+      cache: 'no-store',
+      signal,
    });
    if (!res.ok) throw new Error();
-    const data = await res.json();
-    setUser(data.user);
+    const data = await res.json().catch(() => null);
+    setUser(data?.id ? (data as UserData) : null);
  } catch {
    setUser(null);
  } finally {
@ -65,44 +63,53 @@ export default function Header() {
  }
 }

-useEffect(() => {
-  setLoadingUser(true);
-  loadUser();
-  // eslint-disable-next-line react-hooks/exhaustive-deps
-}, [pathname]); // re-fetch on route change (after login redirect)
+  useEffect(() => {
+    setLoadingUser(true);
+    const controller = new AbortController();
+    loadUser(controller.signal);
+    return () => controller.abort();
+  }, [pathname, API]);

  const handleLogout = async () => {
-    await fetch('/api/auth/logout', { method: 'POST' });
+    try {
+    await fetch(`${API}/auth/logout`, {
+      method: 'POST',
+      credentials: 'include',
+      cache: 'no-store',
+    });
+  } catch (_) {
+    // ignore
+  } finally {
    setUser(null);
-    router.push('/login'); // go to login
+    window.location.href = '/login';
+  }
  };

  return (
    <header className={`z-40 ${themeConfig.semidark && themeConfig.menu === 'horizontal' ? 'dark' : ''}`}>
      <div className="shadow-sm">
        <div className="relative flex w-full items-center bg-white px-5 py-2.5 dark:bg-rtgray-900">
-          {/* Logo */}
+          {/* Logo + mobile toggler */}
          <div className="horizontal-logo flex items-center justify-between ltr:mr-2 rtl:ml-2 lg:hidden">
            <div className="relative h-10 w-32 sm:h-11 sm:w-36 md:h-12 md:w-27 shrink-0 max-h-12">
-                <Image
+              <Image
                src="/assets/images/newfulllogo.png"
                alt="logo"
                fill
                className="object-cover"
                priority
                sizes="(max-width: 640px) 8rem, (max-width: 768px) 9rem, (max-width: 1024px) 10rem, 10rem"
-                />
+              />
            </div>

            <button
-                type="button"
-                onClick={() => dispatch(toggleSidebar())}
-                className="collapse-icon flex p-2 rounded-full hover:bg-rtgray-200 dark:text-white dark:hover:bg-rtgray-700"
+              type="button"
+              onClick={() => dispatch(toggleSidebar())}
+              className="collapse-icon flex p-2 rounded-full hover:bg-rtgray-200 dark:text-white dark:hover:bg-rtgray-700"
            >
-                <IconMenu className="h-6 w-6" />
+              <IconMenu className="h-6 w-6" />
            </button>
-            </div>
-
+          </div>

          {/* Right-side actions */}
          <div className="flex items-center justify-end space-x-1.5 ltr:ml-auto rtl:mr-auto rtl:space-x-reverse dark:text-[#d0d2d6] lg:space-x-2">
@ -124,21 +131,21 @@ useEffect(() => {
            )}

            {/* User dropdown */}
-            <div className="dropdown flex shrink-0 ">
+            <div className="dropdown flex shrink-0">
              {loadingUser ? (
                <div className="h-9 w-9 rounded-full animate-pulse bg-gray-300 dark:bg-rtgray-800" />
              ) : user ? (
-            <Dropdown
-                placement={isRtl ? 'bottom-start' : 'bottom-end'}
-                btnClassName="relative group block"
-                panelClassName="rounded-lg shadow-lg border border-white/10 bg-rtgray-100 dark:bg-rtgray-800 p-2" // ✅
-                button={
-                        <div className="h-9 w-9 rounded-full bg-rtgray-200 dark:bg-rtgray-800 flex items-center justify-center group-hover:bg-rtgray-300 dark:group-hover:bg-rtgray-700">
-                        <IconUser className="h-5 w-5 text-gray-600 dark:text-gray-300" />
-                        </div>
-                    }
+                <Dropdown
+                  placement={isRtl ? 'bottom-start' : 'bottom-end'}
+                  btnClassName="relative group block"
+                  panelClassName="rounded-lg shadow-lg border border-white/10 bg-rtgray-100 dark:bg-rtgray-800 p-2"
+                  button={
+                    <div className="h-9 w-9 rounded-full bg-rtgray-200 dark:bg-rtgray-800 flex items-center justify-center group-hover:bg-rtgray-300 dark:group-hover:bg-rtgray-700">
+                      <IconUser className="h-5 w-5 text-gray-600 dark:text-gray-300" />
+                    </div>
+                  }
                >
-                <ul className="w-[230px] font-semibold text-dark"> {/* make sure this stays transparent */}
+                  <ul className="w-[230px] font-semibold text-dark">
                    <li className="px-4 py-4 flex items-center">
                      <div className="truncate ltr:pl-1.5 rtl:pr-4">
                        <h4 className="text-sm text-left">{user.email}</h4>
--- a/middleware.ts
+++ b/middleware.ts
@ -10,10 +10,10 @@ export function middleware(req: NextRequest) {

    try {
        jwt.verify(token, SECRET_KEY);
-        return NextResponse.next();
+    return NextResponse.next();
    } catch (error) {
        return NextResponse.redirect(new URL("/login", req.url));
    }
-}
+  }

 export const config = { matcher: ["/dashboard", "/profile"] };
--- a/package-lock.json
+++ b/package-lock.json
@ -31,6 +31,7 @@
                "he": "^1.2.0",
                "html2canvas": "^1.4.1",
                "i18next": "^22.4.10",
+                "jose": "^6.0.12",
                "jsonwebtoken": "^9.0.2",
                "jspdf": "^3.0.1",
                "next": "14.0.3",
@ -7107,6 +7108,15 @@
                "jiti": "bin/jiti.js"
            }
        },
+        "node_modules/jose": {
+            "version": "6.0.12",
+            "resolved": "https://registry.npmjs.org/jose/-/jose-6.0.12.tgz",
+            "integrity": "sha512-T8xypXs8CpmiIi78k0E+Lk7T2zlK4zDyg+o1CZ4AkOHgDg98ogdP2BeZ61lTFKFyoEwJ9RgAgN+SdM3iPgNonQ==",
+            "license": "MIT",
+            "funding": {
+                "url": "https://github.com/sponsors/panva"
+            }
+        },
        "node_modules/js-sdsl": {
            "version": "4.2.0",
            "resolved": "https://registry.npmjs.org/js-sdsl/-/js-sdsl-4.2.0.tgz",
@ -14693,6 +14703,11 @@
            "resolved": "https://registry.npmjs.org/jiti/-/jiti-1.21.0.tgz",
            "integrity": "sha512-gFqAIbuKyyso/3G2qhiO2OM6shY6EPP/R0+mkDbyspxKazh8BXDC5FiFsUjlczgdNz/vfra0da2y+aHrusLG/Q=="
        },
+        "jose": {
+            "version": "6.0.12",
+            "resolved": "https://registry.npmjs.org/jose/-/jose-6.0.12.tgz",
+            "integrity": "sha512-T8xypXs8CpmiIi78k0E+Lk7T2zlK4zDyg+o1CZ4AkOHgDg98ogdP2BeZ61lTFKFyoEwJ9RgAgN+SdM3iPgNonQ=="
+        },
        "js-sdsl": {
            "version": "4.2.0",
            "resolved": "https://registry.npmjs.org/js-sdsl/-/js-sdsl-4.2.0.tgz",
--- a/package.json
+++ b/package.json
@ -32,6 +32,7 @@
        "he": "^1.2.0",
        "html2canvas": "^1.4.1",
        "i18next": "^22.4.10",
+        "jose": "^6.0.12",
        "jsonwebtoken": "^9.0.2",
        "jspdf": "^3.0.1",
        "next": "14.0.3",
--- a/pages/api/auth/me.ts
+++ b/pages/api/auth/me.ts
@ -1,46 +0,0 @@
-// pages/api/auth/me.ts
-import type { NextApiRequest, NextApiResponse } from "next";
-import jwt, { JwtPayload } from "jsonwebtoken";
-import { PrismaClient } from "@prisma/client";
-
-const prisma = new PrismaClient();
-const SECRET_KEY = process.env.JWT_SECRET as string;
-
-function readCookieToken(req: NextApiRequest) {
-  const cookie = req.headers.cookie || "";
-  const match = cookie.split("; ").find((c) => c.startsWith("token="));
-  return match?.split("=")[1];
-}
-
-function readAuthBearer(req: NextApiRequest) {
-  const auth = req.headers.authorization;
-  if (!auth?.startsWith("Bearer ")) return undefined;
-  return auth.slice("Bearer ".length);
-}
-
-function hasEmail(payload: string | JwtPayload): payload is JwtPayload & { email: string } {
-  return typeof payload === "object" && payload !== null && typeof (payload as any).email === "string";
-}
-
-export default async function handler(req: NextApiRequest, res: NextApiResponse) {
-  if (req.method !== "GET") return res.status(405).json({ message: "Method not allowed" });
-
-  try {
-    const token = readAuthBearer(req) ?? readCookieToken(req);
-    if (!token) return res.status(401).json({ message: "Unauthorized" });
-
-    const decoded = jwt.verify(token, SECRET_KEY);
-    if (!hasEmail(decoded)) return res.status(401).json({ message: "Invalid token" });
-
-    const user = await prisma.user.findUnique({
-      where: { email: decoded.email },
-      select: { id: true, email: true, createdAt: true },
-    });
-
-    if (!user) return res.status(401).json({ message: "User not found" });
-    return res.status(200).json({ user });
-  } catch {
-    return res.status(401).json({ message: "Invalid token" });
-  }
-}
-
--- a/pages/api/login.ts
+++ b/pages/api/login.ts
@ -1,42 +0,0 @@
-// pages/api/login.ts
-import type { NextApiRequest, NextApiResponse } from "next";
-import { PrismaClient } from "@prisma/client";
-import bcrypt from "bcrypt";
-import jwt from "jsonwebtoken";
-
-const prisma = new PrismaClient();
-const SECRET_KEY = process.env.JWT_SECRET as string;
-
-export default async function handler(req: NextApiRequest, res: NextApiResponse) {
-  if (req.method !== "POST") return res.status(405).json({ message: "Method not allowed" });
-
-  try {
-    const { email, password } = req.body as { email?: string; password?: string };
-    if (!email || !password) return res.status(400).json({ message: "Email and password are required" });
-
-    const user = await prisma.user.findUnique({ where: { email } });
-    if (!user) return res.status(401).json({ message: "Invalid credentials" });
-
-    const isMatch = await bcrypt.compare(password, user.password);
-    if (!isMatch) return res.status(401).json({ message: "Invalid credentials" });
-
-    const token = jwt.sign({ sub: String(user.id), email: user.email }, SECRET_KEY, { expiresIn: "1d" });
-
-    const isProd = process.env.NODE_ENV === "production";
-    const cookie = [
-      `token=${token}`,
-      "HttpOnly",
-      "Path=/",
-      "SameSite=Strict",
-      `Max-Age=${60 * 60 * 24}`, // 1 day
-      isProd ? "Secure" : "",    // only secure in prod
-    ].filter(Boolean).join("; ");
-
-    res.setHeader("Set-Cookie", cookie);
-    return res.status(200).json({ message: "Login successful" });
-  } catch (e) {
-    console.error(e);
-    return res.status(500).json({ message: "Something went wrong" });
-  }
-}
-
--- a/pages/api/logout.ts
+++ b/pages/api/logout.ts
@ -1,20 +0,0 @@
-// pages/api/auth/logout.ts
-import type { NextApiRequest, NextApiResponse } from "next";
-
-export default function handler(req: NextApiRequest, res: NextApiResponse) {
-  const isProd = process.env.NODE_ENV === "production";
-  res.setHeader(
-    "Set-Cookie",
-    [
-      "token=", // empty token
-      "HttpOnly",
-      "Path=/",
-      "SameSite=Strict",
-      "Max-Age=0", // expire immediately
-      isProd ? "Secure" : "",
-    ]
-      .filter(Boolean)
-      .join("; ")
-  );
-  return res.status(200).json({ message: "Logged out" });
-}
--- a/pages/api/register.ts
+++ b/pages/api/register.ts
@ -1,42 +0,0 @@
-// pages/api/register.ts
-import type { NextApiRequest, NextApiResponse } from "next";
-import { PrismaClient } from "@prisma/client";
-import bcrypt from "bcrypt";
-import jwt from "jsonwebtoken";
-
-const prisma = new PrismaClient();
-const SECRET_KEY = process.env.JWT_SECRET as string;
-
-export default async function handler(req: NextApiRequest, res: NextApiResponse) {
-  if (req.method !== "POST") return res.status(405).json({ message: "Method not allowed" });
-
-  try {
-    const { email, password } = req.body as { email?: string; password?: string };
-
-    if (!email || !password) return res.status(400).json({ message: "Email and password are required" });
-
-    const existingUser = await prisma.user.findUnique({ where: { email } });
-    if (existingUser) return res.status(400).json({ message: "User already exists" });
-
-    const hashedPassword = await bcrypt.hash(password, 10);
-    const user = await prisma.user.create({
-      data: { email, password: hashedPassword },
-      select: { id: true, email: true, createdAt: true }, // do NOT expose password
-    });
-
-    const token = jwt.sign({ sub: String(user.id), email: user.email }, SECRET_KEY, { expiresIn: "1d" });
-
-    // Set a secure, httpOnly cookie
-    const maxAge = 60 * 60 * 24; // 1 day
-    res.setHeader(
-      "Set-Cookie",
-      `token=${token}; HttpOnly; Path=/; Max-Age=${maxAge}; SameSite=Strict; Secure`
-    );
-
-    return res.status(201).json({ message: "User registered", user });
-  } catch (err) {
-    console.error(err);
-    return res.status(500).json({ message: "Something went wrong" });
-  }
-}
-
--- a/prisma/migrations/20250815012144_init_users/migration.sql
+++ b/prisma/migrations/20250815012144_init_users/migration.sql
@ -0,0 +1,18 @@
+/*
+  Warnings:
+
+  - You are about to drop the `EnergyData` table. If the table is not empty, all the data it contains will be lost.
+  - You are about to drop the `Site` table. If the table is not empty, all the data it contains will be lost.
+
+*/
+-- DropForeignKey
+ALTER TABLE "public"."EnergyData" DROP CONSTRAINT "EnergyData_consumptionSiteId_fkey";
+
+-- DropForeignKey
+ALTER TABLE "public"."EnergyData" DROP CONSTRAINT "EnergyData_generationSiteId_fkey";
+
+-- DropTable
+DROP TABLE "public"."EnergyData";
+
+-- DropTable
+DROP TABLE "public"."Site";
--- a/prisma/migrations/20250815014502_add_password_hash_and_updated_at/migration.sql
+++ b/prisma/migrations/20250815014502_add_password_hash_and_updated_at/migration.sql
@ -0,0 +1,12 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `password` on the `User` table. All the data in the column will be lost.
+  - Added the required column `passwordHash` to the `User` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- AlterTable
+ALTER TABLE "public"."User" DROP COLUMN "password",
+ADD COLUMN     "name" TEXT,
+ADD COLUMN     "passwordHash" TEXT NOT NULL,
+ADD COLUMN     "updatedAt" TIMESTAMP(3) NOT NULL DEFAULT CURRENT_TIMESTAMP;
--- a/prisma/migrations/20250815022446_add_user/migration.sql
+++ b/prisma/migrations/20250815022446_add_user/migration.sql
@ -0,0 +1,14 @@
+/*
+  Warnings:
+
+  - You are about to drop the column `name` on the `User` table. All the data in the column will be lost.
+  - You are about to drop the column `passwordHash` on the `User` table. All the data in the column will be lost.
+  - You are about to drop the column `updatedAt` on the `User` table. All the data in the column will be lost.
+  - Added the required column `password` to the `User` table without a default value. This is not possible if the table is not empty.
+
+*/
+-- AlterTable
+ALTER TABLE "public"."User" DROP COLUMN "name",
+DROP COLUMN "passwordHash",
+DROP COLUMN "updatedAt",
+ADD COLUMN     "password" TEXT NOT NULL;
--- a/prisma/migrations/migration_lock.toml
+++ b/prisma/migrations/migration_lock.toml
@ -1,3 +1,3 @@
 # Please do not edit this file manually
 # It should be added in your version-control system (e.g., Git)
-provider = "postgresql"
+provider = "postgresql"
--- a/public/favicon.png
+++ b/public/favicon.png