i18n

src/client/RuleManager.js

@@ -13,6 +13,7 @@ import {
 import RuleCard from './RuleCard';
 import RuleEditor from './RuleEditor';
 import { useAuth } from './AuthContext';
+import { useI18n } from './I18nContext';
 
 // 8 color tags
 const COLOR_TAGS = [
@@ -28,6 +29,7 @@ const COLOR_TAGS = [
 
 export default function RuleManager() {
     const { isAdmin } = useAuth();
+    const { t } = useI18n();
     const [rules, setRules] = useState([]);
     const [loading, setLoading] = useState(true);
     const [error, setError] = useState(null);
@@ -152,7 +154,7 @@ export default function RuleManager() {
     };
 
     const handleDeleteRule = async (ruleId) => {
-        if (!confirm('Delete this rule?')) return;
+        if (!confirm(t('rules.deleteConfirm'))) return;
 
         setSaving(true);
         try {
@@ -262,7 +264,7 @@ export default function RuleManager() {
         return (
             <Paper sx={{ mt: 4, p: 3, textAlign: 'center' }}>
                 <CircularProgress size={24} />
-                <Typography sx={{ mt: 2 }}>Loading rules...</Typography>
+                <Typography sx={{ mt: 2 }}>{t('rules.loading')}</Typography>
             </Paper>
         );
     }
@@ -279,10 +281,10 @@ export default function RuleManager() {
             <Box sx={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', mb: 2 }}>
                 <Box>
                     <Typography variant="h5" sx={{ fontWeight: 600, display: 'flex', alignItems: 'center', gap: 1 }}>
-                        ⚙️ Automation Rules
+                        {t('rules.title')}
                     </Typography>
                     <Typography variant="body2" color="text.secondary">
-                        {isAdmin ? 'Configure triggers and actions for home automation' : 'View automation rules (read-only)'}
+                        {isAdmin ? t('rules.adminDescription') : t('rules.guestDescription')}
                     </Typography>
                 </Box>
                 {isAdmin && (
@@ -297,7 +299,7 @@ export default function RuleManager() {
                             }
                         }}
                     >
-                        + Add Rule
+                        {t('rules.addRule')}
                     </Button>
                 )}
             </Box>
@@ -341,7 +343,7 @@ export default function RuleManager() {
                 <Box sx={{ textAlign: 'center', py: 4 }}>
                     <Typography color="text.secondary">
                         {rules.length === 0
-                            ? (isAdmin ? 'No rules configured. Click "Add Rule" to create one.' : 'No rules configured.')
+                            ? (isAdmin ? t('rules.noRules') + ' ' + t('rules.noRulesAdmin') : t('rules.noRules'))
                             : 'No rules match the selected filter.'
                         }
                     </Typography>