MinecraftUtilities/Frontend
2
1
Fork 0
Code Issues 1 Pull Requests 2 Actions Activity

fix return types
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m25s
Details

Browse Source
This commit is contained in:
Lee 2024-04-18 03:51:41 +01:00
parent 3c9709df12
commit ac1d9b4f82
20 changed files with 41 additions and 91 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
package.json
View File

@ -9,6 +9,7 @@
"lint": "next lint"
},
"dependencies": {
"@heroicons/react": "^2.1.3",
"@radix-ui/react-context-menu": "^2.1.5",
"@radix-ui/react-separator": "^1.0.3",
"@radix-ui/react-slot": "^1.0.2",

11
pnpm-lock.yaml
View File

@ -5,6 +5,9 @@ settings:
excludeLinksFromLockfile: false
dependencies:
'@heroicons/react':
specifier: ^2.1.3
version: 2.1.3(react@18.2.0)
'@radix-ui/react-context-menu':
specifier: ^2.1.5
version: 2.1.5(@types/react-dom@18.2.25)(@types/react@18.2.78)(react-dom@18.2.0)(react@18.2.0)
@ -519,6 +522,14 @@ packages:
resolution: {integrity: sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q==}
dev: false
/@heroicons/react@2.1.3(react@18.2.0):
resolution: {integrity: sha512-fEcPfo4oN345SoqdlCDdSa4ivjaKbk0jTd+oubcgNxnNgAfzysfwWfQUr+51wigiWHQQRiZNd1Ao0M5Y3M2EGg==}
peerDependencies:
react: '>= 16'
dependencies:
react: 18.2.0
dev: false
/@humanwhocodes/config-array@0.11.14:
resolution: {integrity: sha512-3T8LkOmg45BV5FICb15QQMsyUSWrQ8AygVfC7ZG32zOalnqrilm018ZVCw0eapXux8FtA33q8PSRSstjee3jSg==}
engines: {node: '>=10.10.0'}

3
src/app/components/card.tsx
View File

@ -1,4 +1,5 @@
import { cn } from "@/common/utils";
import { ReactElement } from "react";
export function Card({
children,
@ -6,6 +7,6 @@ export function Card({
}: Readonly<{
children: React.ReactNode;
className?: string;
}>): JSX.Element {
}>): ReactElement {
return <div className={cn("bg-secondary rounded-lg p-3", className)}>{children}</div>;
}

3
src/app/components/container.tsx
View File

@ -1,10 +1,11 @@
import { ReactElement } from "react";
import NavBar from "./navbar";
export default function Container({
children,
}: Readonly<{
children: React.ReactNode;
}>): JSX.Element {
}>): ReactElement {
return (
<div className="z-[9999] m-auto flex h-screen min-h-full flex-col items-center opacity-90 w-full xs:max-w-[1200px]">
<NavBar />

3
src/app/components/error-card.tsx
View File

@ -1,10 +1,11 @@
import { ReactElement } from "react";
import { Card } from "./card";
type ErrorProps = {
message: string;
};
export function ErrorCard({ message }: ErrorProps): JSX.Element {
export function ErrorCard({ message }: ErrorProps): ReactElement {
return (
<Card>
<div className="flex flex-col justify-center text-center">

11
src/app/components/icon/icon-props.ts
View File

@ -1,11 +0,0 @@
export type IconProps = {
/**
* The size of the icon
*/
size?: number;
/**
* The color of the icon
*/
color?: string;
};

12
src/app/components/icon/moon-icon.tsx
View File

@ -1,12 +0,0 @@
import { IconProps } from "./icon-props";
export function MoonIcon({ size = 24, color = "#fff" }: IconProps): JSX.Element {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} fill={color} viewBox="0 -960 960 960">
<path
xmlns="http://www.w3.org/2000/svg"
d="M480-120q-150 0-255-105T120-480q0-150 105-255t255-105q8 0 17 .5t23 1.5q-36 32-56 79t-20 99q0 90 63 153t153 63q52 0 99-18.5t79-51.5q1 12 1.5 19.5t.5 14.5q0 150-105 255T480-120Zm0-60q109 0 190-67.5T771-406q-25 11-53.667 16.5Q688.667-384 660-384q-114.689 0-195.345-80.655Q384-545.311 384-660q0-24 5-51.5t18-62.5q-98 27-162.5 109.5T180-480q0 125 87.5 212.5T480-180Zm-4-297Z"
/>
</svg>
);
}

12
src/app/components/icon/person-icon.tsx
View File

@ -1,12 +0,0 @@
import { IconProps } from "./icon-props";
export function PersonIcon({ size = 24, color = "#fff" }: IconProps): JSX.Element {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} fill={color} viewBox="0 -960 960 960">
<path
xmlns="http://www.w3.org/2000/svg"
d="M626-533q22.5 0 38.25-15.75T680-587q0-22.5-15.75-38.25T626-641q-22.5 0-38.25 15.75T572-587q0 22.5 15.75 38.25T626-533Zm-292 0q22.5 0 38.25-15.75T388-587q0-22.5-15.75-38.25T334-641q-22.5 0-38.25 15.75T280-587q0 22.5 15.75 38.25T334-533Zm146 272q66 0 121.5-35.5T682-393h-52q-23 40-63 61.5T480.5-310q-46.5 0-87-21T331-393h-53q26 61 81 96.5T480-261Zm0 181q-83 0-156-31.5T197-197q-54-54-85.5-127T80-480q0-83 31.5-156T197-763q54-54 127-85.5T480-880q83 0 156 31.5T763-763q54 54 85.5 127T880-480q0 83-31.5 156T763-197q-54 54-127 85.5T480-80Zm0-400Zm0 340q142.375 0 241.188-98.812Q820-337.625 820-480t-98.812-241.188Q622.375-820 480-820t-241.188 98.812Q140-622.375 140-480t98.812 241.188Q337.625-140 480-140Z"
/>
</svg>
);
}

12
src/app/components/icon/storage-icon.tsx
View File

@ -1,12 +0,0 @@
import { IconProps } from "./icon-props";
export function StorageIcon({ size = 24, color = "#fff" }: IconProps): JSX.Element {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} fill={color} viewBox="0 -960 960 960">
<path
xmlns="http://www.w3.org/2000/svg"
d="M120-160v-148h720v148H120Zm60-38h72v-72h-72v72Zm-60-454v-148h720v148H120Zm60-38h72v-72h-72v72Zm-60 284v-148h720v148H120Zm60-38h72v-72h-72v72Z"
/>
</svg>
);
}

9
src/app/components/icon/sun-icon.tsx
View File

@ -1,9 +0,0 @@
import { IconProps } from "./icon-props";
export function SunIcon({ size = 24, color = "#fff" }: IconProps): JSX.Element {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} fill={color} viewBox="0 -960 960 960">
<path d="M480-360q50 0 85-35t35-85q0-50-35-85t-85-35q-50 0-85 35t-35 85q0 50 35 85t85 35Zm0 80q-83 0-141.5-58.5T280-480q0-83 58.5-141.5T480-680q83 0 141.5 58.5T680-480q0 83-58.5 141.5T480-280ZM200-440H40v-80h160v80Zm720 0H760v-80h160v80ZM440-760v-160h80v160h-80Zm0 720v-160h80v160h-80ZM256-650l-101-97 57-59 96 100-52 56Zm492 496-97-101 53-55 101 97-57 59Zm-98-550 97-101 59 57-100 96-56-52ZM154-212l101-97 55 53-97 101-59-57Zm326-268Z" />
</svg>
);
}

12
src/app/components/icon/trending-up-icon.tsx
View File

@ -1,12 +0,0 @@
import { IconProps } from "./icon-props";
export function TrendingUpIcon({ size = 24, color = "#fff" }: IconProps): JSX.Element {
return (
<svg xmlns="http://www.w3.org/2000/svg" width={size} height={size} fill={color} viewBox="0 -960 960 960">
<path
xmlns="http://www.w3.org/2000/svg"
d="m123-240-43-43 292-291 167 167 241-241H653v-60h227v227h-59v-123L538-321 371-488 123-240Z"
/>
</svg>
);
}

3
src/app/components/logo.tsx
View File

@ -1,6 +1,7 @@
import Image from "next/image";
import { ReactElement } from "react";
export default function Logo({ size = 30 }: Readonly<{ size?: number }>): JSX.Element {
export default function Logo({ size = 30 }: Readonly<{ size?: number }>): ReactElement {
return (
<Image
src="https://git.fascinated.cc/MinecraftUtilities/Assets/raw/branch/master/logo.png"

3
src/app/components/navbar.tsx
View File

@ -1,4 +1,5 @@
import Link from "next/link";
import { ReactElement } from "react";
import Logo from "./logo";
import { RedirectButton } from "./rediect-button";
import { ToggleThemeButton } from "./theme-toggle-button";
@ -16,7 +17,7 @@ const pages: Page[] = [
{ title: "API", url: "https://api.mcutils.xyz", openInNewTab: true },
];
export default function NavBar(): JSX.Element {
export default function NavBar(): ReactElement {
return (
<div className="bg-secondary w-full rounded-lg flex items-center gap-3 mt-2 bg-opacity-85 h-12">
<Link href="/" className="flex items-center gap-2 pl-3 pr-1">

4
src/app/components/player/lookup-player.tsx
View File

@ -3,12 +3,12 @@
import { useToast } from "@/common/use-toast";
import { getPlayer } from "mcutils-library";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { ReactElement, useState } from "react";
import { Button } from "../ui/button";
import { Input } from "../ui/input";
import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip";
export function LookupPlayer(): JSX.Element {
export function LookupPlayer(): ReactElement {
const router = useRouter();
const { toast } = useToast();
const [id, setId] = useState("");

3
src/app/components/rediect-button.tsx
View File

@ -1,4 +1,5 @@
import Link from "next/link";
import { ReactElement } from "react";
type ButtonProps = {
title: string;
@ -6,7 +7,7 @@ type ButtonProps = {
openInNewTab?: boolean;
};
export function RedirectButton({ title, url, openInNewTab }: ButtonProps): JSX.Element {
export function RedirectButton({ title, url, openInNewTab }: ButtonProps): ReactElement {
return (
<div className="w-fit rounded-lg">
<Link href={url} target={openInNewTab ? "_blank" : ""}>

6
src/app/components/server/lookup-server.tsx
View File

@ -4,12 +4,12 @@ import { capitalizeFirstLetter } from "@/common/string-utils";
import { useToast } from "@/common/use-toast";
import { ServerPlatform, getServer } from "mcutils-library";
import { useRouter } from "next/navigation";
import { useState } from "react";
import { ReactElement, useState } from "react";
import { Button } from "../ui/button";
import { Input } from "../ui/input";
import { Tooltip, TooltipContent, TooltipTrigger } from "../ui/tooltip";
export function LookupServer(): JSX.Element {
export function LookupServer(): ReactElement {
const router = useRouter();
const { toast } = useToast();
const [hostname, setHostname] = useState("");
@ -48,7 +48,7 @@ export function LookupServer(): JSX.Element {
router.push(`/server/${platform}/${hostname}`);
};
const LookupButton = ({ platform }: { platform: ServerPlatform }): JSX.Element => {
const LookupButton = ({ platform }: { platform: ServerPlatform }): ReactElement => {
const name = capitalizeFirstLetter(platform);
return (
<Tooltip>

10
src/app/components/stats.tsx
View File

@ -1,11 +1,9 @@
"use client";
import { StorageIcon } from "@/app/components/icon/storage-icon";
import { Stat } from "@/app/components/stat";
import { ArrowTrendingUpIcon, ServerIcon, UserIcon } from "@heroicons/react/16/solid";
import { ReactElement } from "react";
import useWebSocket from "react-use-websocket";
import { PersonIcon } from "./icon/person-icon";
import { TrendingUpIcon } from "./icon/trending-up-icon";
import { Tooltip, TooltipContent, TooltipTrigger } from "./ui/tooltip";
type Stat = {
@ -20,19 +18,19 @@ const stats: Stat[] = [
id: "totalRequests",
displayName: "Total Requests",
tooltip: "The total amount of requests to the API",
icon: <TrendingUpIcon />,
icon: <ArrowTrendingUpIcon width={24} height={24} />,
},
{
id: "totalPlayerLookups",
displayName: "Player Lookups",
tooltip: "The total amount of player lookups",
icon: <PersonIcon />,
icon: <UserIcon width={24} height={24} />,
},
{
id: "totalServerLookups",
displayName: "Server Lookups",
tooltip: "The total amount of server lookups",
icon: <StorageIcon />,
icon: <ServerIcon width={24} height={24} />,
},
];

3
src/app/components/theme-provider.tsx
View File

@ -2,7 +2,8 @@
import { ThemeProvider as NextThemesProvider } from "next-themes";
import { type ThemeProviderProps } from "next-themes/dist/types";
import { ReactElement } from "react";
export default function ThemeProvider({ children, ...props }: ThemeProviderProps): JSX.Element {
export default function ThemeProvider({ children, ...props }: ThemeProviderProps): ReactElement {
return <NextThemesProvider {...props}>{children}</NextThemesProvider>;
}

8
src/app/components/theme-toggle-button.tsx
View File

@ -1,10 +1,10 @@
"use client";
import { MoonIcon, SunIcon } from "@heroicons/react/16/solid";
import { useTheme } from "next-themes";
import { MoonIcon } from "./icon/moon-icon";
import { SunIcon } from "./icon/sun-icon";
import { ReactElement } from "react";
export function ToggleThemeButton(): JSX.Element {
export function ToggleThemeButton(): ReactElement {
const { theme, setTheme } = useTheme();
return (
@ -13,7 +13,7 @@ export function ToggleThemeButton(): JSX.Element {
onClick={() => setTheme(theme === "dark" ? "light" : "dark")}
aria-label="Toggle Theme"
>
{theme === "dark" ? <SunIcon /> : <MoonIcon color="#000" />}
{theme === "dark" ? <SunIcon width={24} height={24} /> : <MoonIcon width={24} height={24} color="#000" />}
</button>
);
}

3
src/app/layout.tsx
View File

@ -4,6 +4,7 @@ import { Metadata, Viewport } from "next";
import "./globals.css";
import Script from "next/script";
import { ReactElement } from "react";
import Config from "../../config.json";
import Container from "./components/container";
import ThemeProvider from "./components/theme-provider";
@ -43,7 +44,7 @@ export default function RootLayout({
children,
}: Readonly<{
children: React.ReactNode;
}>): JSX.Element {
}>): ReactElement {
return (
<>
<Script defer data-domain="mcutils.xyz" src="https://analytics.fascinated.cc/js/script.js" />