warning fixes

Frontend/src/app/(pages)/page.tsx

@@ -1,6 +1,7 @@
 import FeaturedContent from "@/components/landing/featured-content";
 import Hero from "@/components/landing/hero";
 import StatisticCounters from "@/components/landing/statistic-counters";
+import { ReactElement } from "react";
 
 /**
  * The landing page.

Frontend/src/app/(pages)/player/[[...slug]]/page.tsx

@@ -114,7 +114,7 @@ export const generateMetadata = async ({
 const trimQuery = (query: string | undefined): string | undefined => {
     // Limit the query to 36 chars
     if (query && query.length > 36) {
-        query = query.substr(0, 36);
+        query = query.substring(0, 36);
     }
     return query;
 };

Frontend/src/app/components/embed.tsx

@@ -1,5 +1,8 @@
 import { Metadata } from "next";
 
+/**
+ * Props for an embed.
+ */
 type EmbedProps = {
     /**
      * The title of the embed.

Frontend/src/app/components/github-star-button.tsx

@@ -2,8 +2,14 @@ import MinecraftButton from "@/components/minecraft-button";
 import { Skeleton } from "@/components/ui/skeleton";
 import { StarIcon } from "@heroicons/react/24/outline";
 import Link from "next/link";
-import { Suspense } from "react";
+import { ReactElement, Suspense } from "react";
 
+/**
+ * The button to display the amount
+ * of stars the GitHub repository has.
+ *
+ * @returns the component jsx
+ */
 const GitHubStarButton = async (): Promise<ReactElement> => {
     return (
         <Link
@@ -35,7 +41,7 @@ const GitHubStarButton = async (): Promise<ReactElement> => {
  *
  * @returns the star count jsx
  */
-const GitHubStarCount = async (): Promise<JSX.Element> => {
+const GitHubStarCount = async (): Promise<ReactElement> => {
     const stars: number = await getStarCount(); // Get the repo star count
     return (
         <code className="px-1 rounded-md bg-minecraft-green-3/80">{stars}</code>

Frontend/src/app/components/minecraft-button.tsx

@@ -1,5 +1,6 @@
 import { Button } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
+import { ButtonHTMLAttributes, ReactElement, ReactNode } from "react";
 
 /**
  * Props for this button.
@@ -13,7 +14,7 @@ type MinecraftButtonProps = {
     /**
      * The children of this button.
      */
-	children: React.ReactNode;
+    children: ReactNode;
 };
 
 /**
@@ -25,8 +26,8 @@ const MinecraftButton = ({
     className,
     children,
     ...props
-}: React.ButtonHTMLAttributes<HTMLButtonElement> &
+}: ButtonHTMLAttributes<HTMLButtonElement> &
-	MinecraftButtonProps): JSX.Element => (
+    MinecraftButtonProps): ReactElement => (
     <Button
         className={cn(
             "before:absolute before:-inset-x-5 before:rotate-90 before:w-9 before:h-1 before:bg-minecraft-green-1", // Left Green Bar

Frontend/src/app/components/player/player-search.tsx

@@ -3,6 +3,7 @@ import { Input } from "@/components/ui/input";
 
 import { Label } from "@/components/ui/label";
 import { redirect } from "next/navigation";
+import { ReactElement } from "react";
 
 /**
  * A component for searching for a player.
@@ -15,7 +16,7 @@ const PlayerSearch = ({
 }: {
     query: string | undefined;
 }): ReactElement => {
-    const handleRedirect = async (form: FormData) => {
+    const handleRedirect = async (form: FormData): Promise<void> => {
         "use server";
         redirect(`/player/${form.get("query")}`);
     };

Frontend/src/app/config.ts

@@ -1,7 +1,5 @@
-import { Config } from "@/types/config";
-
 /**
  * The configuration for this app.
  */
-const config: Config = require("@/configJson");
+import config from "@/configJson";
 export default config;

Frontend/src/app/layout.tsx

@@ -8,7 +8,7 @@ import ThemeProvider from "@/provider/theme-provider";
 import type { Metadata, Viewport } from "next";
 import PlausibleProvider from "next-plausible";
 import "./globals.css";
-import { ReactElement } from "react";
+import { ReactElement, ReactNode } from "react";
 
 /**
  * Site metadata & viewport.
@@ -25,7 +25,7 @@ export const viewport: Viewport = config.viewport;
 const RootLayout = ({
     children,
 }: Readonly<{
-    children: React.ReactNode;
+    children: ReactNode;
 }>): ReactElement => {
     const analyticsDomain: string | undefined = config.analyticsDomain;
     return (

Frontend/src/app/lib/utils.ts

@@ -1,6 +1,6 @@
 import { clsx, type ClassValue } from "clsx";
 import { twMerge } from "tailwind-merge";
 
-export function cn(...inputs: ClassValue[]) {
+export function cn(...inputs: ClassValue[]): string {
     return twMerge(clsx(inputs));
 }