feat: update sidebar nav, add open play toggle, mark courts 5-6 as open play
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -37,6 +37,7 @@ interface Court {
|
||||
status: string;
|
||||
siteId: string;
|
||||
site?: { name: string };
|
||||
isOpenPlay?: boolean;
|
||||
}
|
||||
|
||||
interface User {
|
||||
@@ -479,7 +480,14 @@ export default function SettingsPage() {
|
||||
<tbody>
|
||||
{courts.map((court) => (
|
||||
<tr key={court.id} className="border-b border-primary-50 hover:bg-primary-50/50">
|
||||
<td className="px-4 py-3 font-medium text-primary-800">{court.name}</td>
|
||||
<td className="px-4 py-3 font-medium text-primary-800">
|
||||
{court.name}
|
||||
{court.isOpenPlay && (
|
||||
<span className="ml-2 inline-flex items-center px-1.5 py-0.5 rounded text-xs font-medium bg-amber-100 text-amber-700">
|
||||
Open Play
|
||||
</span>
|
||||
)}
|
||||
</td>
|
||||
<td className="px-4 py-3 text-primary-600">{court.site?.name || "-"}</td>
|
||||
<td className="px-4 py-3 text-primary-600 capitalize">{court.type}</td>
|
||||
<td className="px-4 py-3 text-primary-600">${court.hourlyRate}</td>
|
||||
@@ -709,6 +717,7 @@ function CourtFormModal({
|
||||
const [hourlyRate, setHourlyRate] = useState(court?.hourlyRate?.toString() || "300");
|
||||
const [peakHourlyRate, setPeakHourlyRate] = useState(court?.peakHourlyRate?.toString() || "");
|
||||
const [status, setStatus] = useState(court?.status || "active");
|
||||
const [isOpenPlay, setIsOpenPlay] = useState(court?.isOpenPlay ?? false);
|
||||
|
||||
const handleSubmit = (e: React.FormEvent) => {
|
||||
e.preventDefault();
|
||||
@@ -719,6 +728,7 @@ function CourtFormModal({
|
||||
hourlyRate: parseFloat(hourlyRate),
|
||||
peakHourlyRate: peakHourlyRate ? parseFloat(peakHourlyRate) : null,
|
||||
status,
|
||||
isOpenPlay,
|
||||
});
|
||||
};
|
||||
|
||||
@@ -797,6 +807,18 @@ function CourtFormModal({
|
||||
<option value="inactive">Inactive</option>
|
||||
</select>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="isOpenPlay"
|
||||
checked={isOpenPlay}
|
||||
onChange={(e) => setIsOpenPlay(e.target.checked)}
|
||||
className="rounded border-primary-300"
|
||||
/>
|
||||
<label htmlFor="isOpenPlay" className="text-sm text-primary-700">
|
||||
Open Play Court (free, for group scheduling)
|
||||
</label>
|
||||
</div>
|
||||
<div className="flex gap-3 pt-4">
|
||||
<Button type="button" variant="outline" onClick={onClose} className="flex-1">
|
||||
Cancel
|
||||
|
||||
@@ -4,8 +4,8 @@ import Link from 'next/link';
|
||||
import { usePathname } from 'next/navigation';
|
||||
import {
|
||||
LayoutDashboard,
|
||||
Calendar,
|
||||
Users,
|
||||
Radio,
|
||||
UserCircle,
|
||||
CreditCard,
|
||||
BarChart3,
|
||||
Settings,
|
||||
@@ -20,8 +20,8 @@ interface NavItem {
|
||||
|
||||
const navItems: NavItem[] = [
|
||||
{ label: 'Dashboard', href: '/dashboard', icon: LayoutDashboard },
|
||||
{ label: 'Bookings', href: '/bookings', icon: Calendar },
|
||||
{ label: 'Players', href: '/clients', icon: Users },
|
||||
{ label: 'Live Courts', href: '/live', icon: Radio },
|
||||
{ label: 'Clients', href: '/clients', icon: UserCircle },
|
||||
{ label: 'Memberships', href: '/memberships', icon: CreditCard },
|
||||
{ label: 'Reports', href: '/reports', icon: BarChart3 },
|
||||
{ label: 'Settings', href: '/settings', icon: Settings },
|
||||
|
||||
@@ -101,6 +101,7 @@ async function main() {
|
||||
type: CourtType.OUTDOOR,
|
||||
status: CourtStatus.AVAILABLE,
|
||||
pricePerHour: 300,
|
||||
isOpenPlay: i >= 5,
|
||||
description: 'Outdoor court with night lighting',
|
||||
features: ['Night lighting', 'Court dividers'],
|
||||
displayOrder: i,
|
||||
|
||||
Reference in New Issue
Block a user