react/src/lib/seam/components/DeviceTable/DeviceHealthBar.stories.tsx at 6b501debbe81922d7f9c4e630d2b80288a3fd761 · seamapi/react · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
import { Box } from '@mui/material'
import type { Meta, StoryObj } from '@storybook/react'
import { useState } from 'react'

import {
  type AccountFilter,
  type DeviceFilter,
  DeviceHealthBar,
} from 'lib/seam/components/DeviceTable/DeviceHealthBar.js'

const meta: Meta<typeof DeviceHealthBar> = {
  title: 'Library/DeviceHealthBar',
  component: DeviceHealthBar,
  tags: ['autodocs'],
  parameters: {
    design: {
      type: 'figma',
      url: 'https://www.figma.com/file/Su3VO6yupz4yxe88fv0Uqa/Seam-Components?type=design&node-id=521-101011&mode=design&t=4OQwfRB8Mw8kT1rw-4',
    },
  },
}

export default meta

type Story = StoryObj<typeof DeviceHealthBar>

export const Content: Story = {
  render: () => {
    const [filter, setFilter] = useState<AccountFilter | DeviceFilter | null>(
      null
    )
    return (
      <Box display='grid' gap={3} gridTemplateColumns='1fr'>
        <DeviceHealthBar
          filter={null}
          onFilterSelect={() => {}}
          devices={[]}
          errorFilter={() => true}
        />
        <DeviceHealthBar
          filter={filter}
          onFilterSelect={setFilter}
          devices={[
            {
              connected_account_id: 'account_1',
              device_type: 'august_lock',
              device_id: 'dev_1',
              is_managed: true,
              custom_metadata: {},
              display_name: 'mydevice',
              location: {},
              capabilities_supported: [],
              created_at: '2023-05-08T22:38:30.963Z',
              workspace_id: 'workspace_1',
              space_ids: [],
              properties: {
                name: 'mydevice',
                online: true,
                model: {
                  display_name: 'Pro Lock 9000',
                  manufacturer_display_name: 'August',
                },
                appearance: {
                  name: 'mydevice',
                },
              },
              errors: [
                {
                  error_code: 'account_disconnected',
                  message: 'Device account has been disconnected.',
                  created_at: '2023-05-08T22:38:30.963Z',
                  is_connected_account_error: true,
                },
              ],
              warnings: [
                {
                  warning_code: 'salto_ks_office_mode',
                  created_at: '2023-05-08T22:38:30.963Z',
                  message:
                    'Salto KS office mode is enabled. Access codes will not unlock doors. You can disable office mode in the Salto dashboard.',
                },
              ],
            },

            {
              connected_account_id: 'account_1',
              device_type: 'august_lock',
              device_id: 'dev_2',
              is_managed: true,
              capabilities_supported: [],
              created_at: '2023-05-08T22:38:30.963Z',
              workspace_id: 'workspace_1',
              space_ids: [],
              custom_metadata: {},
              display_name: 'mydevice',
              location: {},
              properties: {
                name: 'mydevice',
                online: false,
                appearance: {
                  name: 'mydevice',
                },
                model: {
                  display_name: 'Smart Lock 2nd Generation',
                  manufacturer_display_name: 'August',
                },
              },
              errors: [
                {
                  error_code: 'device_disconnected',
                  created_at: '2023-05-08T22:38:30.963Z',
                  message: 'Device has been disconnected.',
                  is_device_error: true,
                },
              ],
              warnings: [
                {
                  warning_code: 'salto_ks_office_mode',
                  created_at: '2023-05-08T22:38:30.963Z',
                  message:
                    'Salto KS office mode is enabled. Access codes will not unlock doors. You can disable office mode in the Salto dashboard.',
                },
              ],
            },
          ]}
          errorFilter={() => true}
        />
      </Box>
    )
  },
}