fix website build

This commit is contained in:
2025-12-25 12:54:08 +01:00
parent ac083363bc
commit 722a185dd9
26 changed files with 1712 additions and 1419 deletions

View File

@@ -1,14 +1,14 @@
'use client';
import { useRef, ReactNode } from 'react';
import { useRef } from 'react';
import Container from '@/components/ui/Container';
import Heading from '@/components/ui/Heading';
import { useParallax } from '../../hooks/useScrollProgress';
interface AlternatingSectionProps {
heading: string;
description: string | ReactNode;
mockup: ReactNode;
description: string | React.ReactNode;
mockup: React.ReactNode;
layout: 'text-left' | 'text-right';
backgroundImage?: string;
backgroundVideo?: string;

View File

@@ -11,7 +11,7 @@ import {
Save,
Trash2,
Plus,
Image,
Image as ImageIcon,
Target
} from 'lucide-react';
@@ -217,7 +217,7 @@ export default function LeagueDecalPlacementEditor({
/>
) : (
<div className="w-full h-full flex flex-col items-center justify-center">
<Image className="w-16 h-16 text-gray-600 mb-2" />
<ImageIcon className="w-16 h-16 text-gray-600 mb-2" />
<p className="text-sm text-gray-500">No base template uploaded</p>
<p className="text-xs text-gray-600">Upload a template image first</p>
</div>

View File

@@ -14,7 +14,7 @@ interface InfoFlyoutProps {
onClose: () => void;
title: string;
children: React.ReactNode;
anchorRef: React.RefObject<HTMLElement | null>;
anchorRef: React.RefObject<HTMLElement>;
}
function InfoFlyout({ isOpen, onClose, title, children, anchorRef }: InfoFlyoutProps) {
@@ -104,7 +104,7 @@ function InfoFlyout({ isOpen, onClose, title, children, anchorRef }: InfoFlyoutP
);
}
function InfoButton({ onClick, buttonRef }: { onClick: () => void; buttonRef: React.RefObject<HTMLButtonElement> }) {
function InfoButton({ onClick, buttonRef }: { onClick: () => void; buttonRef: React.Ref<HTMLButtonElement> }) {
return (
<button
ref={buttonRef}
@@ -248,7 +248,7 @@ export function LeagueDropSection({
const dropPolicy = form.dropPolicy || { strategy: 'none' as const };
const [showDropFlyout, setShowDropFlyout] = useState(false);
const [activeDropRuleFlyout, setActiveDropRuleFlyout] = useState<DropStrategy | null>(null);
const dropInfoRef = useRef<HTMLButtonElement>(null);
const dropInfoRef = useRef<HTMLButtonElement>(null!);
const dropRuleRefs = useRef<Record<DropStrategy, HTMLButtonElement | null>>({
none: null,
bestNResults: null,
@@ -421,7 +421,7 @@ export function LeagueDropSection({
isOpen={activeDropRuleFlyout === option.value}
onClose={() => setActiveDropRuleFlyout(null)}
title={ruleInfo.title}
anchorRef={{ current: dropRuleRefs.current[option.value] }}
anchorRef={{ current: dropRuleRefs.current[option.value] ?? dropInfoRef.current }}
>
<div className="space-y-4">
<p className="text-xs text-gray-400">{ruleInfo.description}</p>

View File

@@ -15,7 +15,7 @@ interface InfoFlyoutProps {
onClose: () => void;
title: string;
children: React.ReactNode;
anchorRef: React.RefObject<HTMLElement | null>;
anchorRef: React.RefObject<HTMLElement>;
}
function InfoFlyout({ isOpen, onClose, title, children, anchorRef }: InfoFlyoutProps) {
@@ -117,7 +117,7 @@ function InfoFlyout({ isOpen, onClose, title, children, anchorRef }: InfoFlyoutP
);
}
function InfoButton({ onClick, buttonRef }: { onClick: () => void; buttonRef: React.RefObject<HTMLButtonElement> }) {
function InfoButton({ onClick, buttonRef }: { onClick: () => void; buttonRef: React.Ref<HTMLButtonElement> }) {
return (
<button
ref={buttonRef}
@@ -533,8 +533,8 @@ export function ScoringPatternSection({
const [showPointsFlyout, setShowPointsFlyout] = useState(false);
const [showBonusFlyout, setShowBonusFlyout] = useState(false);
const [activePresetFlyout, setActivePresetFlyout] = useState<string | null>(null);
const pointsInfoRef = useRef<HTMLButtonElement>(null);
const bonusInfoRef = useRef<HTMLButtonElement>(null);
const pointsInfoRef = useRef<HTMLButtonElement>(null!);
const bonusInfoRef = useRef<HTMLButtonElement>(null!);
const presetInfoRefs = useRef<Record<string, HTMLElement | null>>({});
return (
@@ -662,7 +662,7 @@ export function ScoringPatternSection({
isOpen={activePresetFlyout === preset.id}
onClose={() => setActivePresetFlyout(null)}
title={presetInfo.title}
anchorRef={{ current: presetInfoRefs.current[preset.id] ?? null }}
anchorRef={{ current: presetInfoRefs.current[preset.id] ?? pointsInfoRef.current }}
>
<div className="space-y-4">
<p className="text-xs text-gray-400">{presetInfo.description}</p>
@@ -943,7 +943,7 @@ export function ChampionshipsSection({
const isTeamsMode = form.structure.mode === 'fixedTeams';
const [showChampFlyout, setShowChampFlyout] = useState(false);
const [activeChampFlyout, setActiveChampFlyout] = useState<string | null>(null);
const champInfoRef = useRef<HTMLButtonElement>(null);
const champInfoRef = useRef<HTMLButtonElement>(null!);
const champItemRefs = useRef<Record<string, HTMLElement | null>>({});
const updateChampionship = (key: keyof LeagueConfigFormModel['championships'], value: boolean) => {
@@ -1121,7 +1121,7 @@ export function ChampionshipsSection({
isOpen={activeChampFlyout === champ.key}
onClose={() => setActiveChampFlyout(null)}
title={champInfo.title}
anchorRef={{ current: champItemRefs.current[champ.key] ?? null }}
anchorRef={{ current: champItemRefs.current[champ.key] ?? champInfoRef.current }}
>
<div className="space-y-4">
<p className="text-xs text-gray-400">{champInfo.description}</p>

View File

@@ -181,14 +181,14 @@ export const LeagueSlider = ({
ref={scrollRef}
onMouseEnter={() => setIsHovering(true)}
onMouseLeave={() => setIsHovering(false)}
className="flex gap-4 overflow-x-auto pb-4 px-4"
className="league-slider__scroll flex gap-4 overflow-x-auto pb-4 px-4"
style={{
scrollbarWidth: 'none',
msOverflowStyle: 'none',
}}
>
<style jsx>{`
div::-webkit-scrollbar {
<style>{`
.league-slider__scroll::-webkit-scrollbar {
display: none;
}
`}</style>

View File

@@ -2,6 +2,7 @@
import { User, Users2, Info, Check, HelpCircle, X } from 'lucide-react';
import { useState, useRef, useEffect, useMemo } from 'react';
import type * as React from 'react';
import { createPortal } from 'react-dom';
import Input from '@/components/ui/Input';
import type { LeagueConfigFormModel } from '@/lib/types/LeagueConfigFormModel';
@@ -15,7 +16,7 @@ interface InfoFlyoutProps {
onClose: () => void;
title: string;
children: React.ReactNode;
anchorRef: React.RefObject<HTMLElement | null>;
anchorRef: React.RefObject<HTMLElement>;
}
function InfoFlyout({ isOpen, onClose, title, children, anchorRef }: InfoFlyoutProps) {
@@ -225,8 +226,8 @@ export function LeagueStructureSection({
// Flyout state
const [showSoloFlyout, setShowSoloFlyout] = useState(false);
const [showTeamsFlyout, setShowTeamsFlyout] = useState(false);
const soloInfoRef = useRef<HTMLButtonElement>(null);
const teamsInfoRef = useRef<HTMLButtonElement>(null);
const soloInfoRef = useRef<HTMLButtonElement>(null!);
const teamsInfoRef = useRef<HTMLButtonElement>(null!);
const isSolo = structure.mode === 'solo';

View File

@@ -2,6 +2,7 @@
import { Trophy, Users, Check, HelpCircle, X } from 'lucide-react';
import { useState, useRef, useEffect } from 'react';
import type * as React from 'react';
import { createPortal } from 'react-dom';
import type { LeagueConfigFormModel } from '@/lib/types/LeagueConfigFormModel';
@@ -17,7 +18,7 @@ interface InfoFlyoutProps {
onClose: () => void;
title: string;
children: React.ReactNode;
anchorRef: React.RefObject<HTMLElement | null>;
anchorRef: React.RefObject<HTMLElement>;
}
function InfoFlyout({ isOpen, onClose, title, children, anchorRef }: InfoFlyoutProps) {
@@ -128,8 +129,8 @@ export function LeagueVisibilitySection({
// Flyout state
const [showRankedFlyout, setShowRankedFlyout] = useState(false);
const [showUnrankedFlyout, setShowUnrankedFlyout] = useState(false);
const rankedInfoRef = useRef<HTMLButtonElement>(null);
const unrankedInfoRef = useRef<HTMLButtonElement>(null);
const rankedInfoRef = useRef<HTMLButtonElement>(null!);
const unrankedInfoRef = useRef<HTMLButtonElement>(null!);
// Normalize visibility to new terminology
const isRanked = basics.visibility === 'public';

View File

@@ -16,7 +16,7 @@ export default function Heading({ level, children, className = '', style }: Head
3: 'text-xl sm:text-2xl'
};
const Tag = `h${level}` as keyof JSX.IntrinsicElements;
const Tag = `h${level}` as keyof React.JSX.IntrinsicElements;
return (
<Tag className={`${baseStyles} ${levelStyles[level]} ${className}`} style={style}>