PxlLoewe/var-monorepo
1
0
Fork 0
Code Issues 22 Pull Requests Actions Packages Projects Releases 2 Wiki Activity

added ntfy

Browse Source
This commit is contained in:
PxlLoewe
2025-05-19 23:11:33 -07:00
parent 61e7caf6c8
commit 060810f1b0
11 changed files with 277 additions and 76 deletions
Download Patch File Download Diff File Expand all files Collapse all files

68
apps/hub/app/(app)/settings/_components/forms.tsx
View File

@@ -5,8 +5,6 @@ import { useState } from "react";
import { useForm } from "react-hook-form";
import { z } from "zod";
import { unlinkDiscord, updateUser, changePassword } from "../actions";
import { Toaster, toast } from "react-hot-toast";
import { useSession } from "next-auth/react";
import { useRouter } from "next/navigation";
import { Button } from "../../../_components/ui/Button";
import {
@@ -21,6 +19,9 @@ import {
LockOpen2Icon,
LockOpen1Icon,
} from "@radix-ui/react-icons";
import toast from "react-hot-toast";
import { UserSchema } from "@repo/db/zod";
import { Bell, Plane } from "lucide-react";
export const ProfileForm = ({ user }: { user: User }) => {
const schema = z.object({
@@ -242,7 +243,7 @@ export const SocialForm = ({
);
};
export const PasswordForm = ({ user }: { user: User }) => {
export const PasswordForm = () => {
const schema = z.object({
password: z.string().min(2).max(30),
newPassword: z.string().min(2).max(30),
@@ -345,3 +346,64 @@ export const PasswordForm = ({ user }: { user: User }) => {
</form>
);
};
export const PilotForm = ({ user }: { user: User }) => {
const [isLoading, setIsLoading] = useState(false);
const form = useForm<User>({
defaultValues: user,
resolver: zodResolver(UserSchema),
});
if (!user) return null;
return (
<form
className="card-body"
onSubmit={form.handleSubmit(async (values) => {
form.handleSubmit(async () => {
setIsLoading(true);
});
await updateUser(values);
setIsLoading(false);
form.reset(values);
toast.success("Deine Änderungen wurden gespeichert!", {
style: {
background: "var(--color-base-100)",
color: "var(--color-base-content)",
},
});
})}
>
<h2 className="card-title mb-5">
<Plane className="w-5 h-5" /> Pilot
</h2>
<div className="content-center">
<label className="floating-label w-full mt-5">
<span className="text-lg flex items-center gap-2">
<Bell /> NTFY room
</span>
<input
placeholder="erhalte eine Benachrichtigung aufs Handy über NTFY"
className="input input-bordered w-full"
{...form.register("settingsNtfyRoom")}
/>
</label>
{form.formState.errors.settingsNtfyRoom && (
<p className="text-error">
{form.formState.errors.settingsNtfyRoom.message}
</p>
)}
</div>
<div className="card-actions justify-center pt-6 mt-auto">
<Button
className="btn-sm btn-wide btn-outline btn-primary"
isLoading={isLoading}
disabled={!form.formState.isDirty}
role="submit"
>
<BookmarkIcon /> Speichern
</Button>
</div>
</form>
);
};

76
apps/hub/app/(app)/settings/page.tsx
View File

@@ -1,38 +1,48 @@
import { getServerSession } from "../../api/auth/[...nextauth]/auth";
import { PrismaClient } from "@repo/db";
import { ProfileForm, SocialForm, PasswordForm } from "./_components/forms";
import {
ProfileForm,
SocialForm,
PasswordForm,
PilotForm,
} from "./_components/forms";
import { GearIcon } from "@radix-ui/react-icons";
export default async () => {
const prisma = new PrismaClient();
const session = await getServerSession();
if (!session) return null;
const user = await prisma.user.findFirst({
where: {
id: session.user.id,
},
include: {
discordAccounts: true,
},
});
if (!user) return null;
const discordAccount = user?.discordAccounts[0];
return (
<div className="grid grid-cols-6 gap-4">
<div className="col-span-full">
<p className="text-2xl font-semibold text-left flex items-center gap-2">
<GearIcon className="w-5 h-5" /> Einstellungen
</p>
</div>
<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
<ProfileForm user={user} />
</div>
<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
<SocialForm discordAccount={discordAccount} user={user} />
</div>
<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
<PasswordForm user={user} />
</div>
</div>
);
export const page = async () => {
const prisma = new PrismaClient();
const session = await getServerSession();
if (!session) return null;
const user = await prisma.user.findFirst({
where: {
id: session.user.id,
},
include: {
discordAccounts: true,
},
});
if (!user) return null;
const discordAccount = user?.discordAccounts[0];
return (
<div className="grid grid-cols-6 gap-4">
<div className="col-span-full">
<p className="text-2xl font-semibold text-left flex items-center gap-2">
<GearIcon className="w-5 h-5" /> Einstellungen
</p>
</div>
<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
<ProfileForm user={user} />
</div>
<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
<SocialForm discordAccount={discordAccount} user={user} />
</div>
<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
<PasswordForm />
</div>
<div className="card bg-base-200 shadow-xl mb-4 col-span-6 xl:col-span-3">
<PilotForm user={user} />
</div>
</div>
);
};
export default page;