Changes

2024-04-17 19:04:15 -04:00 · 2024-04-17 19:04:15 -04:00 · b560341068
commit b560341068
parent 6a9ec1fe9f
16 changed files with 451 additions and 415 deletions
--- a/Frontend/.gitignore
+++ b/Frontend/.gitignore
@ -1,5 +1,6 @@
 node_modules
 .next/
+.fleet/
 .vscode/
 .env*.local
 next-env.d.ts
--- a/Frontend/.prettierrc
+++ b/Frontend/.prettierrc
@ -0,0 +1,4 @@
+{
+    "trailingComma": "es5",
+    "tabWidth": 4
+}
--- a/Frontend/src/app/(pages)/docs/page.tsx
+++ b/Frontend/src/app/(pages)/docs/page.tsx
@ -3,6 +3,7 @@ import { minecrafter } from "@/font/fonts";
 import { cn } from "@/lib/utils";
 import { Metadata } from "next";
 import Link from "next/link";
+import { ReactElement } from "react";

 /**
 * Page metadata.
@ -16,7 +17,7 @@ export const metadata: Metadata = {
 *
 * @returns the page jsx
 */
-const DocsPage = (): JSX.Element => (
+const DocsPage = (): ReactElement => (
    <main className="h-[64vh] flex flex-col gap-3 justify-center items-center">
        {/* Creeper */}
        <div className="absolute left-28 bottom-16 pointer-events-none">
--- a/Frontend/src/app/(pages)/page.tsx
+++ b/Frontend/src/app/(pages)/page.tsx
@ -7,7 +7,7 @@ import StatisticCounters from "@/components/landing/statistic-counters";
 *
 * @returns the page jsx
 */
-const LandingPage = (): JSX.Element => (
+const LandingPage = (): ReactElement => (
    <main className="px-3">
        <Hero />
        <FeaturedContent />
--- a/Frontend/src/app/(pages)/player/[[...slug]]/page.tsx
+++ b/Frontend/src/app/(pages)/player/[[...slug]]/page.tsx
@ -7,13 +7,14 @@ import { PageProps } from "@/types/page";
 import { Metadata } from "next";
 import Image from "next/image";
 import { CachedPlayer, getPlayer, type RestfulMCAPIError } from "restfulmc-lib";
+import { ReactElement } from "react";

 /**
 * The page to lookup a player.
 *
 * @returns the page jsx
 */
-const PlayerPage = async ({ params }: PageProps): Promise<JSX.Element> => {
+const PlayerPage = async ({ params }: PageProps): Promise<ReactElement> => {
    let error: string | undefined = undefined; // The error to display
    let result: CachedPlayer | undefined = undefined; // The player to display
    const query: string | undefined = trimQuery(params.slug?.[0]); // The query to search for
--- a/Frontend/src/app/components/counter.tsx
+++ b/Frontend/src/app/components/counter.tsx
@ -3,6 +3,7 @@
 import { minecrafter } from "@/font/fonts";
 import { cn } from "@/lib/utils";
 import CountUp from "react-countup";
+import { ReactElement } from "react";

 /**
 * Props for the counter.
@ -34,10 +35,13 @@ type CounterProps = {
 * @param duration the optional duration of the count up
 * @returns the counter jsx
 */
-const Counter = ({ name, amount, duration }: CounterProps): JSX.Element => (
+const Counter = ({ name, amount, duration }: CounterProps): ReactElement => (
    <div className="flex flex-col items-center gap-4">
        <h1
-			className={cn("text-6xl text-minecraft-green-3", minecrafter.className)}
+            className={cn(
+                "text-6xl text-minecraft-green-3",
+                minecrafter.className
+            )}
        >
            {name}
        </h1>
--- a/Frontend/src/app/components/creeper.tsx
+++ b/Frontend/src/app/components/creeper.tsx
@ -1,11 +1,12 @@
 import Image from "next/image";
+import { ReactElement } from "react";

 /**
 * A creeper image.
 *
 * @returns the creeper jsx
 */
-const Creeper = (): JSX.Element => (
+const Creeper = (): ReactElement => (
    <Image
        src="/media/creeper.png"
        alt="A Minecraft Creeper"
--- a/Frontend/src/app/components/footer.tsx
+++ b/Frontend/src/app/components/footer.tsx
@ -1,2 +1,4 @@
-const Footer = (): JSX.Element => <footer>FOOTER</footer>;
+import { ReactElement } from "react";
+
+const Footer = (): ReactElement => <footer>FOOTER</footer>;
 export default Footer;
--- a/Frontend/src/app/components/github-star-button.tsx
+++ b/Frontend/src/app/components/github-star-button.tsx
@ -4,7 +4,7 @@ import { StarIcon } from "@heroicons/react/24/outline";
 import Link from "next/link";
 import { Suspense } from "react";

-const GitHubStarButton = async (): Promise<JSX.Element> => {
+const GitHubStarButton = async (): Promise<ReactElement> => {
    return (
        <Link
            href="https://github.com/Rainnny7/RESTfulMC"
@ -13,7 +13,9 @@ const GitHubStarButton = async (): Promise<JSX.Element> => {
        >
            <MinecraftButton className="flex gap-1.5 items-center group/star">
                {/* Star Count */}
-				<Suspense fallback={<Skeleton className="w-4 h-5 rounded-md" />}>
+                <Suspense
+                    fallback={<Skeleton className="w-4 h-5 rounded-md" />}
+                >
                    <GitHubStarCount />
                </Suspense>

--- a/Frontend/src/app/components/landing/featured-content.tsx
+++ b/Frontend/src/app/components/landing/featured-content.tsx
@ -3,18 +3,21 @@ import { minecrafter } from "@/font/fonts";
 import { cn } from "@/lib/utils";
 import { FeaturedItemProps } from "@/types/config";
 import Link from "next/link";
+import { ReactElement } from "react";

 /**
 * The featured content component.
 *
 * @returns the featured content jsx
 */
-const FeaturedContent = (): JSX.Element => (
+const FeaturedContent = (): ReactElement => (
    <div className="flex justify-center items-center">
        <div className="max-w-2xl flex flex-wrap justify-center gap-5">
-			{config.featuredItems.map((item, index) => (
+            {config.featuredItems.map(
+                (item: FeaturedItemProps, index: number) => (
                    <FeaturedItem key={index} {...item} />
-			))}
+                )
+            )}
        </div>
    </div>
 );
@ -30,7 +33,7 @@ const FeaturedItem = ({
    description,
    image,
    href,
-}: FeaturedItemProps): JSX.Element => (
+}: FeaturedItemProps): ReactElement => (
    <Link
        className="pt-28 w-[19rem] h-80 flex flex-col gap-1 items-center bg-center bg-cover bg-no-repeat rounded-3xl text-center backdrop-blur-md hover:scale-[1.01] transition-all transform-gpu"
        href={href}
@ -39,7 +42,10 @@ const FeaturedItem = ({
        }}
    >
        <h1
-			className={cn("text-3xl font-semibold text-white", minecrafter.className)}
+            className={cn(
+                "text-3xl font-semibold text-white",
+                minecrafter.className
+            )}
        >
            {name}
        </h1>
--- a/Frontend/src/app/components/landing/hero.tsx
+++ b/Frontend/src/app/components/landing/hero.tsx
@ -4,13 +4,14 @@ import config from "@/config";
 import { minecrafter } from "@/font/fonts";
 import { cn } from "@/lib/utils";
 import Link from "next/link";
+import { ReactElement } from "react";

 /**
 * The hero content.
 *
 * @returns the hero jsx
 */
-const Hero = (): JSX.Element => (
+const Hero = (): ReactElement => (
    <div className="pt-56 pb-40 flex flex-col gap-8 justify-center items-center">
        <div className="flex flex-col gap-4 items-center text-center">
            {/* Title */}
@ -30,7 +31,9 @@ const Hero = (): JSX.Element => (
        {/* Links */}
        <div className="flex gap-5 xs:gap-10">
            <Link href="/docs">
-				<MinecraftButton className="w-44 h-12">Get Started</MinecraftButton>
+                <MinecraftButton className="w-44 h-12">
+                    Get Started
+                </MinecraftButton>
            </Link>

            {/* Star on Github <3 */}
--- a/Frontend/src/app/components/landing/statistic-counters.tsx
+++ b/Frontend/src/app/components/landing/statistic-counters.tsx
@ -1,11 +1,12 @@
 import Counter from "@/components/counter";
+import { ReactElement } from "react";

 /**
 * The statistic counters component.
 *
 * @returns the counters jsx
 */
-const StatisticCounters = (): JSX.Element => (
+const StatisticCounters = (): ReactElement => (
    <div className="py-56 flex justify-center items-center">
        <div className="grid grid-flow-row grid-cols-1 sm:grid-cols-2 lg:grid-cols-3 2xl:grid-cols-4 gap-24">
            <Counter name="Testing" amount={1_000_000} />
--- a/Frontend/src/app/components/navbar.tsx
+++ b/Frontend/src/app/components/navbar.tsx
@ -7,13 +7,14 @@ import { cn } from "@/lib/utils";
 import Image from "next/image";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import { ReactElement } from "react";

 /**
 * The navbar for the site.
 *
 * @returns the navbar jsx
 */
-const Navbar = (): JSX.Element => {
+const Navbar = (): ReactElement => {
    const path: string = usePathname(); // Get the current path
    return (
        <nav className="fixed inset-x-0 flex h-16 sm:px-12 justify-center sm:justify-between items-center bg-navbar-background z-50">
@ -42,7 +43,8 @@ const Navbar = (): JSX.Element => {

                {/* Links */}
                <div className="flex gap-7">
-					{Object.entries(config.navbarLinks).map((link, index) => {
+                    {Object.entries(config.navbarLinks).map(
+                        (link: [string, string], index: number) => {
                            const url: string = link[1]; // The href of the link
                            let active: boolean = path.startsWith(url); // Is this the active link?
                            return (
@ -57,7 +59,8 @@ const Navbar = (): JSX.Element => {
                                    {link[0]}
                                </Link>
                            );
-					})}
+                        }
+                    )}
                </div>
            </div>

--- a/Frontend/src/app/components/player/player-result.tsx
+++ b/Frontend/src/app/components/player/player-result.tsx
@ -2,6 +2,7 @@
 import Image from "next/image";
 import Link from "next/link";
 import { CachedPlayer, SkinPart } from "restfulmc-lib";
+import { ReactElement } from "react";

 /**
 * The result of a player search.
@ -18,7 +19,7 @@ const PlayerResult = ({
    },
 }: {
    player: CachedPlayer;
-}): JSX.Element => (
+}): ReactElement => (
    <div className="px-2 py-3 flex flex-col gap-3 items-center bg-muted rounded-xl divide-y divide-zinc-700">
        {/* Details */}
        <div className="flex gap-5 items-center">
@ -33,11 +34,17 @@ const PlayerResult = ({

            {/* Name, Unique ID, and Badges */}
            <div className="flex flex-col gap-1.5">
-				<h1 className="text-xl font-bold text-minecraft-green-3">{username}</h1>
-				<code className="text-xs xs:text-sm text-zinc-300">{uniqueId}</code>
+                <h1 className="text-xl font-bold text-minecraft-green-3">
+                    {username}
+                </h1>
+                <code className="text-xs xs:text-sm text-zinc-300">
+                    {uniqueId}
+                </code>

                {/* Legacy Badge */}
-				{legacy && <p className="text-sm font-semibold uppercase">Legacy</p>}
+                {legacy && (
+                    <p className="text-sm font-semibold uppercase">Legacy</p>
+                )}
            </div>
        </div>

--- a/Frontend/src/app/components/player/player-search.tsx
+++ b/Frontend/src/app/components/player/player-search.tsx
@ -14,7 +14,7 @@ const PlayerSearch = ({
    query,
 }: {
    query: string | undefined;
-}): JSX.Element => {
+}): ReactElement => {
    const handleRedirect = async (form: FormData) => {
        "use server";
        redirect(`/player/${form.get("query")}`);