feat: Refactor automation and site document screens, add device management features, and implement Home Assistant API integration

2026-01-30 12:06:25 +01:00
parent 44d021891f
commit 9bb8279631
7 changed files with 543 additions and 127 deletions
--- a/components/DeviceCard.tsx
+++ b/components/DeviceCard.tsx
@ -0,0 +1,83 @@
+import { HaEntity } from '@/types/types';
+import { Lightbulb, Power, Cpu, Lock, Zap, Fan, Cctv, CloudSun } from 'lucide-react-native';
+import React from 'react';
+import { Text, TouchableOpacity, View } from 'react-native';
+
+const DeviceCard = ({ device, onToggle }: { device: HaEntity; onToggle: (entityId: string) => void; }) => {
+    const getIcon = () => {
+        const domain = device.entity_id.split('.')[0];
+
+        switch (domain) {
+            case 'light':
+                return <Lightbulb size={32} color="#f59e0b" />;
+            case 'switch':
+                return <Power size={32} color="#3b82f6" />;
+            case 'sensor':
+                return <Cpu size={32} color="#ef4444" />;
+            case 'lock':
+                return <Lock size={32} color="#10b981" />;
+            case 'fan':
+                return <Fan size={32} color="#6b7280" />;
+            case 'camera':
+                return <Cctv size={32} color="#8b5cf6" />;
+            case 'weather':
+                return <CloudSun size={32} color="#3b82f6" />;
+            default:
+                return <Zap size={32} color="#8b5cf6" />;
+        }
+    };
+
+    const isToggleable = ['light', 'switch', 'fan', 'input_boolean'].includes(device.entity_id.split('.')[0]);
+    const isOn = device.state === 'on';
+
+    const getDeviceState = (state: string) => {
+        switch (state) {
+            case 'on':
+                return 'Acceso';
+            case 'off':
+                return 'Spento';
+            case 'idle':
+                return 'Inattivo';
+            case 'locked':
+                return 'Bloccato';
+            case 'unlocked':
+                return 'Sbloccato';
+            case 'unavailable':
+                return 'Non disponibile';
+            case 'unknown':
+                return 'Sconosciuto';
+            default:
+                return state;
+        }
+    }
+
+    return (
+        <View
+            className={`bg-white rounded-3xl p-5 shadow-sm border border-gray-100 w-[48%] mb-4`}
+            style={{ aspectRatio: 1 }}
+        >
+            <View className="flex-1 justify-between">
+                <View className="flex-row justify-between items-start">
+                    {getIcon()}
+                    {isToggleable && (
+                        <TouchableOpacity
+                            onPress={() => onToggle(device.entity_id)}
+                            className={`w-12 h-7 rounded-full p-1 ${isOn ? 'bg-[#099499]' : 'bg-gray-200'} active:scale-[0.9]`}
+                        >
+                            <View className={`bg-white w-5 h-5 rounded-full shadow-sm ${isOn ? 'translate-x-5' : 'translate-x-0'}`} />
+                        </TouchableOpacity>
+                    )}
+                </View>
+
+                <View>
+                    <Text className="text-lg font-bold text-gray-800" numberOfLines={2}>{device.name}</Text>
+                    <Text className="text-base text-gray-500 font-medium mt-1">
+                        {getDeviceState(device.state)}
+                    </Text>
+                </View>
+            </View>
+        </View>
+    );
+};
+
+export default DeviceCard;