alpha wip

2025-12-03 00:46:08 +01:00
parent 3b55fd1a63
commit 97e29d3d80
51 changed files with 6321 additions and 237 deletions
--- a/apps/website/components/alpha/CompanionInstructions.tsx
+++ b/apps/website/components/alpha/CompanionInstructions.tsx
@@ -0,0 +1,128 @@
+'use client';
+
+import { useState } from 'react';
+import Card from '../ui/Card';
+import Button from '../ui/Button';
+import { Race } from '../../domain/entities/Race';
+
+interface CompanionInstructionsProps {
+  race: Race;
+  leagueName?: string;
+}
+
+export default function CompanionInstructions({ race, leagueName }: CompanionInstructionsProps) {
+  const [copied, setCopied] = useState(false);
+
+  const formatDateTime = (date: Date) => {
+    return new Date(date).toLocaleDateString('en-US', {
+      month: 'short',
+      day: 'numeric',
+      year: 'numeric',
+      hour: '2-digit',
+      minute: '2-digit',
+      timeZoneName: 'short',
+    });
+  };
+
+  const raceDetails = `GridPilot Race: ${leagueName || 'League'}
+Track: ${race.track}
+Car: ${race.car}
+Date/Time: ${formatDateTime(race.scheduledAt)}
+Session Type: ${race.sessionType.charAt(0).toUpperCase() + race.sessionType.slice(1)}`;
+
+  const handleCopyDetails = async () => {
+    try {
+      await navigator.clipboard.writeText(raceDetails);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2000);
+    } catch (err) {
+      console.error('Failed to copy:', err);
+    }
+  };
+
+  return (
+    <Card className="border border-primary-blue/20 bg-iron-gray">
+      <div className="flex items-start gap-3 mb-4">
+        <div className="w-10 h-10 rounded-lg bg-primary-blue/10 flex items-center justify-center flex-shrink-0">
+          <svg className="w-5 h-5 text-primary-blue" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+            <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
+          </svg>
+        </div>
+        <div className="flex-1">
+          <h3 className="text-lg font-semibold text-white mb-1">Alpha Manual Workflow</h3>
+          <p className="text-sm text-gray-400">
+            Companion automation coming in production. For alpha, races are created manually.
+          </p>
+        </div>
+      </div>
+
+      <div className="space-y-3 mb-4">
+        <div className="flex items-start gap-3">
+          <span className="flex items-center justify-center w-6 h-6 rounded-full bg-primary-blue/20 text-primary-blue text-xs font-semibold flex-shrink-0">
+            1
+          </span>
+          <p className="text-sm text-gray-300 pt-0.5">
+            Schedule race in GridPilot (completed)
+          </p>
+        </div>
+
+        <div className="flex items-start gap-3">
+          <span className="flex items-center justify-center w-6 h-6 rounded-full bg-charcoal-outline text-gray-400 text-xs font-semibold flex-shrink-0">
+            2
+          </span>
+          <p className="text-sm text-gray-300 pt-0.5">
+            Copy race details using button below
+          </p>
+        </div>
+
+        <div className="flex items-start gap-3">
+          <span className="flex items-center justify-center w-6 h-6 rounded-full bg-charcoal-outline text-gray-400 text-xs font-semibold flex-shrink-0">
+            3
+          </span>
+          <p className="text-sm text-gray-300 pt-0.5">
+            Create hosted session manually in iRacing website
+          </p>
+        </div>
+
+        <div className="flex items-start gap-3">
+          <span className="flex items-center justify-center w-6 h-6 rounded-full bg-charcoal-outline text-gray-400 text-xs font-semibold flex-shrink-0">
+            4
+          </span>
+          <p className="text-sm text-gray-300 pt-0.5">
+            Return to GridPilot after race completes
+          </p>
+        </div>
+
+        <div className="flex items-start gap-3">
+          <span className="flex items-center justify-center w-6 h-6 rounded-full bg-charcoal-outline text-gray-400 text-xs font-semibold flex-shrink-0">
+            5
+          </span>
+          <p className="text-sm text-gray-300 pt-0.5">
+            Import results via CSV upload
+          </p>
+        </div>
+      </div>
+
+      <div className="pt-4 border-t border-charcoal-outline">
+        <div className="bg-deep-graphite rounded-lg p-3 mb-3">
+          <pre className="text-xs text-gray-300 whitespace-pre-wrap font-mono">
+{raceDetails}
+          </pre>
+        </div>
+
+        <Button
+          variant="primary"
+          onClick={handleCopyDetails}
+          className="w-full"
+        >
+          <div className="flex items-center justify-center gap-2">
+            <svg className="w-4 h-4" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+              <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z" />
+            </svg>
+            {copied ? 'Copied!' : 'Copy Race Details'}
+          </div>
+        </Button>
+      </div>
+    </Card>
+  );
+}