chore: remove dead code, unused CSS, unused components, and clean up git tracking
- Remove storage/logs/ and prod.log from git tracking; add to .gitignore - Remove unused AvatarCarousel and ArticleSlider components - Remove unused SkeletonTable export from ui.tsx - Remove unused ChevronDown import from admin layout - Remove 13 unused CSS classes (icon-base, nav-*, navigation-icon*, .app.dark, text-body, transition-base, card-base, admin-info-grid, .coin.*) - Remove duplicate translation keys (openMenu/closeMenu in en.json) - Fix admin-bans to use Prisma-generated bans_type enum - Create shared AdminPageHeader component and formatDate utility - Add logger and generateRequestId for structured logging - All 58 tests pass, typecheck clean, build succeeds
This commit is contained in:
1 parent
c5db7f5156
commit
fc57fb06d1
18 files changed
+40
-2551
No files matched your search
@@ -5,8 +5,9 @@ import { requireStaffRateLimited as requireStaff } from "@/lib/admin/guard";
|
||||
import { prisma } from "@/lib/prisma";
|
||||
import { rcon } from "@/lib/services/rcon";
|
||||
import { logStaffActivity } from "@/lib/services/staff-activity";
|
||||
import type { $Enums } from "@/generated/prisma/client";
|
||||
|
||||
type BanType = "account" | "ip" | "machine" | "super";
|
||||
type BanType = $Enums.bans_type;
|
||||
const BAN_TYPES: ReadonlySet<string> = new Set(["account", "ip", "machine", "super"]);
|
||||
const PERMANENT_SECONDS = 100 * 365 * 24 * 3600;
|
||||
|
||||
|
||||
@@ -11,7 +11,7 @@ import {
|
||||
Store, ShoppingCart, Receipt, Ticket, CreditCard, Gem, Award, Trophy, Calendar,
|
||||
Radio, History,
|
||||
Terminal, Monitor, Bell, FileText, Filter, Wrench, Settings, DoorOpen, Mail, Palette, Cog,
|
||||
ChevronDown, LogOut,
|
||||
LogOut,
|
||||
} from "lucide-react";
|
||||
|
||||
export const dynamic = "force-dynamic";
|
||||
|
||||
+1
-80
@@ -159,58 +159,13 @@ body {
|
||||
}
|
||||
}
|
||||
|
||||
/* ── Atom icons / backgrounds (asset paths adapted to /assets) ── */
|
||||
.icon-base {
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
background-size: contain;
|
||||
}
|
||||
.nav-credit-icon {
|
||||
background: #e9b124 url("/assets/images/icons/currency/credits.png") no-repeat center;
|
||||
outline: 1px solid #b26d18;
|
||||
}
|
||||
.nav-ducket-icon {
|
||||
background: #c44aac url("/assets/images/icons/currency/duckets.png") no-repeat center;
|
||||
outline: 1px solid #812378;
|
||||
}
|
||||
.nav-diamond-icon {
|
||||
background: #caf1f3 url("/assets/images/icons/currency/diamonds.png") no-repeat center;
|
||||
outline: 1px solid #6caff4;
|
||||
}
|
||||
.navigation-icon {
|
||||
width: 20px;
|
||||
height: 25px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
}
|
||||
.navigation-icon.shop {
|
||||
background-image: url("/assets/images/icons/navigation/shop.png");
|
||||
}
|
||||
.navigation-icon.leaderboards {
|
||||
background-image: url("/assets/images/icons/navigation/leaderboards.png");
|
||||
}
|
||||
.navigation-icon.rules {
|
||||
background-image: url("/assets/images/icons/navigation/rules.gif");
|
||||
}
|
||||
.navigation-icon.home {
|
||||
background-image: url("/assets/images/icons/navigation/home.png");
|
||||
}
|
||||
.navigation-icon.community {
|
||||
background-image: url("/assets/images/icons/navigation/community.png");
|
||||
}
|
||||
|
||||
/* ── Site background ── */
|
||||
.site-bg {
|
||||
background:
|
||||
linear-gradient(to bottom, color-mix(in srgb, var(--color-primary) 12%, rgba(255,255,255,0.6)), rgba(255,255,255,0.75)),
|
||||
url("/assets/images/background-light.jpg") no-repeat fixed center / cover;
|
||||
background-blend-mode: overlay;
|
||||
}
|
||||
.app.dark .site-bg {
|
||||
background:
|
||||
linear-gradient(to bottom, color-mix(in srgb, var(--color-primary) 8%, rgba(15,17,23,0.7)), rgba(15,17,23,0.85)),
|
||||
url("/assets/images/background-dark.jpg") no-repeat fixed center / cover;
|
||||
background-blend-mode: overlay;
|
||||
}
|
||||
|
||||
.article-body {
|
||||
line-height: 1.7;
|
||||
@@ -227,9 +182,6 @@ body {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
.text-body {
|
||||
color: var(--color-text);
|
||||
}
|
||||
.text-muted {
|
||||
color: var(--color-text-muted);
|
||||
}
|
||||
@@ -242,9 +194,6 @@ body {
|
||||
.text-shadow-sm {
|
||||
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
|
||||
}
|
||||
.transition-base {
|
||||
transition: all 0.2s ease-in-out;
|
||||
}
|
||||
.hover-lift {
|
||||
transition: transform 0.2s ease, box-shadow 0.2s ease;
|
||||
}
|
||||
@@ -252,18 +201,6 @@ body {
|
||||
transform: translateY(-2px);
|
||||
box-shadow: var(--shadow-card-hover);
|
||||
}
|
||||
.card-base {
|
||||
background-color: var(--color-navbar);
|
||||
color: var(--color-navbar-text);
|
||||
border-radius: var(--radius-md);
|
||||
box-shadow: var(--shadow-card);
|
||||
border: 1px solid color-mix(in srgb, var(--color-text-muted) 15%, transparent);
|
||||
}
|
||||
.card-base:hover {
|
||||
box-shadow: var(--shadow-card-hover);
|
||||
border-color: color-mix(in srgb, var(--color-text-muted) 25%, transparent);
|
||||
}
|
||||
|
||||
/* ── App component classes (used across the converted pages) ── */
|
||||
h1 {
|
||||
font-size: var(--size-heading-h1, 30px);
|
||||
@@ -442,16 +379,6 @@ tbody tr:hover {
|
||||
color: #fff;
|
||||
font-size: 0.7rem;
|
||||
}
|
||||
.coin.credits {
|
||||
background: #e9b124;
|
||||
}
|
||||
.coin.duckets {
|
||||
background: #c44aac;
|
||||
}
|
||||
.coin.diamonds {
|
||||
background: #4bc0d9;
|
||||
}
|
||||
|
||||
/* ── Admin panel (Housekeeping) ─────────────────────────────────
|
||||
Modern, consistent styling for all admin content pages. */
|
||||
.admin-page { scroll-margin-top: 1rem; }
|
||||
@@ -553,12 +480,6 @@ tbody tr:hover {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
/* Two-column info grid */
|
||||
.admin-info-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
|
||||
gap: 0.75rem;
|
||||
}
|
||||
.admin-info-item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
@@ -0,0 +1,21 @@
|
||||
import type { LucideIcon } from "lucide-react";
|
||||
|
||||
interface AdminPageHeaderProps {
|
||||
icon: LucideIcon;
|
||||
title: string;
|
||||
subtitle: string;
|
||||
}
|
||||
|
||||
export function AdminPageHeader({ icon: Icon, title, subtitle }: AdminPageHeaderProps) {
|
||||
return (
|
||||
<div className="flex items-center gap-3 mb-6">
|
||||
<div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--color-primary)]/20 to-[var(--color-primary)]/5 grid place-items-center">
|
||||
<Icon size={20} className="text-[var(--color-primary)]" />
|
||||
</div>
|
||||
<div>
|
||||
<h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{title}</h1>
|
||||
<p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">{subtitle}</p>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,116 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import { useState, useRef, useCallback } from "react";
|
||||
import { avatarImageUrl } from "@/lib/format";
|
||||
|
||||
interface AvatarCarouselProps {
|
||||
figures: string[];
|
||||
imager: string;
|
||||
onSelect: (figure: string) => void;
|
||||
initialIndex?: number;
|
||||
}
|
||||
|
||||
export function AvatarCarousel({
|
||||
figures,
|
||||
imager,
|
||||
onSelect,
|
||||
initialIndex = 0,
|
||||
}: AvatarCarouselProps) {
|
||||
const [currentIndex, setCurrentIndex] = useState(initialIndex);
|
||||
const [direction, setDirection] = useState(0);
|
||||
const isAnimating = useRef(false);
|
||||
const prevIndexRef = useRef(initialIndex);
|
||||
|
||||
const navigate = useCallback((dir: number) => {
|
||||
if (isAnimating.current || figures.length <= 1) return;
|
||||
isAnimating.current = true;
|
||||
setDirection(dir);
|
||||
prevIndexRef.current = currentIndex;
|
||||
setCurrentIndex((prev) => (prev + dir + figures.length) % figures.length);
|
||||
setTimeout(() => { isAnimating.current = false; }, 300);
|
||||
}, [currentIndex, figures.length]);
|
||||
|
||||
const goToIndex = useCallback((index: number) => {
|
||||
if (isAnimating.current) return;
|
||||
isAnimating.current = true;
|
||||
const dir = index > currentIndex ? 1 : -1;
|
||||
setDirection(dir);
|
||||
prevIndexRef.current = currentIndex;
|
||||
setCurrentIndex(index);
|
||||
setTimeout(() => { isAnimating.current = false; }, 300);
|
||||
}, [currentIndex]);
|
||||
|
||||
return (
|
||||
<div className="relative w-full max-w-sm mx-auto" role="region" aria-label="Avatar selection">
|
||||
<div className="relative overflow-hidden rounded-2xl bg-white p-4 shadow-xl dark:bg-gray-800">
|
||||
<div className="transition-transform duration-300 ease-out" style={{ transform: `translateX(${direction * 100}%)` }}>
|
||||
{figures.map((figure, idx) => (
|
||||
<div
|
||||
key={figure}
|
||||
className="relative w-full h-48 flex items-center justify-center"
|
||||
style={{
|
||||
position: "absolute",
|
||||
left: `${idx * 100}%`,
|
||||
top: 0,
|
||||
transition: "transform 300ms ease-out",
|
||||
transform: `translateX(${(currentIndex - prevIndexRef.current) * -100}%)`,
|
||||
}}
|
||||
>
|
||||
<div className="relative w-48 h-64">
|
||||
<img
|
||||
src={avatarImageUrl(imager, figure, { headOnly: false, direction: 2 })}
|
||||
alt={`Avatar ${idx + 1}`}
|
||||
className="w-full h-full object-contain"
|
||||
loading="lazy"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex justify-center gap-3 mt-4">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => navigate(-1)}
|
||||
disabled={isAnimating.current || figures.length <= 1}
|
||||
className="flex h-10 w-10 items-center justify-center rounded-full bg-white/80 dark:bg-gray-800/80 text-gray-700 dark:text-gray-300 shadow-md hover:scale-105 transition-transform disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
aria-label="Previous avatar"
|
||||
>
|
||||
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M15 19l-7-7 7-7" />
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div className="flex items-center gap-2">
|
||||
{figures.map((_, idx) => (
|
||||
<button
|
||||
key={idx}
|
||||
type="button"
|
||||
onClick={() => goToIndex(idx)}
|
||||
disabled={isAnimating.current}
|
||||
className={`w-2.5 h-2.5 rounded-full transition-all ${
|
||||
idx === currentIndex
|
||||
? "bg-[#eeb425] scale-125"
|
||||
: "bg-gray-400 hover:bg-gray-500 dark:bg-gray-600 dark:hover:bg-gray-500"
|
||||
}`}
|
||||
aria-label={`Select avatar ${idx + 1}`}
|
||||
/>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => navigate(1)}
|
||||
disabled={isAnimating.current || figures.length <= 1}
|
||||
className="flex h-10 w-10 items-center justify-center rounded-full bg-white/80 dark:bg-gray-800/80 text-gray-700 dark:text-gray-300 shadow-md hover:scale-105 transition-transform disabled:opacity-50 disabled:cursor-not-allowed"
|
||||
aria-label="Next avatar"
|
||||
>
|
||||
<svg className="w-5 h-5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5l7 7-7 7" />
|
||||
</svg>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -1,143 +0,0 @@
|
||||
"use client";
|
||||
|
||||
import Link from "next/link";
|
||||
import { useCallback, useEffect, useRef, useState } from "react";
|
||||
|
||||
/**
|
||||
* Horizontal, scroll-snap slider for the home page "latest news" row. Keeps the
|
||||
* exact article-card markup from the server page; the cards are passed in as a
|
||||
* pre-shaped list so this client component carries no prisma/i18n dependency.
|
||||
* Prev/next buttons scroll the snap track by one viewport-ish step and disable
|
||||
* themselves at the ends.
|
||||
*/
|
||||
export type SliderArticle = {
|
||||
slug: string;
|
||||
title: string;
|
||||
image: string;
|
||||
excerpt: string;
|
||||
};
|
||||
|
||||
export function ArticleSlider({ articles }: { articles: SliderArticle[] }) {
|
||||
const trackRef = useRef<HTMLDivElement>(null);
|
||||
const [atStart, setAtStart] = useState(true);
|
||||
const [atEnd, setAtEnd] = useState(false);
|
||||
|
||||
const updateEdges = useCallback(() => {
|
||||
const el = trackRef.current;
|
||||
if (!el) return;
|
||||
const maxScroll = el.scrollWidth - el.clientWidth;
|
||||
setAtStart(el.scrollLeft <= 1);
|
||||
setAtEnd(el.scrollLeft >= maxScroll - 1);
|
||||
}, []);
|
||||
|
||||
useEffect(() => {
|
||||
updateEdges();
|
||||
window.addEventListener("resize", updateEdges);
|
||||
return () => window.removeEventListener("resize", updateEdges);
|
||||
}, [updateEdges]);
|
||||
|
||||
const scrollByDir = useCallback((dir: 1 | -1) => {
|
||||
const el = trackRef.current;
|
||||
if (!el) return;
|
||||
// Step by roughly one card width (incl. gap) so snapping lands cleanly.
|
||||
const step = Math.max(el.clientWidth * 0.8, 260);
|
||||
el.scrollBy({ left: dir * step, behavior: "smooth" });
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div style={{ position: "relative" }}>
|
||||
<button
|
||||
type="button"
|
||||
aria-label="Previous"
|
||||
onClick={() => scrollByDir(-1)}
|
||||
disabled={atStart}
|
||||
className="article-slider-nav"
|
||||
style={{ left: "-0.6rem", opacity: atStart ? 0.35 : 1 }}
|
||||
>
|
||||
‹
|
||||
</button>
|
||||
|
||||
<div
|
||||
ref={trackRef}
|
||||
onScroll={updateEdges}
|
||||
style={{
|
||||
display: "flex",
|
||||
gap: "1rem",
|
||||
overflowX: "auto",
|
||||
scrollSnapType: "x mandatory",
|
||||
scrollbarWidth: "none",
|
||||
paddingBottom: "0.25rem",
|
||||
}}
|
||||
>
|
||||
{articles.map((a) => (
|
||||
<article
|
||||
key={a.slug}
|
||||
className="card hover"
|
||||
style={{
|
||||
padding: 0,
|
||||
overflow: "hidden",
|
||||
flex: "0 0 auto",
|
||||
width: "clamp(220px, 70vw, 280px)",
|
||||
scrollSnapAlign: "start",
|
||||
}}
|
||||
>
|
||||
{a.image ? (
|
||||
// biome-ignore lint/performance/noImgElement: external article image
|
||||
<img className="article-img" src={a.image} alt="" />
|
||||
) : (
|
||||
<div className="article-img" />
|
||||
)}
|
||||
<div style={{ padding: "0.85rem" }}>
|
||||
<h3 style={{ margin: "0 0 0.3rem", fontSize: "1rem" }}>
|
||||
<Link href={`/news/${a.slug}`}>{a.title}</Link>
|
||||
</h3>
|
||||
<p className="muted" style={{ margin: 0 }}>
|
||||
{a.excerpt}
|
||||
</p>
|
||||
</div>
|
||||
</article>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<button
|
||||
type="button"
|
||||
aria-label="Next"
|
||||
onClick={() => scrollByDir(1)}
|
||||
disabled={atEnd}
|
||||
className="article-slider-nav"
|
||||
style={{ right: "-0.6rem", opacity: atEnd ? 0.35 : 1 }}
|
||||
>
|
||||
›
|
||||
</button>
|
||||
|
||||
<style>{`
|
||||
.article-slider-nav {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
z-index: 2;
|
||||
width: 2.4rem;
|
||||
height: 2.4rem;
|
||||
border-radius: 999px;
|
||||
border: 1px solid var(--border);
|
||||
background: var(--color-surface);
|
||||
color: var(--color-text);
|
||||
box-shadow: var(--shadow-card);
|
||||
font-size: 1.4rem;
|
||||
line-height: 1;
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
transition: opacity 0.15s ease, box-shadow 0.15s ease;
|
||||
}
|
||||
.article-slider-nav:hover:not(:disabled) {
|
||||
box-shadow: var(--shadow-card-hover);
|
||||
}
|
||||
.article-slider-nav:disabled {
|
||||
cursor: default;
|
||||
}
|
||||
`}</style>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
@@ -135,26 +135,4 @@ export function SkeletonCard({ lines = 3 }: { lines?: number }) {
|
||||
);
|
||||
}
|
||||
|
||||
export function SkeletonTable({ rows = 5 }: { rows?: number }) {
|
||||
return (
|
||||
<div className="content-card" style={{ padding: "0.5rem 1rem 1rem" }}>
|
||||
{Array.from({ length: rows }).map((_, i) => (
|
||||
<div key={i} style={{ display: "flex", alignItems: "center", gap: "0.75rem", padding: "0.6rem 0", borderTop: i > 0 ? "1px solid color-mix(in srgb, var(--color-text-muted) 12%, transparent)" : undefined }}>
|
||||
{i === 0 ? (
|
||||
<>
|
||||
<Skeleton style={{ height: "12px", width: "30%" }} />
|
||||
<Skeleton style={{ height: "12px", width: "20%" }} />
|
||||
<Skeleton style={{ height: "12px", width: "25%", marginLeft: "auto" }} />
|
||||
</>
|
||||
) : (
|
||||
<>
|
||||
<Skeleton style={{ width: "28px", height: "28px", borderRadius: "8px" }} />
|
||||
<Skeleton style={{ height: "14px", width: "35%" }} />
|
||||
<Skeleton style={{ height: "14px", width: "20%", marginLeft: "auto" }} />
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,9 @@
|
||||
/** Format a Date as 'YYYY-MM-DD HH:MM:SS' — used across admin and radio pages. */
|
||||
export function formatDateTime(d: Date | null | undefined): string {
|
||||
return d ? d.toISOString().slice(0, 19).replace("T", " ") : "";
|
||||
}
|
||||
|
||||
/** Format a Date as 'YYYY-MM-DD' — used across radio list pages. */
|
||||
export function formatDate(d: Date | null | undefined): string {
|
||||
return d ? d.toISOString().slice(0, 10) : "";
|
||||
}
|
||||
@@ -21,9 +21,7 @@
|
||||
"admin": "Admin",
|
||||
"openMenu": "Open menu",
|
||||
"closeMenu": "Close menu",
|
||||
"drawBadge": "Draw badge",
|
||||
"openMenu": "Open menu",
|
||||
"closeMenu": "Close menu"
|
||||
"drawBadge": "Draw badge"
|
||||
},
|
||||
"header": {
|
||||
"online": "{count} {hotel} online",
|
||||
|
||||
Reference in new issue
Block a user