feat: user export service. bug and UX fixes. Complete minus outstanding email template fixes.
This commit is contained in:
@@ -3,9 +3,10 @@
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { useForm } from 'react-hook-form';
|
||||
import { useForm, Controller } from 'react-hook-form';
|
||||
import { zodResolver } from '@hookform/resolvers/zod';
|
||||
import { z } from 'zod';
|
||||
import { FormControl, Select, MenuItem } from '@mui/material';
|
||||
import { Button } from '../../../shared-minimal/components/Button';
|
||||
import { OnboardingPreferences } from '../types/onboarding.types';
|
||||
|
||||
@@ -22,7 +23,7 @@ interface PreferencesStepProps {
|
||||
|
||||
export const PreferencesStep: React.FC<PreferencesStepProps> = ({ onNext, loading }) => {
|
||||
const {
|
||||
register,
|
||||
control,
|
||||
handleSubmit,
|
||||
formState: { errors },
|
||||
watch,
|
||||
@@ -88,17 +89,38 @@ export const PreferencesStep: React.FC<PreferencesStepProps> = ({ onNext, loadin
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
Currency
|
||||
</label>
|
||||
<select
|
||||
{...register('currencyCode')}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 min-h-[44px]"
|
||||
style={{ fontSize: '16px' }}
|
||||
>
|
||||
<option value="USD">USD - US Dollar</option>
|
||||
<option value="EUR">EUR - Euro</option>
|
||||
<option value="GBP">GBP - British Pound</option>
|
||||
<option value="CAD">CAD - Canadian Dollar</option>
|
||||
<option value="AUD">AUD - Australian Dollar</option>
|
||||
</select>
|
||||
<FormControl fullWidth>
|
||||
<Controller
|
||||
name="currencyCode"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
{...field}
|
||||
displayEmpty
|
||||
sx={{
|
||||
minHeight: '44px',
|
||||
fontSize: '16px',
|
||||
borderRadius: '8px',
|
||||
'& .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#d1d5db',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#9ca3af',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#7A212A',
|
||||
},
|
||||
}}
|
||||
>
|
||||
<MenuItem value="USD">USD - US Dollar</MenuItem>
|
||||
<MenuItem value="EUR">EUR - Euro</MenuItem>
|
||||
<MenuItem value="GBP">GBP - British Pound</MenuItem>
|
||||
<MenuItem value="CAD">CAD - Canadian Dollar</MenuItem>
|
||||
<MenuItem value="AUD">AUD - Australian Dollar</MenuItem>
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
</FormControl>
|
||||
{errors.currencyCode && (
|
||||
<p className="mt-1 text-sm text-red-600">{errors.currencyCode.message}</p>
|
||||
)}
|
||||
@@ -109,23 +131,44 @@ export const PreferencesStep: React.FC<PreferencesStepProps> = ({ onNext, loadin
|
||||
<label className="block text-sm font-medium text-slate-700 mb-2">
|
||||
Time Zone
|
||||
</label>
|
||||
<select
|
||||
{...register('timeZone')}
|
||||
className="w-full px-3 py-2 border border-gray-300 rounded-lg focus:outline-none focus:ring-2 focus:ring-primary-500 min-h-[44px]"
|
||||
style={{ fontSize: '16px' }}
|
||||
>
|
||||
<option value="America/New_York">Eastern Time (ET)</option>
|
||||
<option value="America/Chicago">Central Time (CT)</option>
|
||||
<option value="America/Denver">Mountain Time (MT)</option>
|
||||
<option value="America/Los_Angeles">Pacific Time (PT)</option>
|
||||
<option value="America/Phoenix">Arizona Time (MST)</option>
|
||||
<option value="America/Anchorage">Alaska Time (AKT)</option>
|
||||
<option value="Pacific/Honolulu">Hawaii Time (HST)</option>
|
||||
<option value="Europe/London">London (GMT/BST)</option>
|
||||
<option value="Europe/Paris">Paris (CET/CEST)</option>
|
||||
<option value="Asia/Tokyo">Tokyo (JST)</option>
|
||||
<option value="Australia/Sydney">Sydney (AEST/AEDT)</option>
|
||||
</select>
|
||||
<FormControl fullWidth>
|
||||
<Controller
|
||||
name="timeZone"
|
||||
control={control}
|
||||
render={({ field }) => (
|
||||
<Select
|
||||
{...field}
|
||||
displayEmpty
|
||||
sx={{
|
||||
minHeight: '44px',
|
||||
fontSize: '16px',
|
||||
borderRadius: '8px',
|
||||
'& .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#d1d5db',
|
||||
},
|
||||
'&:hover .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#9ca3af',
|
||||
},
|
||||
'&.Mui-focused .MuiOutlinedInput-notchedOutline': {
|
||||
borderColor: '#7A212A',
|
||||
},
|
||||
}}
|
||||
>
|
||||
<MenuItem value="America/New_York">Eastern Time (ET)</MenuItem>
|
||||
<MenuItem value="America/Chicago">Central Time (CT)</MenuItem>
|
||||
<MenuItem value="America/Denver">Mountain Time (MT)</MenuItem>
|
||||
<MenuItem value="America/Los_Angeles">Pacific Time (PT)</MenuItem>
|
||||
<MenuItem value="America/Phoenix">Arizona Time (MST)</MenuItem>
|
||||
<MenuItem value="America/Anchorage">Alaska Time (AKT)</MenuItem>
|
||||
<MenuItem value="Pacific/Honolulu">Hawaii Time (HST)</MenuItem>
|
||||
<MenuItem value="Europe/London">London (GMT/BST)</MenuItem>
|
||||
<MenuItem value="Europe/Paris">Paris (CET/CEST)</MenuItem>
|
||||
<MenuItem value="Asia/Tokyo">Tokyo (JST)</MenuItem>
|
||||
<MenuItem value="Australia/Sydney">Sydney (AEST/AEDT)</MenuItem>
|
||||
</Select>
|
||||
)}
|
||||
/>
|
||||
</FormControl>
|
||||
{errors.timeZone && (
|
||||
<p className="mt-1 text-sm text-red-600">{errors.timeZone.message}</p>
|
||||
)}
|
||||
|
||||
Reference in New Issue
Block a user