Add indication of door status

initLab · Feb 18, 2024 · 71677f1 · 71677f1
1 parent f9c0d1e
commit 71677f1
Show file tree

Hide file tree

Showing 4 changed files with 17 additions and 4 deletions.
diff --git a/public/locales/bg.yaml b/public/locales/bg.yaml
@@ -131,6 +131,7 @@ views:
   door:
     locked: Заключено
     unlocked: Отключено
+    open: Отворено
     unknown: Неясно
     no_access: |
       Нямате права за управление на вратите. Моля, свържете се с представител на Управителния съвет на Инит Лаб на адрес

diff --git a/public/locales/en.yaml b/public/locales/en.yaml
@@ -124,6 +124,7 @@ views:
   door:
     locked: Locked
     unlocked: Unlocked
+    open: Wide open
     unknown: Unknown
     no_access: |
       You don't have the necessary rights to control the doors. Please contact an init Lab board member at

diff --git a/src/pages/Devices.jsx b/src/pages/Devices.jsx
@@ -45,6 +45,7 @@ const Devices = ({
             {filteredDevices.length > 0 ? filteredDevices.map(device => {
                 const deviceActions = deviceActionMapper(device);
                 const isUnavailable = device?.statuses?.available === false;
+                const isOpen = device?.statuses?.open === true;
 
                 return (<Col key={device.id}>
                     <Card>
@@ -56,7 +57,8 @@ const Devices = ({
                             {isUnavailable ? t('views.devices.offline') : <>
                                 {deviceActions.map(action =>
                                     <DeviceActionButton key={action} deviceId={device.id} action={action}
-                                        busyActionId={busyActionId} setBusyActionId={setBusyActionId} />)}
+                                        busyActionId={busyActionId} setBusyActionId={setBusyActionId}
+                                        isDoorOpen={isOpen} />)}
                                 {deviceActions.length === 0 && <LoadingIcon large />}
                             </>}
                         </Card.Body>

diff --git a/src/widgets/DeviceActionButton/DeviceActionButton.jsx b/src/widgets/DeviceActionButton/DeviceActionButton.jsx
@@ -37,6 +37,7 @@ const DeviceActionButton = ({
     action,
     busyActionId,
     setBusyActionId,
+    isDoorOpen,
 }) => {
     const actionId = deviceId + '/' + action;
     const loading = actionId === busyActionId;
@@ -67,13 +68,21 @@ const DeviceActionButton = ({
         }
     }
 
+    const variant = isDoorOpen ? 'warning' : type.variant;
+    const icon = isDoorOpen ? 'fa-solid fa-door-open' : type.icon;
+    const label = t(isDoorOpen ? 'views.door.open' : 'views.devices.' + action);
+
     return (<>
-        <Button variant={type.variant} className="device-action-button" onClick={handleClick} disabled={disabled}>
-            <i className={loading ? 'fa-solid fa-arrows-rotate fa-spin' : type.icon} />
-            <div>{t('views.devices.' + action)}</div>
+        <Button variant={variant} className="device-action-button" onClick={handleClick} disabled={disabled}>
+            <i className={loading ? 'fa-solid fa-arrows-rotate fa-spin' : icon} />
+            <div>{label}</div>
         </Button>
         {isError && [401, 403].includes(error.status) && <RedirectToLogin />}
     </>);
 };
 
+DeviceActionButton.defaultProps = {
+    isDoorOpen: false,
+};
+
 export default DeviceActionButton;