This commit is contained in:
sebseb7
2025-12-21 03:46:50 +01:00
parent eab4241e6e
commit 5febdf29c8
11 changed files with 398 additions and 65 deletions

View File

@@ -23,16 +23,9 @@ import {
Paper,
Chip
} from '@mui/material';
import { useI18n } from './I18nContext';
const DAYS = [
{ key: 'mon', label: 'Mon' },
{ key: 'tue', label: 'Tue' },
{ key: 'wed', label: 'Wed' },
{ key: 'thu', label: 'Thu' },
{ key: 'fri', label: 'Fri' },
{ key: 'sat', label: 'Sat' },
{ key: 'sun', label: 'Sun' }
];
const DAYS_KEYS = ['mon', 'tue', 'wed', 'thu', 'fri', 'sat', 'sun'];
const OPERATORS = [
{ value: '>', label: '>' },
@@ -122,6 +115,7 @@ function SensorCondition({ condition, sensors, onChange, onRemove, disabled }) {
}
export default function RuleEditor({ open, rule, onSave, onClose, sensors = [], outputs = [], colorTags: availableColorTags = [], saving }) {
const { t } = useI18n();
const [name, setName] = useState('');
const [selectedTags, setSelectedTags] = useState([]); // array of tag ids
@@ -312,18 +306,18 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
}}
>
<DialogTitle>
{rule ? '✏️ Edit Rule' : ' Create New Rule'}
{rule ? t('ruleEditor.editTitle') : t('ruleEditor.createTitle')}
</DialogTitle>
<DialogContent dividers>
<Box sx={{ display: 'flex', flexDirection: 'column', gap: 3, pt: 1 }}>
{/* Rule Name */}
<TextField
label="Rule Name"
label={t('ruleEditor.ruleName')}
value={name}
onChange={(e) => setName(e.target.value)}
fullWidth
placeholder="e.g., Daytime High Humidity Fan"
placeholder={t('ruleEditor.ruleNamePlaceholder')}
disabled={saving}
/>
@@ -379,7 +373,7 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
{/* TRIGGERS SECTION */}
<Box>
<Typography variant="subtitle2" color="text.secondary" gutterBottom>
TRIGGERS (When to activate)
{t('ruleEditor.triggersSection')}
</Typography>
<Divider sx={{ mb: 2 }} />
@@ -393,13 +387,13 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
disabled={saving}
/>
}
label={<Typography fontWeight={600}>🕐 Scheduled Time (trigger at exact time)</Typography>}
label={<Typography fontWeight={600}>{t('ruleEditor.scheduledTime')}</Typography>}
/>
{useScheduledTime && (
<Box sx={{ mt: 2, display: 'flex', flexDirection: 'column', gap: 2 }}>
<TextField
label="Trigger At"
label={t('ruleEditor.triggerAt')}
type="time"
value={scheduledTime}
onChange={(e) => setScheduledTime(e.target.value)}
@@ -410,7 +404,7 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
/>
<Box>
<Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
Days
{t('ruleEditor.days')}
</Typography>
<ToggleButtonGroup
value={scheduledDays}
@@ -418,10 +412,10 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
size="small"
disabled={saving}
>
{DAYS.map(day => (
{DAYS_KEYS.map(key => (
<ToggleButton
key={day.key}
value={day.key}
key={key}
value={key}
sx={{
'&.Mui-selected': {
bgcolor: '#d3869b',
@@ -430,7 +424,7 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
}
}}
>
{day.label}
{t(`days.${key}`)}
</ToggleButton>
))}
</ToggleButtonGroup>
@@ -477,7 +471,7 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
</Box>
<Box>
<Typography variant="body2" color="text.secondary" sx={{ mb: 1 }}>
Days
{t('ruleEditor.days')}
</Typography>
<ToggleButtonGroup
value={timeRangeDays}
@@ -485,10 +479,10 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
size="small"
disabled={saving}
>
{DAYS.map(day => (
{DAYS_KEYS.map(key => (
<ToggleButton
key={day.key}
value={day.key}
key={key}
value={key}
sx={{
'&.Mui-selected': {
bgcolor: '#8ec07c',
@@ -497,7 +491,7 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
}
}}
>
{day.label}
{t(`days.${key}`)}
</ToggleButton>
))}
</ToggleButtonGroup>
@@ -709,7 +703,7 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
<DialogActions sx={{ px: 3, py: 2 }}>
<Button onClick={onClose} color="inherit" disabled={saving}>
Cancel
{t('ruleEditor.cancel')}
</Button>
<Button
onClick={handleSave}
@@ -725,10 +719,10 @@ export default function RuleEditor({ open, rule, onSave, onClose, sensors = [],
{saving ? (
<Box sx={{ display: 'flex', alignItems: 'center', gap: 1 }}>
<CircularProgress size={16} color="inherit" />
Saving...
{t('ruleEditor.saving')}
</Box>
) : (
rule ? 'Save Changes' : 'Create Rule'
rule ? t('ruleEditor.saveChanges') : t('ruleEditor.createRule')
)}
</Button>
</DialogActions>