diff --git a/README.md b/README.md index 6772eaf..61a76e5 100644 --- a/README.md +++ b/README.md @@ -1,223 +1,11 @@ # web -![Last Update](https://img.shields.io/badge/last_update-11_Mar_2025-blue) +![Last Update](https://img.shields.io/badge/last_update-8_Apr_2025-purple) [![License: CC0-1.0](https://img.shields.io/badge/License-CC0_1.0-lightgrey.svg)](http://creativecommons.org/publicdomain/zero/1.0/) [![Build and Push Docker Image](https://github.com/ihatenodejs/librecloud-web/actions/workflows/docker.yml/badge.svg)](https://github.com/ihatenodejs/librecloud-web/actions/workflows/docker.yml) -[![Bump Dependencies](https://github.com/ihatenodejs/librecloud-web/actions/workflows/bump.yml/badge.svg)](https://github.com/ihatenodejs/librecloud-web/actions/workflows/bump.yml) LibreCloud's website, dashboard, and API -## Docker Instructions +You can also view the documentation in the `docs/` [folder](https://git.pontusmail.org/librecloud/web/src/branch/main/docs) of this repository. -A Docker setup requires both Docker *and* Docker Compose. - -1. **Install Bun if you haven't already** - - Bun is a fast JavaScript runtime, which we prefer over `npm`. These instructions will be written for Bun, but could be adapted to `npm` or `yarn` if needed. - - ```bash - curl -fsSL https://bun.sh/install | bash - ``` - -2. **Fetch needed file(s)** - - Pick your preferred option to get the file(s) needed for Docker. Either option is fine, although Git is arguably the best option. - - **Option One:** Clone Git Repo - - ```bash - git clone https://git.pontusmail.org/librecloud/web.git - ``` - - **Option Two:** Download Compose file only - - ```bash - wget https://git.pontusmail.org/librecloud/web/raw/branch/main/docker-compose.yml - ``` - - You may have to install `wget`, or you could use `curl` instead. - -3. **Generate auth secret** - - This step is relatively painless. Execute the below command to generate a `.env.local` file with an `AUTH_SECRET`. - - ```bash - bunx auth secret - ``` - -4. **Configure environment variables** - - Following the environment variables section of this README, update your newly created `.env.local` file with your configuration. - -5. **Initialize Prisma** - - Because `web` uses a database for storing Git link statuses (and other things to come), - you will need to initialize the SQLite database. - However, if you are using Docker Compose, a database has already been generated in the container image and is blank. - - If you have a reason to initialize Prisma now, feel free to execute: - - ```bash - bunx prisma migrate dev --name init - ``` - -6. **Setup environment variables** - - Now is the time to go to the "Environment Variables" section and configure them in your `.env.local` file. - -7. **Bring the container up** - - ```bash - docker compose up -d --build - ``` - - Please note: `sudo` may be required. - - You may customize the container with the included `docker-compose.yml` file if needed. Your server will start on port `3019` by default. We suggest using a reverse proxy to serve the site on a domain. - -8. **Complete Setup** - - If you would like to host the entire LibreCloud frontend and backend, - you will also need to set up the following repositories and edit this project to work with *your* setup. - - * [mail-connect](https://git.pontusmail.org/librecloud/mail-connect) - * [docker-mailserver](https://github.com/docker-mailserver/docker-mailserver) - -## Dev Server Instructions - -1. **Install Bun if you haven't already** - - Bun is a fast JavaScript runtime, which we prefer over `npm`. These instructions will be written for Bun, but could be adapted to `npm` or `yarn` if needed. - - ```bash - curl -fsSL https://bun.sh/install | bash - ``` - -2. **Clone the repo** - - ```bash - git clone https://git.pontusmail.org/librecloud/web.git - cd web - ``` - -3. **Install dependencies** - - ```bash - bun install - ``` - -4. **Generate auth secret** - - This step is relatively painless. Execute the below command to generate a `.env.local` file with an `AUTH_SECRET`. - - ```bash - bunx auth secret - ``` - -5. **Configure environment variables** - - Following the environment variables section of this README, update your newly created `.env.local` file with your configuration. - -6. **Initialize Prisma** - - Because `web` uses a database for storing Git link statuses (and other things to come), you will need to initialize the SQLite database. - - A `schema.prisma` file has been provided to make this easy. - - This can be done by executing: - - ```bash - bunx prisma migrate dev --name init - ``` - -7. **Start dev server** - - ```bash - bun dev - ``` - -## Environment Variables - -At the time of writing, LibreCloud is not in the state of perfection, -and as such we are expecting that you have a setup exact to ours. -While this will change in the future, we still suggest that provide all the listed environment variables. - -### Authentik - -We use [Auth.js](https://authjs.dev) to provide authentication for users through Authentik. -To do this, you will need to create a new OAuth2 provider in Authentik and put its configuration in your `.env` file. - -If you need more help doing this, there is a fantastic guide [on Authentik's wiki](https://docs.goauthentik.io/docs/add-secure-apps/providers/oauth2/). - -| Environment Variable | Description | Example | -|-----------------------|---------------------------------------------------------|-------------------------------------------------| -| AUTH_AUTHENTIK_ID | (Auth.js) OAuth2 Provider - Client ID | `UHEkjdUIqi938hUIEijdkWZiudhIUshefIJIo8u3u` | -| AUTH_AUTHENTIK_SECRET | (Auth.js) OAuth2 Provider - Client Secret | [long string] | -| AUTH_AUTHENTIK_ISSUER | (Auth.js) OAuth2 Provider - OpenID Configuration Issuer | `http://authentik.local/application/o/example/` | -| AUTHENTIK_API_KEY | API key for authenticating with Authentik's API | N/A | -| AUTHENTIK_API_URL | Authentik's API endpoint URL | `http://authentik.local/api/v3` | - -### Gitea - -Next, you will need to configure `web` with your Gitea instance. -Create a new access token in your Gitea user settings (), -and input the key you receive, as well as the URL of your instance, and the API URL. -You can find a link to the API and its endpoint URL on the footer. - -| Environment Variable | Description | Example | -|----------------------|-----------------------------------------------|--------------------------------------------| -| GITEA_API_URL | Your Gitea instance API endpoint (see footer) | `http://gitea.local/api/v1` | -| GITEA_API_KEY | Access Token created in user settings | `0000000000000000000000000000000000000000` | -| GITEA_URL | Your Gitea instance URL | `http://gitea.local` | - -### mail-connect - -mail-connect, another project by LibreCloud, is a bridge from `docker-mailserver` to an API. It talks to the container via a Docker socket, but you will need to tell `web` where to find your mailserver API. - -Keep in mind, this endpoint should **NOT** be public, and `web` should be the only authorized user of the API, unless you know what you're doing. There is zero authentication. - -| Environment Variable | Description | Example | -|----------------------|------------------------------|-------------------------| -| MAIL_CONNECT_API_URL | URL of your mail-connect API | `http://localhost:4200` | - -### Auth.js - -We suggest starting by allowing Auth.js - -| Environment Variable | Description | Example | -|----------------------|---------------------------------------------------|-----------------------------------------------------------------------| -| AUTH_SECRET | Generated during `.env.local` creation | `R98/+7HbakYa73YHbooAND+nzae8RaudOdq8Uab/suE=` | -| AUTH_TRUST_HOST | Required, should always be set to `true` | `true` | -| NEXTAUTH_URL | The URL LibreCloud will be publicly accessible at | `http://localhost:3000` (testing), `https://example.com` (production) | - -### Cloudflare - -We use Cloudflare Turnstile for detecting bots and automated scripts attempting to abuse our services. We chose it because it's the perfect balance of security and convenience for users. It was also the most preferred option in the [poll we ran on my Telegram channel](https://t.me/pontushub/457). - -You can get the keys you need for Cloudflare Turnstile [here](https://www.cloudflare.com/application-services/products/turnstile/). It's very plug and play. - -If you would like to simply test or bypass Cloudflare Turnstile, you can use one of the site keys provided [here](https://developers.cloudflare.com/turnstile/troubleshooting/testing/) instead of your own. - -| Environment Variable | Description | Example | -|------------------------|-------------------------------------------|---------------------------------------| -| NEXT_PUBLIC_CF_SITEKEY | Cloudflare Turnstile site key (public) | `1x00000000000000000000AA` | -| CF_SECRETKEY | Cloudflare Turnstile secret key (private) | `0xXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX` | - -## Troubleshooting - -### Performing a database migration - -In case of an update to `prisma/schema.prisma` in this repo, you should run the below command to migrate the old database. - -Each update to this file is guaranteed to work with the previous version of the file to ensure maximum compatibility. While every effort has been made to ensure compatibility, we are not responsible for any data loss. - -```bash -npx prisma migrate dev --name update-schema # Migrate -npx prisma migrate deploy # Deploy -``` - -## To-Do - -* [ ] Add theme switcher to home page -* [ ] Implement security scans -* [ ] Rate-limiting on API +##
[Documentation](https://docs.librecloud.cc) | [Donate](https://donate.stripe.com/6oE8yxaPk6yXbpS145)
\ No newline at end of file diff --git a/app/account/dashboard/ai/page.tsx b/app/account/dashboard/ai/page.tsx index 873b5ad..4bc7e13 100644 --- a/app/account/dashboard/ai/page.tsx +++ b/app/account/dashboard/ai/page.tsx @@ -1,8 +1,7 @@ -"use client"; +"use client" import { motion } from "motion/react" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" -import { Sparkles } from "lucide-react"; +import { Sparkles } from "lucide-react" const fadeIn = { initial: { opacity: 0, y: 20 }, @@ -12,26 +11,21 @@ const fadeIn = { export default function GenAI() { return ( -
- -
-
- - -

Generative AI is coming soon

-

Experience artificial intelligence without the bloat and cost.

-
    -
  • Open-source (and public domain) chat interface
  • -
  • Use the same models you're familiar with
  • -
  • Pay per 1M tokens and save money
  • -
  • Free models for testing/use
  • -
  • ZERO additional fees
  • -
-

If you prefer not to see this service, you will be able to hide it from Settings when it launches.

-
-
-
-
+ + +

Generative AI is coming soon

+ +

Experience artificial intelligence without the bloat and cost.

+ + +

If you prefer not to see this service, you will be able to hide it from Settings when it launches.

+
) } diff --git a/app/account/dashboard/downloads/page.tsx b/app/account/dashboard/downloads/page.tsx index 23dccdb..23bd73c 100644 --- a/app/account/dashboard/downloads/page.tsx +++ b/app/account/dashboard/downloads/page.tsx @@ -1,4 +1,4 @@ -"use client"; +"use client" import { motion } from "motion/react" import { Tabs, TabsContent, TabsList, TabsTrigger } from "@/components/ui/tabs" @@ -6,7 +6,6 @@ import { HomeTab } from "@/components/pages/dashboard/downloads/HomeTab" import { EmailTab } from "@/components/pages/dashboard/downloads/EmailTab" import { PassTab } from "@/components/pages/dashboard/downloads/PassTab" import { GitTab } from "@/components/pages/dashboard/downloads/GitTab" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" const fadeIn = { initial: { opacity: 0, y: 20 }, @@ -16,36 +15,29 @@ const fadeIn = { export default function DownloadCenter() { return ( -
- -
-
- -

Download Center

- - - Home - Email - Pass - Git - - - - - - - - - - - - - - -
-
-
-
+ +

Download Center

+ + + Home + Email + Pass + Git + + + + + + + + + + + + + + +
) } diff --git a/app/account/dashboard/exchange/page.tsx b/app/account/dashboard/exchange/page.tsx index c6f2723..f412937 100644 --- a/app/account/dashboard/exchange/page.tsx +++ b/app/account/dashboard/exchange/page.tsx @@ -1,7 +1,6 @@ -"use client"; +"use client" import { motion } from "motion/react" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" import { BadgeDollarSign } from "lucide-react" const fadeIn = { @@ -12,26 +11,21 @@ const fadeIn = { export default function Exchange() { return ( -
- -
-
- -
-

Coming Soon

-
-

Exchange Crypto

-
- -
-
-

We find the best price, seriously

-

We use the API from several providers to provide comparisons between the different providers. You complete the exchange via our exchange interface (via provider) or through the provider's website. Each time, you can walk out knowing you got the best deal. The best part? We don't take a cut or make a profit off your usage.

-
-
-
-
-
+ +
+

Coming Soon

+
+ +

Exchange Crypto

+
+ +
+ +
+

We find the best price, seriously

+

We use the API from several providers to provide comparisons between the different providers. You complete the exchange via our exchange interface (via provider) or through the provider's website. Each time, you can walk out knowing you got the best deal. The best part? We don't take a cut or make a profit off your usage.

+
+
) } diff --git a/app/account/dashboard/layout.tsx b/app/account/dashboard/layout.tsx index 16cd72d..771d08a 100644 --- a/app/account/dashboard/layout.tsx +++ b/app/account/dashboard/layout.tsx @@ -1,11 +1,21 @@ import { type ReactNode } from "react" import { ThemeProvider } from "@/components/theme-provider" -import SidebarToggle from "@/components/custom/SidebarToggle" import { SidebarProvider } from "@/components/ui/sidebar" import { Footer } from "@/components/pages/dashboard/Footer" -import { Header } from "@/components/pages/dashboard/Header"; +import { Header } from "@/components/pages/dashboard/Header" +import { ServerSideMenu } from "@/components/pages/dashboard/ServerSideMenu" +import { auth } from "@/auth" +import { redirect } from "next/navigation" + +const DashboardLayout = async ({ children }: { children: ReactNode }) => { + // Server-side auth check + const session = await auth() + + // Redirect to login if not authenticated + if (!session) { + redirect("/account/login") + } -const DashboardLayout = ({ children }: { children: ReactNode }) => { return ( { enableSystem disableTransitionOnChange > -
-
- -
+
+ +
+ +
- {children} -
-
-
+
+
+ {children} +
+
+
-
- -
- -
+
+
) diff --git a/app/account/dashboard/page.tsx b/app/account/dashboard/page.tsx index aab027b..96cb561 100644 --- a/app/account/dashboard/page.tsx +++ b/app/account/dashboard/page.tsx @@ -7,7 +7,6 @@ import { OverviewTab } from "@/components/pages/dashboard/OverviewTab" import { SecurityTab } from "@/components/pages/dashboard/SecurityTab" import { ServicesTab } from "@/components/pages/dashboard/ServicesTab" import { GitTab } from "@/components/pages/dashboard/GitTab" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" const fadeIn = { initial: { opacity: 0, y: 20 }, @@ -46,10 +45,22 @@ export default function Dashboard() { gitEmail: data.email || "", })) } else { - throw new Error("Failed to fetch Gitea account details"); + setDashboardState((prev) => ({ + ...prev, + gitUser: "Unlinked", + gitAvatar: "", + gitLastLogin: "Never", + })) + throw new Error("Failed to fetch Gitea account details") } } catch (error) { console.error("Error fetching your Gitea user data:", error); + setDashboardState((prev) => ({ + ...prev, + gitUser: "Unlinked", + gitAvatar: "", + gitLastLogin: "Never", + })) } } @@ -57,36 +68,29 @@ export default function Dashboard() { }, []) return ( -
- -
-
- -

Dashboard

- - - Overview - Security - Services - Git - - - - - - - - - - - - - - -
-
-
-
+ +

Dashboard

+ + + Overview + Security + Services + Git + + + + + + + + + + + + + + +
) } diff --git a/app/account/dashboard/settings/page.tsx b/app/account/dashboard/settings/page.tsx index bc935c9..ee02964 100644 --- a/app/account/dashboard/settings/page.tsx +++ b/app/account/dashboard/settings/page.tsx @@ -1,7 +1,6 @@ -"use client"; +"use client" import { motion } from "motion/react" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" import { Switch } from "@/components/ui/switch" import { Label } from "@/components/ui/label" import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/components/ui/card" @@ -21,23 +20,23 @@ export default function Settings() { hideUpgrades: false, hideCrypto: false }); - const [loading, setLoading] = useState(false); + const [loading, setLoading] = useState(false) useEffect(() => { const fetchSettings = async () => { try { setLoading(true); - const response = await fetch('/api/users/settings'); + const response = await fetch('/api/users/settings') if (response.ok) { - const data = await response.json(); - setSettings(data); + const data = await response.json() + setSettings(data) } else { - console.error('[!] Failed to fetch settings'); + console.error('[!] Failed to fetch settings') } } catch (error) { - console.error('[!] Error fetching settings:', error); + console.error('[!] Error fetching settings:', error) } finally { - setLoading(false); + setLoading(false) } }; @@ -48,10 +47,10 @@ export default function Settings() { setSettings(prev => ({ ...prev, [settingName]: value - })); + })) try { - setLoading(true); + setLoading(true) const response = await fetch('/api/users/settings', { method: 'POST', headers: { @@ -61,86 +60,77 @@ export default function Settings() { ...settings, [settingName]: value }), - }); + }) if (response.ok) { - const updatedSettings = await response.json(); - setSettings(updatedSettings); + const updatedSettings = await response.json() + setSettings(updatedSettings) } else { - console.error('[!] Failed to update settings'); + console.error('[!] Failed to update settings') setSettings(prev => ({ ...prev, [settingName]: !value - })); + })) } } catch (error) { - console.error('[!] Error updating settings:', error); + console.error('[!] Error updating settings:', error) setSettings(prev => ({ ...prev, [settingName]: !value - })); + })) } finally { - setLoading(false); - window.location.reload(); + setLoading(false) + window.location.reload() } }; return ( -
- -
-
- -

Settings

-
- - - - - - UI Settings - - - Modify your user experience here - - - -
-
- - updateSetting('hideGenAI', checked)} - /> -
-
- - updateSetting('hideUpgrades', checked)} - /> -
-
- - updateSetting('hideCrypto', checked)} - /> -
-
-
-
+ +

Settings

+
+ + + + + + Dashboard Settings + + Customize your dashboard experience + + +
+
+ + updateSetting('hideGenAI', checked)} + disabled={loading} + /> +
+
+ + updateSetting('hideUpgrades', checked)} + disabled={loading} + /> +
+
+ + updateSetting('hideCrypto', checked)} + disabled={loading} + /> +
- -
-
-
+ + +
+ ) } diff --git a/app/account/dashboard/statistics/page.tsx b/app/account/dashboard/statistics/page.tsx index 7132c98..3c13b23 100644 --- a/app/account/dashboard/statistics/page.tsx +++ b/app/account/dashboard/statistics/page.tsx @@ -1,9 +1,8 @@ -"use client"; +"use client" import { motion } from "motion/react" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" -import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; -import { Separator } from "@/components/ui/separator"; +import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" +import { Separator } from "@/components/ui/separator" const fadeIn = { initial: { opacity: 0, y: 20 }, @@ -13,65 +12,54 @@ const fadeIn = { export default function Statistics() { return ( -
- -
-
- -

Statistics

- - - Operational Costs - How much it costs us to run LibreCloud each month - - - Month of: March - -
- Server - Price -
-
- node0.librecloud.cc - $28.88 -
-
- orbit.librecloud.cc - $34.24 -
- -
- Domains - Price -
-
- 0 Domains - $0.00 -
- -
- Addons - Price -
-
- 0GB Disk Space - $0.00 -
-
- 0GB RAM - $0.00 -
- -
- TOTAL - $63.12 -
-
-
-
-
-
-
+ +

Statistics

+ + + Operational Costs + How much it costs us to run LibreCloud each month + + + Month of: March + +
+ Server + Price +
+
+ librecloud.cc (PowerEdge R630) + $64.99 +
+ +
+ Domains + Price +
+
+ 0 Domains + $0.00 +
+ +
+ Addons + Price +
+
+ 0GB Disk Space + $0.00 +
+
+ 0GB RAM + $0.00 +
+ +
+ TOTAL + $64.99 +
+
+
+
) } diff --git a/app/account/dashboard/support/page.tsx b/app/account/dashboard/support/page.tsx index 161d76c..af37d60 100644 --- a/app/account/dashboard/support/page.tsx +++ b/app/account/dashboard/support/page.tsx @@ -1,7 +1,6 @@ "use client" import { motion } from "motion/react" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card" import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" @@ -15,47 +14,40 @@ const fadeIn = { export default function Support() { return ( -
- -
-
- -

Support

-
- - - - - Email - - Create a ticket by sending an email - - - You can either send a message to the address below, or click the button. -
- - -
- -
-
+ +

Support

+
+ + + + + Email + + Create a ticket by sending an email + + + You can either send a message to the address below, or click the button. +
+ +
- -
-
-
+ + + +
+ ) } diff --git a/app/account/dashboard/upgrades/page.tsx b/app/account/dashboard/upgrades/page.tsx index 32b8bf5..61e02d5 100644 --- a/app/account/dashboard/upgrades/page.tsx +++ b/app/account/dashboard/upgrades/page.tsx @@ -1,7 +1,6 @@ -"use client"; +"use client" import { motion } from "motion/react" -import { SideMenu } from "@/components/pages/dashboard/SideMenu" const fadeIn = { initial: { opacity: 0, y: 20 }, @@ -11,17 +10,10 @@ const fadeIn = { export default function Upgrades() { return ( -
- -
-
- -

Upgrades

-

Coming soon

-
-
-
-
+ +

Upgrades

+

Coming soon

+
) } diff --git a/app/api/git/link/route.ts b/app/api/git/link/route.ts index 8387854..fd4dc5a 100644 --- a/app/api/git/link/route.ts +++ b/app/api/git/link/route.ts @@ -24,7 +24,7 @@ export async function POST(request: Request) { }) if (!response.ok) { - return NextResponse.json({ error: "Failed to fetch Git user data" }, { status: response.status }) + return NextResponse.json({ error: "Failed to fetch Git user data" }, { status: 403 }) } const userData = await response.json() diff --git a/app/api/git/unlink/route.ts b/app/api/git/unlink/route.ts new file mode 100644 index 0000000..7f46a3a --- /dev/null +++ b/app/api/git/unlink/route.ts @@ -0,0 +1,35 @@ +import { auth } from "@/auth" +import { NextResponse } from "next/server" +import { prisma } from "@/lib/prisma" + +export async function POST() { + try { + const session = await auth() + + if (!session || !session.user?.email) { + return NextResponse.json({ error: "Unauthorized - Please login first" }, { status: 401 }) + } + + const { email } = session.user + + const dbUsrCheck = await prisma.user.findUnique({ + where: { email }, + }) + + if (dbUsrCheck && dbUsrCheck.username) { + await prisma.user.update({ + where: { email }, + data: { username: null }, + }) + return NextResponse.json({ success: true }) + } else if (!dbUsrCheck?.username) { + return NextResponse.json({ error: "Database error" }, { status: 500 }) + } else { + return NextResponse.json({ error: "Git account not linked" }, { status: 404 }) + } + } catch (error) { + console.error("Git unlink API error:", error) + return NextResponse.json({ error: "Internal server error" }, { status: 500 }) + } +} + diff --git a/app/api/git/user/route.ts b/app/api/git/user/route.ts index 8cc1bbd..07b4d24 100644 --- a/app/api/git/user/route.ts +++ b/app/api/git/user/route.ts @@ -6,7 +6,7 @@ export async function GET() { try { const session = await auth() - if (!session || !session.user?.email) { + if (!session || !session.user || !session.user.email) { return NextResponse.json({ error: "Unauthorized - Please login first" }, { status: 401 }) } diff --git a/components/cards/dashboard/Settings/ChangePassword.tsx b/components/cards/dashboard/Settings/ChangePassword.tsx index 24563cc..5e0de7c 100644 --- a/components/cards/dashboard/Settings/ChangePassword.tsx +++ b/components/cards/dashboard/Settings/ChangePassword.tsx @@ -5,7 +5,7 @@ import { Card, CardContent, CardHeader, CardTitle, CardDescription } from "@/com import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { Label } from "@/components/ui/label" -import { Mail, Key, Loader } from "lucide-react" +import { Mail, Key, Loader2 } from "lucide-react" export function ChangePassword() { const [newPassword, setNewPassword] = useState(""); @@ -62,8 +62,9 @@ export function ChangePassword() { className="mt-1.5" /> - {message &&

{message}

} diff --git a/components/cards/dashboard/git/GiteaProfileCard.tsx b/components/cards/dashboard/git/GiteaProfileCard.tsx index 045ef33..9dfe7b4 100644 --- a/components/cards/dashboard/git/GiteaProfileCard.tsx +++ b/components/cards/dashboard/git/GiteaProfileCard.tsx @@ -1,6 +1,6 @@ "use client" -import { Card, CardHeader, CardTitle, CardContent } from "@/components/ui/card" +import { Card, CardContent } from "@/components/ui/card" import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar" import { Badge } from "@/components/ui/badge" import { Users, Clock, User, Mail } from "lucide-react" @@ -24,17 +24,7 @@ export function GiteaProfileCard({ dashboardState }: { dashboardState: Dashboard return ( - -
- Profile - {dashboardState.gitIsAdmin && ( - - Admin - - )} -
-
- +
@@ -43,7 +33,14 @@ export function GiteaProfileCard({ dashboardState }: { dashboardState: Dashboard
-

{dashboardState.gitUser}

+
+

{dashboardState.gitUser}

+ {dashboardState.gitIsAdmin && ( + + Admin + + )} +
diff --git a/components/cards/dashboard/git/LinkGitea.tsx b/components/cards/dashboard/git/LinkGitea.tsx index 193479c..e085849 100644 --- a/components/cards/dashboard/git/LinkGitea.tsx +++ b/components/cards/dashboard/git/LinkGitea.tsx @@ -9,7 +9,9 @@ import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage } from " import { Input } from "@/components/ui/input" import { Button } from "@/components/ui/button" import { SiGitea } from "react-icons/si" -import { Loader } from "lucide-react" +import { AlertCircle, Loader2 } from "lucide-react" +import { Alert, AlertTitle, AlertDescription } from "@/components/ui/alert" +import Link from "next/link" const giteaFormSchema = z.object({ username: z @@ -28,6 +30,9 @@ type GiteaFormValues = z.infer export function LinkGitea({ linked }: { linked: boolean }) { const [loading, setLoading] = useState(false) + const [unlinkLoading, setUnlinkLoading] = useState(false) + const [linkError, setLinkError] = useState("") + const [unlinkError, setUnlinkError] = useState("") const form = useForm({ resolver: zodResolver(giteaFormSchema), @@ -47,28 +52,48 @@ export function LinkGitea({ linked }: { linked: boolean }) { body: JSON.stringify({ username: data.username }), }) - if (!response.ok) { - throw new Error("Failed to link Gitea account") - } - const responseData = await response.json() if (responseData.success) { console.log("Gitea account linked:", responseData) location.reload() } else if (responseData.error) { - form.setError("username", { message: responseData.error }) + setLinkError(responseData.error) setLoading(false) } else { - form.setError("username", { message: "Failed to link" }) + setLinkError("Failed to link") setLoading(false) throw new Error("Failed to link Gitea account") } } catch (error) { setLoading(false) + setLinkError("Failed to link") console.error("Error linking Gitea account:", error) } } + const onUnlink = async () => { + setUnlinkLoading(true) + try { + const response = await fetch("/api/git/unlink", { + method: "POST", + }) + + const responseData = await response.json() + if (responseData.success) { + console.log("Gitea account unlinked") + location.reload() + } else { + setUnlinkError(responseData.error) + console.error("Failed to unlink:", responseData.error) + setUnlinkLoading(false) + } + } catch (error) { + setUnlinkLoading(false) + setUnlinkError("Failed to unlink") + console.error("Error unlinking Gitea account:", error) + } + } + if (!linked) { return ( @@ -82,6 +107,13 @@ export function LinkGitea({ linked }: { linked: boolean }) {
+ {linkError && ( + + + Oops! Something went wrong. + {linkError} + + )}
( Gitea Username - + @@ -98,15 +130,29 @@ export function LinkGitea({ linked }: { linked: boolean }) { )} /> {loading ? ( - +
+ + +
) : ( - +
+ + + + +
)} @@ -115,7 +161,39 @@ export function LinkGitea({ linked }: { linked: boolean }) { ) } else { - return null + return ( + + + Git Link + + Your Gitea account is currently linked to your LibreCloud account. + + + + {unlinkError && ( + + + Oops! Something went wrong. + {unlinkError} + + )} +

+ Unlinking your Gitea account will not delete your Gitea account. You can delete your Gitea account here. +

+ {unlinkLoading ? ( + + ) : ( + + )} +
+
+ ) } } diff --git a/components/custom/LogoutMenuItem.tsx b/components/custom/LogoutMenuItem.tsx index e574371..9d120a9 100644 --- a/components/custom/LogoutMenuItem.tsx +++ b/components/custom/LogoutMenuItem.tsx @@ -1,20 +1,30 @@ -"use client"; +"use client" -import { SidebarMenuButton, SidebarMenuItem } from "@/components/ui/sidebar"; -import { DoorOpen } from "lucide-react"; -import { logout } from "@/actions/logout"; +import { SidebarMenuButton, SidebarMenuItem } from "@/components/ui/sidebar" +import { DoorOpen, Loader2 } from "lucide-react" +import { logout } from "@/actions/logout" +import { useState } from "react" export function SidebarSignOut() { + const [isLoading, setIsLoading] = useState(true) + return ( -
- - - Logout + {isLoading ? ( + + setIsLoading(true)}> + + Logout + + + ) : ( + + + Logging out... - + )}
- ); + ) } -export default SidebarSignOut; \ No newline at end of file +export default SidebarSignOut \ No newline at end of file diff --git a/components/custom/SidebarToggle.tsx b/components/custom/SidebarToggle.tsx deleted file mode 100644 index e3fb45e..0000000 --- a/components/custom/SidebarToggle.tsx +++ /dev/null @@ -1,25 +0,0 @@ -"use client"; - -import { useSidebar } from "@/components/ui/sidebar"; -import { Button } from "@/components/ui/button"; -import { Menu } from "lucide-react"; - -const SidebarToggle = () => { - // TODO: Sidebar logic needs fixing (hide sidebar on button click) - const { toggleSidebar } = useSidebar(); - return ( -
- -
- ); -}; - -export default SidebarToggle; - diff --git a/components/pages/dashboard/Footer.tsx b/components/pages/dashboard/Footer.tsx index 9dcfc25..658c36d 100644 --- a/components/pages/dashboard/Footer.tsx +++ b/components/pages/dashboard/Footer.tsx @@ -1,7 +1,8 @@ "use client" +import { SidebarTrigger } from "@/components/ui/sidebar" import { useEffect, useState } from "react" -import { TbNoCopyright } from "react-icons/tb"; +import { TbNoCopyright } from "react-icons/tb" export function Footer() { const [renderTime, setRenderTime] = useState(null) @@ -19,22 +20,27 @@ export function Footer() { return (
-
-
- -

- Created by a community, not a company. -

+
+
+ +
+
+
+ +

+ Created by a community, not a company. +

+
+ {renderTime !== null ? ( +

+ Page rendered in {renderTime.toFixed(2)} ms +

+ ) : ( +

+ Calculating render time... +

+ )}
- {renderTime !== null ? ( -

- Page rendered in {renderTime.toFixed(2)} ms -

- ) : ( -

- Calculating render time... -

- )}
) diff --git a/components/pages/dashboard/Header.tsx b/components/pages/dashboard/Header.tsx index ede8aed..5f8bd87 100644 --- a/components/pages/dashboard/Header.tsx +++ b/components/pages/dashboard/Header.tsx @@ -24,7 +24,7 @@ export const Header = async () => { ] return ( -
+
{session.user.image || isNaN(Number(session.user.image)) ? ( diff --git a/components/pages/dashboard/ServerSideMenu.tsx b/components/pages/dashboard/ServerSideMenu.tsx new file mode 100644 index 0000000..9b348b9 --- /dev/null +++ b/components/pages/dashboard/ServerSideMenu.tsx @@ -0,0 +1,39 @@ +import { auth } from "@/auth" +import { SideMenu } from "./SideMenu" +import { prisma } from "@/lib/prisma" + +export async function ServerSideMenu() { + // Server-side auth check + const session = await auth() + + if (!session || !session.user || !session.user.email) { + return null + } + + // Fetch user settings + const userSettings = await fetchUserSettings(session.user.email) + + return ( + + ) +} + +async function fetchUserSettings(email: string) { + const user = await prisma.user.findUnique({ where: { email } }); + if (user) { + return { + hideGenAI: user.hideGenAI, + hideUpgrades: user.hideUpgrades, + hideCrypto: user.hideCrypto, + } + } else { + const newUser = await prisma.user.create({ data: { email } }); + return { + hideGenAI: newUser.hideGenAI, + hideUpgrades: newUser.hideUpgrades, + hideCrypto: newUser.hideCrypto, + } + } +} \ No newline at end of file diff --git a/components/pages/dashboard/SideMenu.tsx b/components/pages/dashboard/SideMenu.tsx index 6a1e00b..2d43d39 100644 --- a/components/pages/dashboard/SideMenu.tsx +++ b/components/pages/dashboard/SideMenu.tsx @@ -20,19 +20,37 @@ import { SidebarGroupLabel, SidebarMenuItem, SidebarMenuSkeleton, + useSidebar, } from "@/components/ui/sidebar" import LogoutMenuItem from "@/components/custom/LogoutMenuItem" import type React from "react" import Link from "next/link" import { useState, useEffect } from "react" -export const SideMenu: React.FC = () => { - const [hideGenAI, setHideGenAI] = useState(true) - const [hideUpgrades, setHideUpgrades] = useState(true) - const [hideCrypto, setHideCrypto] = useState(true) - const [isLoading, setIsLoading] = useState(true) +interface UserSettings { + hideGenAI: boolean + hideUpgrades: boolean + hideCrypto: boolean +} + +interface SideMenuProps { + initialSettings?: UserSettings +} + +export const SideMenu: React.FC = ({ initialSettings }) => { + const [hideGenAI, setHideGenAI] = useState(initialSettings?.hideGenAI ?? true) + const [hideUpgrades, setHideUpgrades] = useState(initialSettings?.hideUpgrades ?? true) + const [hideCrypto, setHideCrypto] = useState(initialSettings?.hideCrypto ?? true) + const [isLoading, setIsLoading] = useState(!initialSettings) + const { setOpenMobile } = useSidebar() useEffect(() => { + // Only fetch settings if they weren't provided by the server + if (initialSettings) { + setIsLoading(false) + return + } + fetch("/api/users/settings") .then((res) => res.json()) .then((data) => { @@ -45,133 +63,141 @@ export const SideMenu: React.FC = () => { console.error("Failed to fetch user settings:", error) setIsLoading(false) }) - }, []) + }, [initialSettings]) + + // Handler to close mobile sidebar when a link is clicked + const handleLinkClick = () => { + setOpenMobile(false) + } return ( -
- - - - Services - - - - - - - Dashboard - - - + + +
+

+ LibreCloud +

+
+ + Services + + + + + + + Dashboard + + + - {isLoading ? ( + {isLoading ? ( + + + + ) : ( + !hideGenAI && ( - + + + + Generative AI + + - ) : ( - !hideGenAI && ( - - - - - Generative AI - - - - ) - )} + ) + )} + + + + + Download Center + + + + + + + + + Tools + + + {isLoading ? ( - - - - Download Center - - + - - - - - - Tools - - - {isLoading ? ( + ) : ( + !hideCrypto && ( - + + + + Exchange Crypto + + - ) : ( - !hideCrypto && ( - - - - - Exchange Crypto - - - - ) - )} + ) + )} + + + + + Statistics + + + + + + + + + Account + + + {isLoading ? ( - - - - Statistics - - + - - - - - - Account - - - {isLoading ? ( + ) : ( + !hideUpgrades && ( - + + + + Upgrades + + - ) : ( - !hideUpgrades && ( - - - - - Upgrades - - - - ) - )} + ) + )} - - - - - Support - - - + + + + + Support + + + - - - - - Settings - - - + + + + + Settings + + + - - - - -
-
-
+ + + + + + ) } diff --git a/docs/README.md b/docs/README.md index 4b82c0b..7edb69f 100644 --- a/docs/README.md +++ b/docs/README.md @@ -16,4 +16,8 @@ You will need to setup the following services with Docker, and route them proper ## Get Started -For the best experience, we suggest you use a [Docker setup](getstarted/docker.md) in production, and a [Dev environment](getstarted/dev.md) while testing/making changes. \ No newline at end of file +For the best experience, we suggest you use a [Docker setup](getstarted/docker.md) in production, and a [Dev environment](getstarted/dev.md) while testing/making changes. + +## Donations + +A lot of time and resources are put into operating LibreCloud. Consider donating to support our work with [Stripe](https://donate.stripe.com/6oE8yxaPk6yXbpS145). \ No newline at end of file diff --git a/docs/_sidebar.md b/docs/_sidebar.md index 964bdc7..984d248 100644 --- a/docs/_sidebar.md +++ b/docs/_sidebar.md @@ -11,4 +11,8 @@ * [Environment Variables](reference/env.md) * [Database Migration Guide](reference/db-migration.md) - * [Editing Documentation](reference/editing-docs.md) \ No newline at end of file + * [Editing Documentation](reference/editing-docs.md) + +* Updates + + * [v1.2.0](updates/1.2.0.md) \ No newline at end of file diff --git a/docs/img/1.2.0-1.png b/docs/img/1.2.0-1.png new file mode 100644 index 0000000..ff606cb Binary files /dev/null and b/docs/img/1.2.0-1.png differ diff --git a/docs/img/1.2.0-2.png b/docs/img/1.2.0-2.png new file mode 100644 index 0000000..74bbfec Binary files /dev/null and b/docs/img/1.2.0-2.png differ diff --git a/docs/img/1.2.0-3.png b/docs/img/1.2.0-3.png new file mode 100644 index 0000000..4da1582 Binary files /dev/null and b/docs/img/1.2.0-3.png differ diff --git a/docs/updates/1.2.0.md b/docs/updates/1.2.0.md new file mode 100644 index 0000000..5d7e2fa --- /dev/null +++ b/docs/updates/1.2.0.md @@ -0,0 +1,40 @@ +# web v1.2.0 + +## What's new? + +### Additions + +- Gitea account unlinking card to the 'Git' tab on the dashboard +- Visual "Logging out..." display to sidebar upon click +- "Create Account" button on Gitea link card +- Allow disabling of signup via an environment variable + +### Updates + +- Updated statistics page with latest costs +- Sidebar button now inside the footer for better layout and style +- More elements use `Loader2` instead of `Loader` (better look in my opinion) +- Improved Gitea link/unlink API logic + +### Improvements + +- Layout changes to sidebar and user control header +- Better padding and margins on page content +- Moved settings fetch to server action + - Significantly improved sidebar load times in testing +- Authentication and session checking logic +- Footer design and adaptability tweaks +- Removed card title from Git card on dashboard + +### Fixes + +- Fixed [#3 - Sidebar on dashboard not closing on desktop](https://git.pontusmail.org/librecloud/web/issues/3) +- Fixed [#4 - Stop throwing errors for valid responses on Git linking](https://git.pontusmail.org/librecloud/web/issues/4) + +## Screenshots + +![LibreCloud Dashboard (v1.2.0)](https://git.pontusmail.org/librecloud/web/raw/branch/main/docs/img/1.2.0-1.png) + +![LibreCloud Login (v1.2.0)](https://git.pontusmail.org/librecloud/web/raw/branch/main/docs/img/1.2.0-2.png) + +![LibreCloud's home page (v1.2.0)](https://git.pontusmail.org/librecloud/web/raw/branch/main/docs/img/1.2.0-2.png) \ No newline at end of file diff --git a/package.json b/package.json index d436a01..140f972 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "web", - "version": "0.1.0", + "version": "1.2.0", "private": true, "scripts": { "dev": "next dev --turbopack", @@ -33,7 +33,7 @@ "js-cookie": "^3.0.5", "lucide-react": "^0.474.0", "motion": "^12.6.3", - "next": "^15.2.4", + "next": "^15.2.5", "next-auth": "^5.0.0-beta.25", "next-themes": "^0.4.6", "next-turnstile": "^1.0.2",