Skip to content

Commit 756ad50

Browse files
razor-xrazor-x
authored
Merge branch 'main' into dependabot/npm_and_yarn/store2-2.14.4
2 parents 30b2727 + 3256772 commit 756ad50

File tree

7 files changed

+196
-118
lines changed

7 files changed

+196
-118
lines changed

‎README.md‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -87,7 +87,7 @@ export function App() {
8787
<seam-device-table publishable-key="your_publishable_key"></seam-device-table>
8888
<script
8989
type="module"
90-
src="https://react.seam.co/v/4.3.1/dist/elements.js"
90+
src="https://react.seam.co/v/4.5.0/dist/elements.js"
9191
></script>
9292
</body>
9393
```
@@ -215,7 +215,7 @@ or place the following in the `<head>` tag:
215215
```html
216216
<link
217217
rel="stylesheet"
218-
href="https://react.seam.co/v/4.3.1/dist/index.min.css"
218+
href="https://react.seam.co/v/4.5.0/dist/index.min.css"
219219
/>
220220
```
221221

‎package-lock.json‎

Lines changed: 12 additions & 12 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@seamapi/react",
3-
"version": "4.3.1",
3+
"version": "4.5.0",
44
"description": "Seam Components.",
55
"type": "module",
66
"main": "index.js",
@@ -109,7 +109,7 @@
109109
"npm": ">= 9.0.0"
110110
},
111111
"peerDependencies": {
112-
"@seamapi/types": "^1.26.2",
112+
"@seamapi/types": "^1.344.3",
113113
"@types/react": "^18.0.0",
114114
"@types/react-dom": "^18.0.0",
115115
"react": "^18.0.0",
@@ -127,7 +127,7 @@
127127
}
128128
},
129129
"dependencies": {
130-
"@seamapi/http": "^1.14.0",
130+
"@seamapi/http": "^1.20.0",
131131
"@tanstack/react-query": "^5.27.5",
132132
"classnames": "^2.3.2",
133133
"luxon": "^3.3.0",
@@ -144,7 +144,7 @@
144144
"@rxfork/r2wc-react-to-web-component": "^2.4.0",
145145
"@seamapi/fake-devicedb": "^1.6.1",
146146
"@seamapi/fake-seam-connect": "^1.69.1",
147-
"@seamapi/types": "^1.292.2",
147+
"@seamapi/types": "^1.344.3",
148148
"@storybook/addon-designs": "^7.0.1",
149149
"@storybook/addon-essentials": "^7.0.2",
150150
"@storybook/addon-links": "^7.0.2",

‎src/lib/seam/components/AccessCodeDetails/AccessCodeDevice.tsx‎

Lines changed: 58 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,11 @@
1+
import { useState } from 'react'
2+
13
import { useDevice } from 'lib/seam/devices/use-device.js'
24
import { isLockDevice, type LockDevice } from 'lib/seam/locks/lock-device.js'
35
import { useToggleLock } from 'lib/seam/locks/use-toggle-lock.js'
46
import { Button } from 'lib/ui/Button.js'
57
import { DeviceImage } from 'lib/ui/device/DeviceImage.js'
8+
import { Snackbar, type SnackbarVariant } from 'lib/ui/Snackbar/Snackbar.js'
69
import { TextButton } from 'lib/ui/TextButton.js'
710

811
export function AccessCodeDevice({
@@ -49,40 +52,71 @@ function Content(props: {
4952
onSelectDevice: (deviceId: string) => void
5053
}): JSX.Element {
5154
const { device, disableLockUnlock, onSelectDevice } = props
52-
const toggleLock = useToggleLock()
55+
const [snackbarVisible, setSnackbarVisible] = useState(false)
56+
const [snackbarVariant, setSnackbarVariant] =
57+
useState<SnackbarVariant>('success')
58+
59+
const toggleLock = useToggleLock({
60+
onSuccess: () => {
61+
setSnackbarVisible(true)
62+
setSnackbarVariant('success')
63+
},
64+
onError: () => {
65+
setSnackbarVisible(true)
66+
setSnackbarVariant('error')
67+
},
68+
})
5369

5470
const toggleLockLabel = device.properties.locked ? t.unlock : t.lock
5571

5672
return (
57-
<div className='seam-access-code-device'>
58-
<div className='seam-device-image'>
59-
<DeviceImage device={device} />
60-
</div>
61-
<div className='seam-body'>
62-
<div>{device.properties.name}</div>
63-
<TextButton
64-
onClick={() => {
65-
onSelectDevice(device.device_id)
66-
}}
67-
>
68-
{t.deviceDetails}
69-
</TextButton>
73+
<>
74+
<Snackbar
75+
variant={snackbarVariant}
76+
visible={snackbarVisible}
77+
onClose={() => {
78+
setSnackbarVisible(false)
79+
}}
80+
message={
81+
snackbarVariant === 'success'
82+
? t.successfullyUpdated
83+
: t.failedToUpdate
84+
}
85+
autoDismiss
86+
/>
87+
88+
<div className='seam-access-code-device'>
89+
<div className='seam-device-image'>
90+
<DeviceImage device={device} />
91+
</div>
92+
<div className='seam-body'>
93+
<div>{device.properties.name}</div>
94+
<TextButton
95+
onClick={() => {
96+
onSelectDevice(device.device_id)
97+
}}
98+
>
99+
{t.deviceDetails}
100+
</TextButton>
101+
</div>
102+
{!disableLockUnlock && device.properties.online && (
103+
<Button
104+
onClick={() => {
105+
toggleLock.mutate(device)
106+
}}
107+
>
108+
{toggleLockLabel}
109+
</Button>
110+
)}
70111
</div>
71-
{!disableLockUnlock && device.properties.online && (
72-
<Button
73-
onClick={() => {
74-
toggleLock.mutate(device)
75-
}}
76-
>
77-
{toggleLockLabel}
78-
</Button>
79-
)}
80-
</div>
112+
</>
81113
)
82114
}
83115

84116
const t = {
85117
deviceDetails: 'Device details',
86118
unlock: 'Unlock',
87119
lock: 'Lock',
120+
successfullyUpdated: 'Lock status has been successfully updated',
121+
failedToUpdate: 'Failed to update lock status',
88122
}

0 commit comments

Comments
 (0)