add cache info buttons
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m27s
All checks were successful
Deploy App / docker (ubuntu-latest) (push) Successful in 1m27s
This commit is contained in:
parent
2b6d8964b3
commit
97c1b88370
@ -15,6 +15,7 @@
|
||||
"@radix-ui/react-context-menu": "^2.1.5",
|
||||
"@radix-ui/react-dialog": "^1.0.5",
|
||||
"@radix-ui/react-label": "^2.0.2",
|
||||
"@radix-ui/react-popover": "^1.0.7",
|
||||
"@radix-ui/react-select": "^2.0.0",
|
||||
"@radix-ui/react-separator": "^1.0.3",
|
||||
"@radix-ui/react-slot": "^1.0.2",
|
||||
@ -24,7 +25,7 @@
|
||||
"clipboard-copy": "^4.0.1",
|
||||
"clsx": "^2.1.0",
|
||||
"lucide-react": "^0.372.0",
|
||||
"mcutils-library": "^1.2.4",
|
||||
"mcutils-library": "^1.2.6",
|
||||
"moment": "^2.30.1",
|
||||
"next": "14.2.2",
|
||||
"next-themes": "^0.3.0",
|
||||
|
46
pnpm-lock.yaml
generated
46
pnpm-lock.yaml
generated
@ -23,6 +23,9 @@ dependencies:
|
||||
'@radix-ui/react-label':
|
||||
specifier: ^2.0.2
|
||||
version: 2.0.2(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-popover':
|
||||
specifier: ^1.0.7
|
||||
version: 1.0.7(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-select':
|
||||
specifier: ^2.0.0
|
||||
version: 2.0.0(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
@ -51,8 +54,8 @@ dependencies:
|
||||
specifier: ^0.372.0
|
||||
version: 0.372.0(react@18.2.0)
|
||||
mcutils-library:
|
||||
specifier: ^1.2.4
|
||||
version: 1.2.5(@babel/core@7.24.4)(@types/node@20.12.7)
|
||||
specifier: ^1.2.6
|
||||
version: 1.2.6(@babel/core@7.24.4)(@types/node@20.12.7)
|
||||
moment:
|
||||
specifier: ^2.30.1
|
||||
version: 2.30.1
|
||||
@ -1276,6 +1279,41 @@ packages:
|
||||
react-remove-scroll: 2.5.5(@types/react@18.2.79)(react@18.2.0)
|
||||
dev: false
|
||||
|
||||
/@radix-ui/react-popover@1.0.7(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0):
|
||||
resolution: {integrity: sha512-shtvVnlsxT6faMnK/a7n0wptwBD23xc1Z5mdrtKLwVEfsEMXodS0r5s0/g5P0hX//EKYZS2sxUjqfzlg52ZSnQ==}
|
||||
peerDependencies:
|
||||
'@types/react': '*'
|
||||
'@types/react-dom': '*'
|
||||
react: ^16.8 || ^17.0 || ^18.0
|
||||
react-dom: ^16.8 || ^17.0 || ^18.0
|
||||
peerDependenciesMeta:
|
||||
'@types/react':
|
||||
optional: true
|
||||
'@types/react-dom':
|
||||
optional: true
|
||||
dependencies:
|
||||
'@babel/runtime': 7.24.4
|
||||
'@radix-ui/primitive': 1.0.1
|
||||
'@radix-ui/react-compose-refs': 1.0.1(@types/react@18.2.79)(react@18.2.0)
|
||||
'@radix-ui/react-context': 1.0.1(@types/react@18.2.79)(react@18.2.0)
|
||||
'@radix-ui/react-dismissable-layer': 1.0.5(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-focus-guards': 1.0.1(@types/react@18.2.79)(react@18.2.0)
|
||||
'@radix-ui/react-focus-scope': 1.0.4(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-id': 1.0.1(@types/react@18.2.79)(react@18.2.0)
|
||||
'@radix-ui/react-popper': 1.1.3(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-portal': 1.0.4(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-presence': 1.0.1(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-primitive': 1.0.3(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0)
|
||||
'@radix-ui/react-slot': 1.0.2(@types/react@18.2.79)(react@18.2.0)
|
||||
'@radix-ui/react-use-controllable-state': 1.0.1(@types/react@18.2.79)(react@18.2.0)
|
||||
'@types/react': 18.2.79
|
||||
'@types/react-dom': 18.2.25
|
||||
aria-hidden: 1.2.4
|
||||
react: 18.2.0
|
||||
react-dom: 18.2.0(react@18.2.0)
|
||||
react-remove-scroll: 2.5.5(@types/react@18.2.79)(react@18.2.0)
|
||||
dev: false
|
||||
|
||||
/@radix-ui/react-popper@1.1.3(@types/react-dom@18.2.25)(@types/react@18.2.79)(react-dom@18.2.0)(react@18.2.0):
|
||||
resolution: {integrity: sha512-cKpopj/5RHZWjrbF2846jBNacjQVwkP068DfmgrNJXpvVWrOvlAmE9xSiy5OqeE+Gi8D9fP+oDhUnPqNMY8/5w==}
|
||||
peerDependencies:
|
||||
@ -4364,8 +4402,8 @@ packages:
|
||||
tmpl: 1.0.5
|
||||
dev: false
|
||||
|
||||
/mcutils-library@1.2.5(@babel/core@7.24.4)(@types/node@20.12.7):
|
||||
resolution: {integrity: sha512-z7zBMblMExtdMIftz5eqlFkWmUI4gppnoEwfEzrgMAYtvJdV2qRXMphjgactoXQaXJ8laL8LRm959ipHoUlHLA==}
|
||||
/mcutils-library@1.2.6(@babel/core@7.24.4)(@types/node@20.12.7):
|
||||
resolution: {integrity: sha512-uRN+6k/wA+4AGVY58jv3UP0YPdIMzd9UTQ2ThoxtcxzaOln5B+RMMN5x6WuqcWh+vhv40v3UboKqJLFUXsSYLg==}
|
||||
dependencies:
|
||||
jest: 29.7.0(@types/node@20.12.7)(ts-node@10.9.2)
|
||||
ts-jest: 29.1.2(@babel/core@7.24.4)(jest@29.7.0)(typescript@5.4.5)
|
||||
|
@ -11,7 +11,7 @@ import { Colors } from "@/common/colors";
|
||||
/**
|
||||
* Force the page to be dynamic, so it will be regenerated on every request
|
||||
*/
|
||||
export const dynamic = "force-dynamic";
|
||||
export const revalidate = 0;
|
||||
|
||||
/**
|
||||
* Gets the color of the status
|
||||
|
@ -12,6 +12,11 @@ import { CachedPlayer, getPlayer, McUtilsAPIError } from "mcutils-library";
|
||||
import { Metadata, Viewport } from "next";
|
||||
import { ReactElement } from "react";
|
||||
|
||||
/**
|
||||
* Force the page to be dynamic, so it will be regenerated on every request
|
||||
*/
|
||||
export const revalidate = 0;
|
||||
|
||||
type Params = {
|
||||
params: {
|
||||
id: string;
|
||||
|
@ -19,6 +19,11 @@ import {
|
||||
import { Metadata, Viewport } from "next";
|
||||
import { ReactElement } from "react";
|
||||
|
||||
/**
|
||||
* Force the page to be dynamic, so it will be regenerated on every request
|
||||
*/
|
||||
export const revalidate = 0;
|
||||
|
||||
type Params = {
|
||||
params: {
|
||||
platform: ServerPlatform;
|
||||
|
24
src/app/components/cache-information.tsx
Normal file
24
src/app/components/cache-information.tsx
Normal file
@ -0,0 +1,24 @@
|
||||
import { Cache } from "mcutils-library";
|
||||
import React, { ReactElement, ReactNode } from "react";
|
||||
import { Popover, PopoverContent, PopoverTrigger } from "@/app/components/ui/popover";
|
||||
import moment from "moment";
|
||||
|
||||
type CacheInformationProps = {
|
||||
cache: Cache;
|
||||
children?: ReactNode;
|
||||
};
|
||||
|
||||
export function CacheInformation({ cache, children }: CacheInformationProps): ReactElement {
|
||||
const isCached = cache.cached;
|
||||
const cacheTime = cache.cachedTime;
|
||||
|
||||
return (
|
||||
<Popover>
|
||||
<PopoverTrigger asChild>{children}</PopoverTrigger>
|
||||
<PopoverContent>
|
||||
<p className={isCached ? "text-green-400" : "text-red-400"}>{isCached ? "Cached" : "Not Cached"}</p>
|
||||
{cacheTime !== -1 && <p>{moment(cacheTime).calendar()}</p>}
|
||||
</PopoverContent>
|
||||
</Popover>
|
||||
);
|
||||
}
|
@ -6,6 +6,7 @@ import { CodeDialog } from "../code-dialog";
|
||||
import { Button } from "../ui/button";
|
||||
import { Separator } from "../ui/separator";
|
||||
import { SkinPartImage } from "./skin-part-image";
|
||||
import { CacheInformation } from "@/app/components/cache-information";
|
||||
|
||||
type PlayerViewProps = {
|
||||
/**
|
||||
@ -44,7 +45,7 @@ export function PlayerView({ player }: PlayerViewProps): ReactElement {
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<div className="8xl:top-0 xs:bottom-0">
|
||||
<div className="flex gap-2">
|
||||
<CodeDialog
|
||||
title="Player Data"
|
||||
description="The player's data from the API"
|
||||
@ -52,6 +53,9 @@ export function PlayerView({ player }: PlayerViewProps): ReactElement {
|
||||
>
|
||||
<Button>View as JSON</Button>
|
||||
</CodeDialog>
|
||||
<CacheInformation cache={player.cache}>
|
||||
<Button>Cache Information</Button>
|
||||
</CacheInformation>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
@ -7,6 +7,8 @@ import { Button } from "../ui/button";
|
||||
import config from "@root/config.json";
|
||||
import { cn } from "@/common/utils";
|
||||
import { minecraft } from "@/app/font/fonts";
|
||||
import { CacheInformation } from "@/app/components/cache-information";
|
||||
import { Cache } from "mcutils-library";
|
||||
|
||||
type ServerViewProps = {
|
||||
/**
|
||||
@ -55,14 +57,17 @@ export function ServerView({ server, favicon }: ServerViewProps): ReactElement {
|
||||
</div>
|
||||
</div>
|
||||
</Card>
|
||||
<div className="8xl:top-0 xs:bottom-0">
|
||||
<div className="flex gap-2">
|
||||
<CodeDialog
|
||||
title="Server Data"
|
||||
description="The server's data from the API"
|
||||
description="The servers's data from the API"
|
||||
code={JSON.stringify(server, undefined, 2)}
|
||||
>
|
||||
<Button>View as JSON</Button>
|
||||
</CodeDialog>
|
||||
<CacheInformation cache={server.cache}>
|
||||
<Button>Cache Information</Button>
|
||||
</CacheInformation>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
31
src/app/components/ui/popover.tsx
Normal file
31
src/app/components/ui/popover.tsx
Normal file
@ -0,0 +1,31 @@
|
||||
"use client"
|
||||
|
||||
import * as React from "react"
|
||||
import * as PopoverPrimitive from "@radix-ui/react-popover"
|
||||
|
||||
import { cn } from "@/common/utils"
|
||||
|
||||
const Popover = PopoverPrimitive.Root
|
||||
|
||||
const PopoverTrigger = PopoverPrimitive.Trigger
|
||||
|
||||
const PopoverContent = React.forwardRef<
|
||||
React.ElementRef<typeof PopoverPrimitive.Content>,
|
||||
React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>
|
||||
>(({ className, align = "center", sideOffset = 4, ...props }, ref) => (
|
||||
<PopoverPrimitive.Portal>
|
||||
<PopoverPrimitive.Content
|
||||
ref={ref}
|
||||
align={align}
|
||||
sideOffset={sideOffset}
|
||||
className={cn(
|
||||
"z-50 w-72 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
|
||||
className
|
||||
)}
|
||||
{...props}
|
||||
/>
|
||||
</PopoverPrimitive.Portal>
|
||||
))
|
||||
PopoverContent.displayName = PopoverPrimitive.Content.displayName
|
||||
|
||||
export { Popover, PopoverTrigger, PopoverContent }
|
Loading…
Reference in New Issue
Block a user