From dd9104f2f3f56254e2e5d552b0fd53cf23b454ab Mon Sep 17 00:00:00 2001 From: dvelo <52332868+DeveloLongScript@users.noreply.github.com> Date: Sun, 6 Oct 2024 09:34:56 -0500 Subject: [PATCH] feat: swap text field for monaco editor --- biome.json | 3 + src/components/ServerCustomize.tsx | 928 +++++++++++++++-------------- yarn.lock | 2 +- 3 files changed, 470 insertions(+), 463 deletions(-) diff --git a/biome.json b/biome.json index 0f1f370..4766c1b 100644 --- a/biome.json +++ b/biome.json @@ -8,6 +8,9 @@ "suspicious": { "noExplicitAny": "off", "noDoubleEquals": "warn" + }, + "complexity": { + "noForEach": "off" } } } diff --git a/src/components/ServerCustomize.tsx b/src/components/ServerCustomize.tsx index e959a5c..cabc43c 100644 --- a/src/components/ServerCustomize.tsx +++ b/src/components/ServerCustomize.tsx @@ -29,489 +29,493 @@ */ "use client"; -import { Button } from "./ui/button"; -import { Textarea } from "./ui/textarea"; -import { CheckIcon, X } from "lucide-react"; -import { Dispatch, SetStateAction, useEffect, useState } from "react"; import { - getCustomization, - ownServer, - reportServer, - setCustomization, - serverOwned as sOFunc, - unownServer, - userOwnedServer, + getCustomization, + ownServer, + reportServer, + serverOwned as sOFunc, + setCustomization, + unownServer, + userOwnedServer, } from "@/lib/api"; -import toast from "react-hot-toast"; -import { SignedIn, SignedOut, useUser } from "@clerk/nextjs"; import { OnlineServer } from "@/lib/types/mh-server"; -import Link from "next/link"; -import Setting from "./ui/setting"; -import { - FormControl, - FormDescription, - FormField, - FormItem, - FormLabel, - FormMessage, - Form, -} from "./ui/form"; -import { z } from "zod"; -import { useForm } from "react-hook-form"; +import { SignedIn, SignedOut, useUser } from "@clerk/nextjs"; import { zodResolver } from "@hookform/resolvers/zod"; +import { CheckIcon, X } from "lucide-react"; +import Link from "next/link"; +import { Dispatch, SetStateAction, useEffect, useState } from "react"; +import { useForm } from "react-hook-form"; +import toast from "react-hot-toast"; +import { z } from "zod"; +import { Button } from "./ui/button"; +import { + Form, + FormControl, + FormDescription, + FormField, + FormItem, + FormLabel, + FormMessage, +} from "./ui/form"; +import Setting from "./ui/setting"; +import { Textarea } from "./ui/textarea"; import "@/themes.css"; -import { - Card, - CardContent, - CardDescription, - CardFooter, - CardHeader, - CardTitle, -} from "./ui/card"; -import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover"; import { themes } from "@/lib/themes"; +import Editor from "@monaco-editor/react"; import { useTheme } from "next-themes"; -import { DiscordPopover } from "./misc/DiscordPopover"; -import { Spinner } from "./ui/spinner"; import { BannerPopover } from "./misc/BannerPopover"; +import { DiscordPopover } from "./misc/DiscordPopover"; import { - Dialog, - DialogContent, - DialogDescription, - DialogHeader, - DialogTitle, - DialogTrigger, + Card, + CardContent, + CardDescription, + CardFooter, + CardHeader, + CardTitle, +} from "./ui/card"; +import { + Dialog, + DialogContent, + DialogDescription, + DialogHeader, + DialogTitle, + DialogTrigger, } from "./ui/dialog"; +import { Popover, PopoverContent, PopoverTrigger } from "./ui/popover"; +import { Spinner } from "./ui/spinner"; const formSchema = z.object({ - description: z - .string() - .min(2, { - message: "Description must be at least 2 characters.", - }) - .max(1250, { - message: "Description cannot be longer than 1250 characters.", - }), + description: z + .string() + .min(2, { + message: "Description must be at least 2 characters.", + }) + .max(1250, { + message: "Description cannot be longer than 1250 characters.", + }), }); export default function ServerCustomize({ - server, - cs, - setCS, + server, + cs, + setCS, }: { - server: string; - cs: string; - setCS: Dispatch>; + server: string; + cs: string; + setCS: Dispatch>; }) { - const [serverOwned, setServerOwned] = useState(false); - const [userOwned, setUserOwned] = useState(false); - const [loading, setLoading] = useState(true); - const [reason, setReason] = useState(""); - const [description, setDescription] = useState(""); - const [get, setGet] = useState({}); - const [author, setAuthor] = useState(""); - const [minehutOwned, setMinehutOwned] = useState(false); - const { resolvedTheme: mode } = useTheme(); - const { user, isSignedIn } = useUser(); - useEffect(() => { - sOFunc(server).then((c) => { - setServerOwned(c); - getCustomization(server).then((b) => { - setGet(b); - setDescription(b != null ? b.description : ""); - form.reset({ description: b != null ? b.description : "" }); - setCS(b != null ? b.colorScheme : "zinc"); - userOwnedServer(server).then((c) => { - setUserOwned(c); - fetch("https://api.minehut.com/servers").then((c) => { - c.json().then((c: { servers: Array }) => { - c.servers.forEach((v) => { - setAuthor(v.author); - if (v.name == server && isSignedIn) { - if (user?.publicMetadata.player === v.author) { - setMinehutOwned(true); - } - } - setLoading(false); - }); - }); - }); - }); - }); - }); - }, [isSignedIn]); - const form = useForm>({ - resolver: zodResolver(formSchema), - defaultValues: { - description, - }, - }); - if (loading) { - return ( - <> - -
- - ); - } + const [serverOwned, setServerOwned] = useState(false); + const [userOwned, setUserOwned] = useState(false); + const [loading, setLoading] = useState(true); + const [reason, setReason] = useState(""); + const [description, setDescription] = useState(""); + const [get, setGet] = useState({}); + const [author, setAuthor] = useState(""); + const [minehutOwned, setMinehutOwned] = useState(false); + const { resolvedTheme: mode } = useTheme(); + const { user, isSignedIn } = useUser(); + useEffect(() => { + sOFunc(server).then((c) => { + setServerOwned(c); + getCustomization(server).then((b) => { + setGet(b); + setDescription(b != null ? b.description : ""); + form.reset({ description: b != null ? b.description : "" }); + setCS(b != null ? b.colorScheme : "zinc"); + userOwnedServer(server).then((c) => { + setUserOwned(c); + fetch("https://api.minehut.com/servers").then((c) => { + c.json().then((c: { servers: Array }) => { + c.servers.forEach((v) => { + setAuthor(v.author); + if (v.name == server && isSignedIn) { + if (user?.publicMetadata.player === v.author) { + setMinehutOwned(true); + } + } + setLoading(false); + }); + }); + }); + }); + }); + }); + }, [isSignedIn]); + const form = useForm>({ + resolver: zodResolver(formSchema), + defaultValues: { + description, + }, + }); + if (loading) { + return ( + <> + +
+ + ); + } - return ( - <> - - {!serverOwned && ( -
-
Do you own this server?
- Create an account and link it to the owner of the server to - customize it. -
- )} - - - {!serverOwned && user?.publicMetadata.player == null && ( -
-
Do you own this server?
- Create an account and link it to the owner of the server to - customize it. -
- )} - {serverOwned && !userOwned && ( -
-
- Is this server in violation of the ECA? -
- Is this server in violation of the{" "} - - External Content Agreement (aka ECA) - - ? You can report the server to remove the customizations from the - server. - - - - - - - Report Server - - This will send a notification to MHSF maintainers. This - server must be in violation of the{" "} - - ECA - {" "} - to be a valid report. Typical response times include 1 hour - to 1 day, and you will not be notified if your report is - successful or not.{" "} - - Please do not spam this form with mindless reports. If you - do, your account will be banned. We are not Minehut - support, we cannot help you with a problem within the - Minehut platform or within the server, we can only - moderate the customization of the server. - {" "} - (if the problem is within the server,{" "} - - report it on Minehut - - )
-
- Reason: - - -