add update call

Author: kadiryazici

src/lib/seam/components/DeviceDetails/DeviceDetails.tsx

@@ -1,3 +1,4 @@
+
 import {
   type CommonProps,
   withRequiredCommonProps,
@@ -9,19 +10,18 @@ import { useDevice } from 'lib/seam/devices/use-device.js'
 import { isLockDevice } from 'lib/seam/locks/lock-device.js'
 import { isNoiseSensorDevice } from 'lib/seam/noise-sensors/noise-sensor-device.js'
 import { isThermostatDevice } from 'lib/seam/thermostats/thermostat-device.js'
+import { useSeamClient } from 'lib/seam/use-seam-client.js'
 import { useComponentTelemetry } from 'lib/telemetry/index.js'
 
 export interface DeviceDetailsProps extends CommonProps {
   deviceId: string
 }
 
 export const NestedDeviceDetails = withRequiredCommonProps(DeviceDetails)
-
 export interface NestedSpecificDeviceDetailsProps
   extends Required<Omit<CommonProps, 'onBack' | 'className'>> {
   onBack: (() => void) | undefined
   className: string | undefined
-  onEditName?: (newName: string) => void
 }
 
 export function DeviceDetails({
@@ -39,10 +39,24 @@ export function DeviceDetails({
 }: DeviceDetailsProps): JSX.Element | null {
   useComponentTelemetry('DeviceDetails')
 
-  const { device } = useDevice({
+  const { client } = useSeamClient();
+  const { device, refetch: refetchDevice } = useDevice({
     device_id: deviceId,
   })
 
+
+  const updateDeviceName = async (newName: string): Promise<void> => {
+    if (client == null) return;
+
+    client.devices.update({
+      device_id: deviceId,
+      name: newName,
+    })
+      .then(async () => await refetchDevice())
+      .catch((error) => { console.error(error); })
+
+  }
+
   if (device == null) {
     return null
   }
@@ -64,7 +78,7 @@ export function DeviceDetails({
     return (
       <LockDeviceDetails
         device={device}
-        onEditName={props.onEditName}
+        onEditName={updateDeviceName}
         {...props}
       />
     )
@@ -74,7 +88,7 @@ export function DeviceDetails({
     return (
       <ThermostatDeviceDetails
         device={device}
-        onEditName={props.onEditName}
+        onEditName={updateDeviceName}
         {...props}
       />
     )
@@ -84,7 +98,7 @@ export function DeviceDetails({
     return (
       <NoiseSensorDeviceDetails
         device={device}
-        onEditName={props.onEditName}
+        onEditName={updateDeviceName}
         {...props}
       />
     )

src/lib/seam/components/DeviceDetails/ThermostatDeviceDetails.tsx

@@ -29,6 +29,7 @@ import { ThermostatCard } from 'lib/ui/thermostat/ThermostatCard.js'
 interface ThermostatDeviceDetailsProps
   extends NestedSpecificDeviceDetailsProps {
   device: ThermostatDevice
+  onEditName?: (newName: string) => void
 }
 
 export function ThermostatDeviceDetails({
@@ -37,6 +38,7 @@ export function ThermostatDeviceDetails({
   disableConnectedAccountInformation,
   onBack,
   className,
+  onEditName
 }: ThermostatDeviceDetailsProps): JSX.Element | null {
   if (device == null) {
     return null
@@ -47,7 +49,7 @@ export function ThermostatDeviceDetails({
       <ContentHeader title={t.thermostat} onBack={onBack} />
 
       <div className='seam-body'>
-        <ThermostatCard device={device} />
+        <ThermostatCard device={device} onEditName={onEditName} />
 
         <div className='seam-thermostat-device-details'>
           <DetailSectionGroup>
@@ -233,7 +235,7 @@ function ClimateSettingRow({
       }
     }
 
-    return () => {}
+    return () => { }
   }, [isHeatCoolSuccess, isHeatSuccess, isCoolSuccess, isSetOffSuccess])
 
   return (
@@ -273,7 +275,7 @@ function ClimateSettingRow({
               delta={
                 Number(
                   'min_heating_cooling_delta_fahrenheit' in device.properties &&
-                    device.properties.min_heating_cooling_delta_fahrenheit
+                  device.properties.min_heating_cooling_delta_fahrenheit
                 ) ?? 0
               }
             />