feat: new homepage (#6)

* chore: update .env.example

* build(deps): bump next from 15.3.0 to 15.3.4

* feat: new login button

* fix: update favicon

* build(deps): bump lucide-react

* fix: add xs breakpoint to tailwindcss

* fix: layout issue with Sidebar provider too high on DOM tree

* feat: new homepage

* style: fix some text color

* fix: capital T in telegram (woops)

* chore: format

* fix: grammar

Co-authored-by: Tommaso Morganti <[email protected]>

---------

Co-authored-by: Tommaso Morganti <[email protected]>

Author: lorenzocorallo

.env.example

@@ -1,23 +1,3 @@
-# Since the ".env" file is gitignored, you can use the ".env.example" file to
-# build a new ".env" file when you clone the repo. Keep this file up-to-date
-# when you add new variables to `.env`.
-
-# This file will be committed to version control, so make sure not to have any
-# secrets in it. If you are cloning this repo, create a copy of this file named
-# ".env" and populate it with your secrets.
-
-# When adding additional environment variables, the schema in "/src/env.js"
-# should be updated accordingly.
-
-# Next Auth
-# You can generate a new secret on the command line with:
-# npx auth secret
-# https://next-auth.js.org/configuration/options#secret
-AUTH_SECRET=""
-
-# Next Auth Discord Provider
-AUTH_DISCORD_ID=""
-AUTH_DISCORD_SECRET=""
-
-# Drizzle
-DATABASE_URL="postgresql://postgres:password@localhost:5432/admin"
+# this file might be outdated, please check /src/env.js for required env
+BACKEND_URL="http://localhost:3000"
+ADMIN_ORG_EMAIL="## Email address of admin Azure account ##"),

package.json

@@ -42,8 +42,8 @@
     "clsx": "^2.1.1",
     "cmdk": "^1.1.1",
     "geist": "^1.3.0",
-    "lucide-react": "^0.475.0",
-    "next": "^15.3.0",
+    "lucide-react": "^0.525.0",
+    "next": "^15.3.4",
     "next-themes": "^0.4.4",
     "postgres": "^3.4.4",
     "react": "^18.3.1",
@@ -67,7 +67,7 @@
     "@typescript-eslint/eslint-plugin": "^8.1.0",
     "@typescript-eslint/parser": "^8.1.0",
     "eslint": "^8.57.0",
-    "eslint-config-next": "^15.0.1",
+    "eslint-config-next": "^15.3.4",
     "postcss": "^8.4.39",
     "prettier": "^3.3.2",
     "prettier-plugin-tailwindcss": "^0.6.11",

pnpm-lock.yaml

@@ -1,5 +1,5 @@
 export default {
   plugins: {
-    '@tailwindcss/postcss': {},
+    "@tailwindcss/postcss": {},
   },
 };

postcss.config.js

@@ -11,7 +11,7 @@ export default async function Account() {
 
   return (
     <main className="container mx-auto px-4 py-8">
-      <h2 className="mb-4 text-3xl font-bold text-accent-foreground">
+      <h2 className="text-accent-foreground mb-4 text-3xl font-bold">
         Account
       </h2>
 
@@ -28,7 +28,7 @@ export default async function Account() {
         <div>
           <p>{user.name}</p>
           <p>{user.email}</p>
-          <div className="flex items-center mt-2 gap-2">
+          <div className="mt-2 flex items-center gap-2">
             <p className="text-accent-foreground/70">Telegram: </p>
             <Telegram />
           </div>

public/favicon.ico

@@ -47,7 +47,7 @@ function ShowTelegram({
     <>
       <span>@{username}</span>
       {!isLoading && data && data.role !== "user" && (
-        <span className="text-xs text-foreground/30">(role: {data.role})</span>
+        <span className="text-foreground/30 text-xs">(role: {data.role})</span>
       )}
     </>
   );
@@ -185,7 +185,7 @@ function Form({ onComplete }: { onComplete: () => void }) {
     );
 
   return code && ttl ? (
-    <div className="flex flex-col items-center gap-4 pb-4 pt-8">
+    <div className="flex flex-col items-center gap-4 pt-8 pb-4">
       <p className="flex items-center justify-between gap-4 text-4xl">
         {code.split("").map((c, i) => (
           <span key={i}>{c}</span>
@@ -210,7 +210,7 @@ function Form({ onComplete }: { onComplete: () => void }) {
         <Code copyOnClick>/link</Code>
       </div>
 
-      <p className="pt-2 text-xs text-foreground/30">
+      <p className="text-foreground/30 pt-2 text-xs">
         Having troubles with this code?{" "}
         <button className="underline" onClick={reset}>
           Click to reset
@@ -275,7 +275,7 @@ function Timer({
           timeLeft < 31_000 ? "bg-red-600 dark:bg-red-400" : "bg-primary"
         }
       />
-      <span className="text-sm text-foreground/70">
+      <span className="text-foreground/70 text-sm">
         Time left:
         <span className="inline-block w-10 text-end">
           {Math.floor(timeLeft / 1000)}s

src/app/dashboard/(active)/account/page.tsx

@@ -5,7 +5,7 @@ export default async function AdminHome() {
   return (
     session && (
       <div className="container mx-auto px-4 py-8">
-        <h2 className="mb-4 text-3xl font-bold text-accent-foreground">Home</h2>
+        <h2 className="text-accent-foreground mb-4 text-3xl font-bold">Home</h2>
       </div>
     )
   );