feat(business): implement domain-specific BCT components
- Add EventCard component with comprehensive event display - Implement TicketTypeRow for ticket selection and pricing - Create OrderSummary for purchase flow display - Add FeeBreakdown for transparent pricing - Implement ScanStatusBadge for QR scanning interface - Include business type definitions and mock data Components provide realistic Black Canyon Tickets functionality with proper pricing display, event management, and ticketing flows. 🤖 Generated with [Claude Code](https://claude.ai/code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -1,22 +1,23 @@
|
||||
import React, { useState } from 'react';
|
||||
|
||||
import type { Order, ScanStatus } from '../types/business';
|
||||
import { MOCK_USERS } from '../types/auth';
|
||||
import {
|
||||
MOCK_EVENTS,
|
||||
MOCK_TICKET_TYPES,
|
||||
DEFAULT_FEE_STRUCTURE
|
||||
} from '../types/business';
|
||||
|
||||
import { MOCK_USERS } from '../types/auth';
|
||||
|
||||
import { EventCard } from './events';
|
||||
import { TicketTypeRow } from './tickets';
|
||||
import { OrderSummary } from './checkout';
|
||||
import { ScanStatusBadge } from './scanning';
|
||||
import { FeeBreakdown } from './billing';
|
||||
import { Card, CardHeader, CardBody } from './ui/Card';
|
||||
import { Button } from './ui/Button';
|
||||
import { OrderSummary } from './checkout';
|
||||
import { EventCard } from './events';
|
||||
import { MainContainer } from './layout';
|
||||
import { ScanStatusBadge } from './scanning';
|
||||
import { TicketTypeRow } from './tickets';
|
||||
import { Button } from './ui/Button';
|
||||
import { Card, CardHeader, CardBody } from './ui/Card';
|
||||
|
||||
import type { Order, ScanStatus } from '../types/business';
|
||||
|
||||
const DomainShowcase: React.FC = () => {
|
||||
const [currentUser] = useState(MOCK_USERS[1]); // Organizer user
|
||||
@@ -76,15 +77,15 @@ const DomainShowcase: React.FC = () => {
|
||||
updatedAt: new Date().toISOString()
|
||||
};
|
||||
|
||||
const handleEventAction = (action: string, eventId: string) => {
|
||||
const handleEventAction = (_action: string, _eventId: string) => {
|
||||
// Handle event actions in real application
|
||||
};
|
||||
|
||||
const handleTicketAction = (action: string, ticketTypeId: string, value?: unknown) => {
|
||||
const handleTicketAction = (_action: string, _ticketTypeId: string, _value?: unknown) => {
|
||||
// Handle ticket type actions in real application
|
||||
};
|
||||
|
||||
const handlePromoCode = async (code: string) => {
|
||||
const handlePromoCode = async (_code: string) => {
|
||||
// Apply promo code in real application
|
||||
// Simulate API call
|
||||
await new Promise(resolve => setTimeout(resolve, 1000));
|
||||
@@ -92,11 +93,12 @@ const DomainShowcase: React.FC = () => {
|
||||
};
|
||||
|
||||
const simulateScan = () => {
|
||||
const isValid = Math.random() > 0.5;
|
||||
const newStatus: ScanStatus = {
|
||||
isValid: Math.random() > 0.5,
|
||||
isValid,
|
||||
status: Math.random() > 0.7 ? 'valid' : 'invalid',
|
||||
timestamp: new Date().toISOString(),
|
||||
errorMessage: Math.random() > 0.5 ? 'Invalid QR format' : undefined,
|
||||
...(isValid ? {} : { errorMessage: 'Invalid QR format' }),
|
||||
ticketInfo: {
|
||||
eventTitle: 'Contemporary Dance Showcase',
|
||||
ticketTypeName: 'General Admission',
|
||||
@@ -129,7 +131,7 @@ const DomainShowcase: React.FC = () => {
|
||||
<EventCard
|
||||
key={event.id}
|
||||
event={event}
|
||||
currentUser={currentUser}
|
||||
{...(currentUser && { currentUser })}
|
||||
onView={(id) => handleEventAction('view', id)}
|
||||
onEdit={(id) => handleEventAction('edit', id)}
|
||||
onManage={(id) => handleEventAction('manage', id)}
|
||||
@@ -154,7 +156,7 @@ const DomainShowcase: React.FC = () => {
|
||||
key={ticketType.id}
|
||||
ticketType={ticketType}
|
||||
layout="card"
|
||||
currentUser={currentUser}
|
||||
{...(currentUser && { currentUser })}
|
||||
onEdit={(tt) => handleTicketAction('edit', tt.id)}
|
||||
onDelete={(id) => handleTicketAction('delete', id)}
|
||||
onToggleStatus={(id, status) => handleTicketAction('toggle-status', id, status)}
|
||||
@@ -190,7 +192,7 @@ const DomainShowcase: React.FC = () => {
|
||||
key={ticketType.id}
|
||||
ticketType={ticketType}
|
||||
layout="table"
|
||||
currentUser={currentUser}
|
||||
{...(currentUser && { currentUser })}
|
||||
onEdit={(tt) => handleTicketAction('edit', tt.id)}
|
||||
onDelete={(id) => handleTicketAction('delete', id)}
|
||||
onToggleStatus={(id, status) => handleTicketAction('toggle-status', id, status)}
|
||||
@@ -289,21 +291,21 @@ const DomainShowcase: React.FC = () => {
|
||||
<h3 className="text-lg font-medium text-fg-primary">Badge Sizes</h3>
|
||||
<div className="flex flex-wrap gap-4 items-center">
|
||||
<ScanStatusBadge
|
||||
scanStatus={scanStatuses[0]}
|
||||
scanStatus={scanStatuses[0]!}
|
||||
size="sm"
|
||||
showTimestamp={false}
|
||||
showTicketInfo={false}
|
||||
animated={false}
|
||||
/>
|
||||
<ScanStatusBadge
|
||||
scanStatus={scanStatuses[0]}
|
||||
scanStatus={scanStatuses[0]!}
|
||||
size="md"
|
||||
showTimestamp={false}
|
||||
showTicketInfo={false}
|
||||
animated={false}
|
||||
/>
|
||||
<ScanStatusBadge
|
||||
scanStatus={scanStatuses[0]}
|
||||
scanStatus={scanStatuses[0]!}
|
||||
size="lg"
|
||||
showTimestamp={false}
|
||||
showTicketInfo={false}
|
||||
|
||||
Reference in New Issue
Block a user