Andrei
3335255710
Frontend Compliance Features: - Created compliance API client (data export, account deletion, deletion status) - Added DataExport component with download functionality - Added AccountDeletion component with 30-day grace period UI - Updated Settings page with Privacy & Compliance sections COPPA Age Verification: - Added date of birth field to registration - Age calculation with COPPA compliance (under 13 blocked) - Parental email and consent for users 13-17 - Dynamic form validation based on age Privacy & Terms: - Separate checkboxes for Terms of Service and Privacy Policy - Required acceptance for registration - Links to policy pages Completes GDPR Right to Data Portability and Right to Erasure. Completes COPPA parental consent requirements.
72 lines
2.0 KiB
TypeScript
72 lines
2.0 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import {
|
|
Card,
|
|
CardContent,
|
|
Typography,
|
|
Button,
|
|
Box,
|
|
CircularProgress,
|
|
Alert,
|
|
} from '@mui/material';
|
|
import { Download } from '@mui/icons-material';
|
|
import { complianceApi } from '@/lib/api/compliance';
|
|
|
|
export function DataExport() {
|
|
const [isExporting, setIsExporting] = useState(false);
|
|
const [error, setError] = useState<string | null>(null);
|
|
const [success, setSuccess] = useState<string | null>(null);
|
|
|
|
const handleExport = async () => {
|
|
setIsExporting(true);
|
|
setError(null);
|
|
setSuccess(null);
|
|
|
|
try {
|
|
await complianceApi.downloadUserData();
|
|
setSuccess('Your data has been downloaded successfully!');
|
|
} catch (err: any) {
|
|
console.error('Failed to export data:', err);
|
|
setError(err.response?.data?.message || 'Failed to export data. Please try again.');
|
|
} finally {
|
|
setIsExporting(false);
|
|
}
|
|
};
|
|
|
|
return (
|
|
<Card>
|
|
<CardContent>
|
|
<Typography variant="h6" fontWeight="600" gutterBottom>
|
|
Data Export
|
|
</Typography>
|
|
<Typography variant="body2" color="text.secondary" sx={{ mb: 2 }}>
|
|
Download all your data in JSON format. This includes your profile, children, activities, and AI conversations.
|
|
This complies with GDPR's Right to Data Portability.
|
|
</Typography>
|
|
|
|
{error && (
|
|
<Alert severity="error" sx={{ mb: 2 }} onClose={() => setError(null)}>
|
|
{error}
|
|
</Alert>
|
|
)}
|
|
|
|
{success && (
|
|
<Alert severity="success" sx={{ mb: 2 }} onClose={() => setSuccess(null)}>
|
|
{success}
|
|
</Alert>
|
|
)}
|
|
|
|
<Button
|
|
variant="outlined"
|
|
startIcon={isExporting ? <CircularProgress size={20} /> : <Download />}
|
|
onClick={handleExport}
|
|
disabled={isExporting}
|
|
>
|
|
{isExporting ? 'Exporting...' : 'Download My Data'}
|
|
</Button>
|
|
</CardContent>
|
|
</Card>
|
|
);
|
|
}
|