From 97c1b88370ad05f884535a9642194c821a03b13a Mon Sep 17 00:00:00 2001 From: Liam Date: Fri, 19 Apr 2024 21:19:14 +0100 Subject: [PATCH] add cache info buttons --- package.json | 3 +- pnpm-lock.yaml | 46 +++++++++++++++++-- src/app/(pages)/mojang/status/page.tsx | 2 +- src/app/(pages)/player/[[...id]]/page.tsx | 5 ++ .../[platform]/[[...hostname]]/page.tsx | 5 ++ src/app/components/cache-information.tsx | 24 ++++++++++ src/app/components/player/player-view.tsx | 6 ++- src/app/components/server/server-view.tsx | 9 +++- src/app/components/ui/popover.tsx | 31 +++++++++++++ 9 files changed, 122 insertions(+), 9 deletions(-) create mode 100644 src/app/components/cache-information.tsx create mode 100644 src/app/components/ui/popover.tsx diff --git a/package.json b/package.json index 4e0157a..1821e53 100644 --- a/package.json +++ b/package.json @@ -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", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 0d633dc..919a87f 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -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) diff --git a/src/app/(pages)/mojang/status/page.tsx b/src/app/(pages)/mojang/status/page.tsx index 96a356d..bfd4755 100644 --- a/src/app/(pages)/mojang/status/page.tsx +++ b/src/app/(pages)/mojang/status/page.tsx @@ -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 diff --git a/src/app/(pages)/player/[[...id]]/page.tsx b/src/app/(pages)/player/[[...id]]/page.tsx index c97d77c..a1c0109 100644 --- a/src/app/(pages)/player/[[...id]]/page.tsx +++ b/src/app/(pages)/player/[[...id]]/page.tsx @@ -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; diff --git a/src/app/(pages)/server/[platform]/[[...hostname]]/page.tsx b/src/app/(pages)/server/[platform]/[[...hostname]]/page.tsx index 7fe667d..a0075d2 100644 --- a/src/app/(pages)/server/[platform]/[[...hostname]]/page.tsx +++ b/src/app/(pages)/server/[platform]/[[...hostname]]/page.tsx @@ -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; diff --git a/src/app/components/cache-information.tsx b/src/app/components/cache-information.tsx new file mode 100644 index 0000000..be7978c --- /dev/null +++ b/src/app/components/cache-information.tsx @@ -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 ( + + {children} + +

{isCached ? "Cached" : "Not Cached"}

+ {cacheTime !== -1 &&

{moment(cacheTime).calendar()}

} + + + ); +} diff --git a/src/app/components/player/player-view.tsx b/src/app/components/player/player-view.tsx index d37bd94..a988098 100644 --- a/src/app/components/player/player-view.tsx +++ b/src/app/components/player/player-view.tsx @@ -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 { -
+
+ + +
); diff --git a/src/app/components/server/server-view.tsx b/src/app/components/server/server-view.tsx index 395d261..4b556f3 100644 --- a/src/app/components/server/server-view.tsx +++ b/src/app/components/server/server-view.tsx @@ -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 { -
+
+ + +
); diff --git a/src/app/components/ui/popover.tsx b/src/app/components/ui/popover.tsx new file mode 100644 index 0000000..96146a3 --- /dev/null +++ b/src/app/components/ui/popover.tsx @@ -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, + React.ComponentPropsWithoutRef +>(({ className, align = "center", sideOffset = 4, ...props }, ref) => ( + + + +)) +PopoverContent.displayName = PopoverPrimitive.Content.displayName + +export { Popover, PopoverTrigger, PopoverContent }