Updated so that the rules and class text can be updated through the admin page

This commit is contained in:
2026-04-19 13:28:13 +02:00 Verified
parent 16f5c3f22b
commit 0d4d447569
11 changed files with 103 additions and 39 deletions
+6 -5
View File
@@ -6,8 +6,9 @@ import { Turnstile, TurnstileInstance } from '@marsidev/react-turnstile';
import React, { useRef, useActionState, useEffect } from 'react';
import { FaUser, FaEnvelope, FaPhone, FaUsers, FaTrophy, FaCheckCircle, FaExclamationTriangle } from "react-icons/fa";
import { submitRegistration } from './actions';
import { SiteConfig } from '../lib/config';
export default function BeachRegistrationForm({ config, turnstileSiteKey }: { config: any, turnstileSiteKey: string }) {
export default function BeachRegistrationForm({ config, turnstileSiteKey }: { config: SiteConfig, turnstileSiteKey: string }) {
const [state, formAction, isPending] = useActionState(submitRegistration, null);
const formRef = useRef<HTMLFormElement>(null);
const turnstileRef = useRef<TurnstileInstance>(null);
@@ -107,7 +108,7 @@ export default function BeachRegistrationForm({ config, turnstileSiteKey }: { co
<div className="flex-2">
<label className="font-bold text-[#39979f] mb-3 block text-sm uppercase">Välj klass</label>
<div className={`grid grid-cols-2 md:grid-cols-${Math.min(classesData.length, 3)} gap-3`}>
{classesData.map((c: any) => (
{classesData.map((c: { name: string; color: string; desc?: string }) => (
<LevelButton
key={c.name}
value={c.name}
@@ -130,7 +131,7 @@ export default function BeachRegistrationForm({ config, turnstileSiteKey }: { co
<input type="text" name="website" className="hidden" tabIndex={-1} />
<div className="flex justify-center py-2"><Turnstile ref={turnstileRef} siteKey={turnstileSiteKey} options={{ theme: 'light' }}/></div>
<div className="flex justify-center py-2"><Turnstile ref={turnstileRef} siteKey={turnstileSiteKey} options={{ theme: 'light' }} /></div>
{state && (
<div className={`flex items-center gap-3 p-5 rounded-2xl font-bold transition-all ${state.success ? 'bg-green-100 text-green-700' : 'bg-red-100 text-red-700'}`}>
@@ -153,7 +154,7 @@ export default function BeachRegistrationForm({ config, turnstileSiteKey }: { co
}
// Uppdaterad med defaultChecked support
function LevelButton({ value, label, desc, color, defaultChecked }: any) {
function LevelButton({ value, label, desc, color, defaultChecked }: { value: string; label: string; desc?: string; color: string; defaultChecked?: boolean }) {
return (
<label className="cursor-pointer flex-1 relative" style={{ '--class-color': color } as React.CSSProperties}>
<input
@@ -173,7 +174,7 @@ function LevelButton({ value, label, desc, color, defaultChecked }: any) {
);
}
function InputGroup({ icon, ...props }: any) {
function InputGroup({ icon, ...props }: React.InputHTMLAttributes<HTMLInputElement> & { icon: React.ReactNode }) {
return (
<div className="relative group">
<div className="absolute left-4 top-1/2 -translate-y-1/2 text-[#e6be8a] group-focus-within:text-[#39979f] transition-colors">