adding current revision information

2026-01-02 08:29:16 -05:00
parent 789465483c
commit 920947e556
64 changed files with 5963 additions and 18 deletions
@@ -0,0 +1,104 @@
+import React, { useState, useEffect } from 'react';
+import { Container, Typography, Select, MenuItem, Button, Card, CardContent, CircularProgress } from '@mui/material';
+import type { SelectChangeEvent } from '@mui/material/Select';
+import api from '../services/api';
+
+interface Sign {
+    id: number;
+    name: string;
+    icon: string;
+}
+
+const Home: React.FC = () => {
+    const [signs, setSigns] = useState<Sign[]>([]);
+    const [selectedSign, setSelectedSign] = useState<string>('');
+    const [timeline, setTimeline] = useState<string>('daily');
+    const [horoscope, setHoroscope] = useState<string>('');
+    const [loading, setLoading] = useState<boolean>(false);
+
+    useEffect(() => {
+        const fetchSigns = async () => {
+            try {
+                const response = await api.get('/signs', {
+                    headers: {
+                        Authorization: `Bearer ${localStorage.getItem('token')}`
+                    }
+                });
+                setSigns(response.data);
+            } catch (error) {
+                console.error('Failed to fetch signs', error);
+            }
+        };
+
+        fetchSigns();
+    }, []);
+
+    const handleGetHoroscope = async () => {
+        if (!selectedSign) return;
+        setLoading(true);
+        try {
+            const response = await api.get(`/horoscope/${selectedSign}/${timeline}`, {
+                headers: {
+                    Authorization: `Bearer ${localStorage.getItem('token')}`
+                }
+            });
+            setHoroscope(response.data.horoscope);
+        } catch (error) {
+            console.error('Failed to fetch horoscope', error);
+        } finally {
+            setLoading(false);
+        }
+    };
+
+    return (
+        <Container>
+            <Typography variant="h4" component="h1" gutterBottom>
+                Your Horoscopes
+            </Typography>
+            <Select
+                value={selectedSign}
+                onChange={(e: SelectChangeEvent) => setSelectedSign(e.target.value)}
+                displayEmpty
+                fullWidth
+                margin="normal"
+            >
+                <MenuItem value="" disabled>
+                    Select a Sign
+                </MenuItem>
+                {signs.map((sign) => (
+                    <MenuItem key={sign.id} value={sign.name}>
+                        {sign.icon} {sign.name}
+                    </MenuItem>
+                ))}
+            </Select>
+            <Select
+                value={timeline}
+                onChange={(e: SelectChangeEvent) => setTimeline(e.target.value)}
+                fullWidth
+                margin="normal"
+            >
+                <MenuItem value="daily">Daily</MenuItem>
+                <MenuItem value="weekly">Weekly</MenuItem>
+                <MenuItem value="monthly">Monthly</MenuItem>
+                <MenuItem value="yearly">Yearly</MenuItem>
+            </Select>
+            <Button variant="contained" color="primary" fullWidth onClick={handleGetHoroscope} disabled={loading}>
+                {loading ? <CircularProgress size={24} /> : 'Get Horoscope'}
+            </Button>
+            {horoscope && (
+                <Card sx={{ marginTop: 2 }}>
+                    <CardContent>
+                        <Typography variant="h5" component="h2">
+                            {selectedSign} - {timeline}
+                        </Typography>
+                        <Typography variant="body1">
+                            {horoscope}
+                        </Typography>
+                    </CardContent>
+                </Card>
+            )}
+        </Container>
+    );
+};
+
+export default Home;