✨ #698 homeassistant widget (#1658)

src/widgets/index.ts

@@ -11,6 +11,7 @@ import mediaRequestsStats from './media-requests/MediaRequestStatsTile';
 import mediaServer from './media-server/MediaServerTile';
 import notebook from './notebook/NotebookWidgetTile';
 import rss from './rss/RssWidgetTile';
+import smartHomeEntityState from './smart-home/entity-state/entity-state.widget';
 import torrent from './torrent/TorrentTile';
 import usenet from './useNet/UseNetTile';
 import videoStream from './video/VideoStreamTile';
@@ -34,4 +35,5 @@ export default {
   'dns-hole-controls': dnsHoleControls,
   bookmark,
   notebook,
+  'smart-home/entity-state': smartHomeEntityState
 };

src/widgets/smart-home/entity-state/entity-state.widget.tsx

@@ -0,0 +1,97 @@
+import { Center, Loader, Stack, Text, Tooltip } from '@mantine/core';
+import { IconAlertHexagon, IconBinaryTree, IconExclamationMark } from '@tabler/icons-react';
+import { useTranslation } from 'react-i18next';
+import { useConfigContext } from '~/config/provider';
+import { api } from '~/utils/api';
+import { defineWidget } from '~/widgets/helper';
+import { WidgetLoading } from '~/widgets/loading';
+import { IWidget } from '~/widgets/widgets';
+
+const definition = defineWidget({
+  id: 'smart-home/entity-state',
+  icon: IconBinaryTree,
+  options: {
+    entityId: {
+      type: 'text',
+      defaultValue: 'sun.sun',
+      info: true,
+    },
+    displayName: {
+      type: 'text',
+      defaultValue: 'Sun',
+    },
+  },
+  gridstack: {
+    minWidth: 1,
+    minHeight: 1,
+    maxWidth: 12,
+    maxHeight: 12,
+  },
+  component: EntityStateTile,
+});
+
+export type ISmartHomeEntityStateWidget = IWidget<(typeof definition)['id'], typeof definition>;
+
+interface SmartHomeEntityStateWidgetProps {
+  widget: ISmartHomeEntityStateWidget;
+}
+
+function EntityStateTile({ widget }: SmartHomeEntityStateWidgetProps) {
+  const { t } = useTranslation('modules/smart-home/entity-state');
+  const { name: configName } = useConfigContext();
+
+  const { data, isInitialLoading, isLoading, isError, error } =
+    api.smartHomeEntityState.retrieveStatus.useQuery(
+      {
+        configName: configName!,
+        entityId: widget.properties.entityId,
+      },
+      {
+        enabled: !!configName,
+      }
+    );
+
+  let dataComponent = null;
+
+  if (isError) {
+    dataComponent = (
+      <Tooltip label={error.message} withArrow withinPortal>
+        <IconAlertHexagon color="red" />
+      </Tooltip>
+    );
+  }
+
+  if (!dataComponent && isInitialLoading) {
+    dataComponent = <WidgetLoading />;
+  }
+
+  if (!dataComponent && !data) {
+    dataComponent = (
+      <Tooltip label={t('entityNotFound')} withArrow withinPortal>
+        <IconExclamationMark color="red" />
+      </Tooltip>
+    );
+  }
+
+  if (!dataComponent) {
+    dataComponent = (
+      <Text align="center">
+        {data?.state}
+        {isLoading && <Loader ml="xs" size={10} />}
+      </Text>
+    );
+  }
+
+  return (
+    <Center h="100%" w="100%">
+      <Stack align="center" spacing={3}>
+        <Text align="center" weight="bold" size="lg">
+          {widget.properties.displayName}
+        </Text>
+        {dataComponent}
+      </Stack>
+    </Center>
+  );
+}
+
+export default definition;