session start works

frontend/src/components/DesireForm.tsx

@@ -0,0 +1,87 @@
+import React, { useState } from 'react';
+import { TextField, Button, Box, Typography } from '@mui/material';
+
+interface DesireFormProps {
+    onSubmit: (desires: { wants: string[], accepts: string[], noGoes: string[] }) => void;
+}
+
+const DesireForm: React.FC<DesireFormProps> = ({ onSubmit }) => {
+    const [wants, setWants] = useState('');
+    const [accepts, setAccepts] = useState('');
+    const [noGoes, setNoGoes] = useState('');
+
+    const handleSubmit = (event: React.FormEvent) => {
+        event.preventDefault();
+        const parsedWants = wants.split('\n').map(s => s.trim()).filter(s => s);
+        const parsedAccepts = accepts.split('\n').map(s => s.trim()).filter(s => s);
+        const parsedNoGoes = noGoes.split('\n').map(s => s.trim()).filter(s => s);
+
+        // FR-020: The system MUST require a user to enter at least one desire in at least one of the three categories
+        if (parsedWants.length === 0 && parsedAccepts.length === 0 && parsedNoGoes.length === 0) {
+            alert('Please enter at least one desire in any category.');
+            return;
+        }
+
+        // FR-016: System MUST validate a user's submission to prevent the same item from appearing in conflicting categories
+        const allItems = [...parsedWants, ...parsedAccepts, ...parsedNoGoes];
+        const uniqueItems = new Set(allItems);
+        if (allItems.length !== uniqueItems.size) {
+            alert('You have conflicting desires (same item in different categories). Please resolve.');
+            return;
+        }
+
+        onSubmit({
+            wants: parsedWants,
+            accepts: parsedAccepts,
+            noGoes: parsedNoGoes,
+        });
+    };
+
+    return (
+        <Box component="form" onSubmit={handleSubmit} sx={{ mt: 3 }}>
+            <Typography variant="h6" gutterBottom>What you WANT</Typography>
+            <TextField
+                label="List items you want (one per line)"
+                multiline
+                rows={4}
+                fullWidth
+                value={wants}
+                onChange={(e) => setWants(e.target.value)}
+                margin="normal"
+            />
+
+            <Typography variant="h6" gutterBottom sx={{ mt: 4 }}>What you ACCEPT</Typography>
+            <TextField
+                label="List items you accept (one per line)"
+                multiline
+                rows={4}
+                fullWidth
+                value={accepts}
+                onChange={(e) => setAccepts(e.target.value)}
+                margin="normal"
+            />
+
+            <Typography variant="h6" gutterBottom sx={{ mt: 4 }}>What you DO NOT WANT</Typography>
+            <TextField
+                label="List items you absolutely do not want (one per line)"
+                multiline
+                rows={4}
+                fullWidth
+                value={noGoes}
+                onChange={(e) => setNoGoes(e.target.value)}
+                margin="normal"
+            />
+
+            <Button
+                type="submit"
+                fullWidth
+                variant="contained"
+                sx={{ mt: 3, mb: 2 }}
+            >
+                Submit Desires
+            </Button>
+        </Box>
+    );
+};
+
+export default DesireForm;