@seamapi/react 3.1.1 → 4.0.0-beta.1

package/src/lib/seam/thermostats/climate-setting-schedules/use-climate-setting-schedule.ts

@@ -1,34 +0,0 @@
-import type {
-  SeamHttpApiError,
-  ThermostatsClimateSettingSchedulesGetParams,
-} from '@seamapi/http/connect'
-import type { ClimateSettingSchedule } from '@seamapi/types/connect'
-import { useQuery } from '@tanstack/react-query'
-
-import { useSeamClient } from 'lib/seam/use-seam-client.js'
-import type { UseSeamQueryResult } from 'lib/seam/use-seam-query-result.js'
-
-export type UseClimateSettingScheduleParams =
-  ThermostatsClimateSettingSchedulesGetParams
-
-export type UseClimateSettingScheduleData = ClimateSettingSchedule | null
-
-export function useClimateSettingSchedule(
-  params: UseClimateSettingScheduleParams
-): UseSeamQueryResult<'climateSettingSchedule', UseClimateSettingScheduleData> {
-  const { client } = useSeamClient()
-
-  const { data, ...rest } = useQuery<
-    UseClimateSettingScheduleData,
-    SeamHttpApiError
-  >({
-    enabled: client != null,
-    queryKey: ['thermostats', 'climate_setting_schedules', 'get', params],
-    queryFn: async () => {
-      if (client == null) return null
-      return await client.thermostats.climateSettingSchedules.get(params)
-    },
-  })
-
-  return { ...rest, climateSettingSchedule: data }
-}

package/src/lib/seam/thermostats/climate-setting-schedules/use-climate-setting-schedules.ts

@@ -1,53 +0,0 @@
-import type {
-  SeamHttpApiError,
-  ThermostatsClimateSettingSchedulesListParams,
-} from '@seamapi/http/connect'
-import type { ClimateSettingSchedule } from '@seamapi/types/connect'
-import { useQuery, useQueryClient } from '@tanstack/react-query'
-
-import { useSeamClient } from 'lib/seam/use-seam-client.js'
-import type { UseSeamQueryResult } from 'lib/seam/use-seam-query-result.js'
-
-export type UseClimateSettingSchedulesParams =
-  ThermostatsClimateSettingSchedulesListParams
-
-export type UseClimateSettingSchedulesData = ClimateSettingSchedule[]
-
-export function useClimateSettingSchedules(
-  params: UseClimateSettingSchedulesParams
-): UseSeamQueryResult<
-  'climateSettingSchedules',
-  UseClimateSettingSchedulesData
-> {
-  const { client } = useSeamClient()
-  const queryClient = useQueryClient()
-
-  const { data, ...rest } = useQuery<
-    UseClimateSettingSchedulesData,
-    SeamHttpApiError
-  >({
-    enabled: client != null,
-    queryKey: ['thermostats', 'climate_setting_schedules', 'list', params],
-    queryFn: async () => {
-      if (client == null) return []
-      const climateSettingSchedules =
-        await client.thermostats.climateSettingSchedules.list(params)
-      for (const schedule of climateSettingSchedules) {
-        queryClient.setQueryData(
-          [
-            'thermostats',
-            'climate_setting_schedules',
-            'get',
-            {
-              climate_setting_schedule_id: schedule.climate_setting_schedule_id,
-            },
-          ],
-          schedule
-        )
-      }
-      return climateSettingSchedules
-    },
-  })
-
-  return { ...rest, climateSettingSchedules: data }
-}

package/src/lib/seam/thermostats/climate-setting-schedules/use-create-climate-setting-schedule.ts

@@ -1,53 +0,0 @@
-import type {
-  SeamHttpApiError,
-  ThermostatsClimateSettingSchedulesCreateBody,
-} from '@seamapi/http/connect'
-import type { ClimateSettingSchedule } from '@seamapi/types/connect'
-import {
-  useMutation,
-  type UseMutationResult,
-  useQueryClient,
-} from '@tanstack/react-query'
-
-import { NullSeamClientError, useSeamClient } from 'lib/seam/use-seam-client.js'
-
-export type UseCreateClimateSettingScheduleParams = never
-
-export type UseCreateClimateSettingScheduleData = ClimateSettingSchedule
-
-export type UseCreateClimateSettingScheduleMutationVariables =
-  ThermostatsClimateSettingSchedulesCreateBody
-
-export function useCreateClimateSettingSchedule(): UseMutationResult<
-  UseCreateClimateSettingScheduleData,
-  SeamHttpApiError,
-  UseCreateClimateSettingScheduleMutationVariables
-> {
-  const { client } = useSeamClient()
-  const queryClient = useQueryClient()
-
-  return useMutation<
-    UseCreateClimateSettingScheduleData,
-    SeamHttpApiError,
-    UseCreateClimateSettingScheduleMutationVariables
-  >({
-    mutationFn: async (variables) => {
-      if (client === null) throw new NullSeamClientError()
-      return await client.thermostats.climateSettingSchedules.create(variables)
-    },
-    onSuccess: (data) => {
-      queryClient.setQueryData(
-        [
-          'thermostats',
-          'climate_setting_schedules',
-          'get',
-          { climate_setting_schedules: data.climate_setting_schedule_id },
-        ],
-        data
-      )
-      void queryClient.invalidateQueries({
-        queryKey: ['thermostats', 'climate_setting_schedules', 'list'],
-      })
-    },
-  })
-}

package/src/lib/seam/thermostats/climate-setting-schedules/use-delete-climate-setting-schedule.ts

@@ -1,51 +0,0 @@
-import type {
-  SeamHttpApiError,
-  ThermostatsClimateSettingSchedulesDeleteParams,
-} from '@seamapi/http/connect'
-import {
-  useMutation,
-  type UseMutationResult,
-  useQueryClient,
-} from '@tanstack/react-query'
-
-import { NullSeamClientError, useSeamClient } from 'lib/seam/use-seam-client.js'
-
-export type UseDeleteClimateSettingScheduleParams = never
-
-export type UseDeleteClimateSettingScheduleData = undefined
-
-export type UseDeleteClimateSettingScheduleMutationVariables =
-  ThermostatsClimateSettingSchedulesDeleteParams
-
-export function useDeleteClimateSettingSchedule(): UseMutationResult<
-  UseDeleteClimateSettingScheduleData,
-  SeamHttpApiError,
-  UseDeleteClimateSettingScheduleMutationVariables
-> {
-  const { client } = useSeamClient()
-  const queryClient = useQueryClient()
-
-  return useMutation<
-    UseDeleteClimateSettingScheduleData,
-    SeamHttpApiError,
-    UseDeleteClimateSettingScheduleMutationVariables
-  >({
-    mutationFn: async (variables) => {
-      if (client === null) throw new NullSeamClientError()
-      await client.thermostats.climateSettingSchedules.delete(variables)
-    },
-    onSuccess: (_data, variables) => {
-      void queryClient.invalidateQueries({
-        queryKey: [
-          'thermostats',
-          'climate_setting_schedules',
-          'get',
-          { climate_setting_schedules: variables.climate_setting_schedule_id },
-        ],
-      })
-      void queryClient.invalidateQueries({
-        queryKey: ['thermostats', 'climate_setting_schedules', 'list'],
-      })
-    },
-  })
-}

package/src/lib/seam/thermostats/climate-setting-schedules/use-update-climate-setting-schedule.ts

@@ -1,83 +0,0 @@
-import type {
-  SeamHttpApiError,
-  ThermostatsClimateSettingSchedulesUpdateBody,
-} from '@seamapi/http/connect'
-import type { ClimateSettingSchedule } from '@seamapi/types/connect'
-import {
-  useMutation,
-  type UseMutationResult,
-  useQueryClient,
-} from '@tanstack/react-query'
-
-import { shake } from 'lib/object.js'
-import { NullSeamClientError, useSeamClient } from 'lib/seam/use-seam-client.js'
-
-export type UseUpdateClimateSettingScheduleParams = never
-
-export type UseUpdateClimateSettingScheduleData = undefined
-
-export type UseUpdateClimateSettingScheduleMutationVariables =
-  ThermostatsClimateSettingSchedulesUpdateBody
-
-export function useUpdateClimateSettingSchedule(): UseMutationResult<
-  UseUpdateClimateSettingScheduleData,
-  SeamHttpApiError,
-  UseUpdateClimateSettingScheduleMutationVariables
-> {
-  const { client } = useSeamClient()
-  const queryClient = useQueryClient()
-
-  return useMutation<
-    UseUpdateClimateSettingScheduleData,
-    SeamHttpApiError,
-    UseUpdateClimateSettingScheduleMutationVariables
-  >({
-    mutationFn: async (variables) => {
-      if (client === null) throw new NullSeamClientError()
-      await client.thermostats.climateSettingSchedules.update(variables)
-    },
-    onSuccess: (_data, variables) => {
-      queryClient.setQueryData<ClimateSettingSchedule | null>(
-        [
-          'thermostats',
-          'climate_setting_schedules',
-          'get',
-          { climate_setting_schedules: variables.climate_setting_schedule_id },
-        ],
-        (climateSettingSchedule) => {
-          if (climateSettingSchedule == null) {
-            return
-          }
-
-          return {
-            ...climateSettingSchedule,
-            ...shake(variables),
-          }
-        }
-      )
-
-      queryClient.setQueryData<ClimateSettingSchedule[]>(
-        ['thermostats', 'climate_setting_schedules', 'list'],
-        (climateSettingSchedules) => {
-          if (climateSettingSchedules == null) {
-            return climateSettingSchedules
-          }
-
-          return climateSettingSchedules.map((climateSettingSchedule) => {
-            if (
-              climateSettingSchedule.climate_setting_schedule_id ===
-              variables.climate_setting_schedule_id
-            ) {
-              return {
-                ...climateSettingSchedule,
-                ...shake(variables),
-              }
-            }
-
-            return climateSettingSchedule
-          })
-        }
-      )
-    },
-  })
-}

package/src/lib/seam/thermostats/use-update-thermostat.ts

@@ -1,90 +0,0 @@
-import type {
-  SeamHttpApiError,
-  ThermostatsUpdateBody,
-} from '@seamapi/http/connect'
-import type { Device } from '@seamapi/types/connect'
-import {
-  useMutation,
-  type UseMutationResult,
-  useQueryClient,
-} from '@tanstack/react-query'
-
-import { shake } from 'lib/object.js'
-import { NullSeamClientError, useSeamClient } from 'lib/seam/use-seam-client.js'
-
-export type UseUpdateThermostatParams = never
-
-export type UseUpdateThermostatData = undefined
-
-export type UseUpdateThermostatMutationVariables = ThermostatsUpdateBody
-
-export function useUpdateThermostat(): UseMutationResult<
-  UseUpdateThermostatData,
-  SeamHttpApiError,
-  UseUpdateThermostatMutationVariables
-> {
-  const { client } = useSeamClient()
-  const queryClient = useQueryClient()
-
-  return useMutation<
-    UseUpdateThermostatData,
-    SeamHttpApiError,
-    UseUpdateThermostatMutationVariables
-  >({
-    mutationFn: async (variables) => {
-      if (client === null) throw new NullSeamClientError()
-      await client.thermostats.update(variables)
-    },
-    onSuccess: (_data, variables) => {
-      queryClient.setQueryData<Device | null>(
-        ['devices', 'get', { device_id: variables.device_id }],
-        (device) => {
-          if (device == null) {
-            return
-          }
-          return getUpdatedDevice(device, variables)
-        }
-      )
-
-      queryClient.setQueryData<Device[]>(
-        ['devices', 'list', { device_id: variables.device_id }],
-        (devices): Device[] => {
-          if (devices == null) {
-            return []
-          }
-
-          return devices.map((device) => {
-            if (device.device_id === variables.device_id) {
-              return getUpdatedDevice(device, variables)
-            }
-
-            return device
-          })
-        }
-      )
-    },
-  })
-}
-
-const getUpdatedDevice = (
-  device: Device,
-  variables: UseUpdateThermostatMutationVariables
-): Device => {
-  const { properties } = device
-  if (
-    'default_climate_setting' in properties &&
-    properties.default_climate_setting != null
-  ) {
-    return {
-      ...device,
-      properties: {
-        ...properties,
-        default_climate_setting: {
-          ...properties.default_climate_setting,
-          ...shake(variables.default_climate_setting),
-        },
-      },
-    }
-  }
-  return device
-}

package/src/lib/ui/ClimateSettingForm/ClimateSettingScheduleForm.tsx

@@ -1,189 +0,0 @@
-import classNames from 'classnames'
-import { useEffect, useState } from 'react'
-import { useForm } from 'react-hook-form'
-
-import { getSystemTimeZone } from 'lib/dates.js'
-import { useSeamClient } from 'lib/index.js'
-import {
-  type ClimateSetting,
-  type HvacModeSetting,
-  isThermostatDevice,
-} from 'lib/seam/thermostats/thermostat-device.js'
-import { ClimateSettingScheduleFormClimateSetting } from 'lib/ui/ClimateSettingForm/ClimateSettingScheduleFormClimateSetting.js'
-import { ClimateSettingScheduleFormDefaultClimateSetting } from 'lib/ui/ClimateSettingForm/ClimateSettingScheduleFormDefaultClimateSetting.js'
-import { ClimateSettingScheduleFormDeviceSelect } from 'lib/ui/ClimateSettingForm/ClimateSettingScheduleFormDeviceSelect.js'
-import { ClimateSettingScheduleFormNameAndSchedule } from 'lib/ui/ClimateSettingForm/ClimateSettingScheduleFormNameAndSchedule.js'
-import { ClimateSettingScheduleFormTimeZonePicker } from 'lib/ui/ClimateSettingForm/ClimateSettingScheduleFormTimeZonePicker.js'
-
-export interface ClimateSettingScheduleFormSubmitData {
-  name: string
-  deviceId: string
-  startDate: string
-  endDate: string
-  timeZone: string
-  climateSetting: ClimateSetting
-}
-
-export interface ClimateSettingScheduleFormProps {
-  className?: string
-  onBack?: () => void
-  isSubmitting: boolean
-  onSubmit: (data: ClimateSettingScheduleFormSubmitData) => void
-}
-
-export interface ClimateSettingScheduleFormFields {
-  name: string
-  deviceId: string
-  startDate: string
-  endDate: string
-  timeZone: string
-  climateSetting: {
-    hvacModeSetting: HvacModeSetting
-    // may have to ignore one or the other fields here on submit
-    heatingSetPoint: number
-    coolingSetPoint: number
-  }
-}
-
-export function ClimateSettingScheduleForm({
-  className,
-  ...props
-}: ClimateSettingScheduleFormProps): JSX.Element | null {
-  return (
-    <div
-      className={classNames('seam-climate-setting-schedule-form', className)}
-    >
-      <Content {...props} />
-    </div>
-  )
-}
-
-function Content({
-  onBack,
-}: Omit<ClimateSettingScheduleFormProps, 'className'>): JSX.Element {
-  const { client } = useSeamClient()
-  const { control, watch, resetField } =
-    useForm<ClimateSettingScheduleFormFields>({
-      defaultValues: {
-        deviceId: '',
-        name: '',
-        startDate: '',
-        endDate: '',
-        timeZone: getSystemTimeZone(),
-        climateSetting: {
-          hvacModeSetting: 'heat_cool',
-          heatingSetPoint: 70,
-          coolingSetPoint: 75,
-        },
-      },
-    })
-
-  const deviceId = watch('deviceId')
-  const timeZone = watch('timeZone')
-
-  const [page, setPage] = useState<
-    | 'device_select'
-    | 'default_setting'
-    | 'name_and_schedule'
-    | 'time_zone_select'
-    | 'climate_setting'
-  >('device_select')
-
-  const returnToDeviceSelect = (): void => {
-    resetField('deviceId')
-    setPage('device_select')
-  }
-
-  useEffect(() => {
-    if (page === 'device_select' && deviceId !== '' && client != null) {
-      client.devices
-        .get({ device_id: deviceId })
-        .then((device) => {
-          if (!isThermostatDevice(device)) return
-
-          if (device.properties.default_climate_setting != null) {
-            setPage('name_and_schedule')
-            return
-          }
-
-          setPage('default_setting')
-        })
-        .catch(() => {})
-    }
-  }, [client, deviceId, page, setPage])
-
-  if (page === 'device_select') {
-    return (
-      <ClimateSettingScheduleFormDeviceSelect
-        title={t.addNewClimateSettingSchedule}
-        control={control}
-        onBack={onBack}
-      />
-    )
-  }
-
-  if (page === 'default_setting') {
-    return (
-      <ClimateSettingScheduleFormDefaultClimateSetting
-        title={t.addNewClimateSettingSchedule}
-        deviceId={deviceId}
-        onBack={returnToDeviceSelect}
-        onCancel={onBack}
-        onSave={() => {
-          setPage('name_and_schedule')
-        }}
-      />
-    )
-  }
-
-  if (page === 'name_and_schedule') {
-    return (
-      <ClimateSettingScheduleFormNameAndSchedule
-        title={t.addNewClimateSettingSchedule}
-        control={control}
-        deviceId={deviceId}
-        onBack={returnToDeviceSelect}
-        onCancel={onBack}
-        onNext={() => {
-          setPage('climate_setting')
-        }}
-        onChangeTimeZone={() => {
-          setPage('time_zone_select')
-        }}
-        timeZone={timeZone}
-      />
-    )
-  }
-
-  if (page === 'time_zone_select') {
-    return (
-      <ClimateSettingScheduleFormTimeZonePicker
-        control={control}
-        onClose={() => {
-          setPage('name_and_schedule')
-        }}
-      />
-    )
-  }
-
-  if (page === 'climate_setting') {
-    return (
-      <ClimateSettingScheduleFormClimateSetting
-        title={t.addNewClimateSettingSchedule}
-        control={control}
-        deviceId={deviceId}
-        onBack={() => {
-          setPage('name_and_schedule')
-        }}
-        onCancel={onBack}
-        onSave={() => {}}
-      />
-    )
-  }
-
-  return <></>
-}
-
-export const t = {
-  addNewClimateSettingSchedule: 'Add a climate setting schedule',
-}

package/src/lib/ui/ClimateSettingForm/ClimateSettingScheduleFormClimateSetting.tsx

@@ -1,118 +0,0 @@
-import { type Control, Controller } from 'react-hook-form'
-
-import { useDevice } from 'lib/seam/devices/use-device.js'
-import { isThermostatDevice } from 'lib/seam/thermostats/thermostat-device.js'
-import { Button } from 'lib/ui/Button.js'
-import type { ClimateSettingScheduleFormFields } from 'lib/ui/ClimateSettingForm/ClimateSettingScheduleForm.js'
-import {
-  getSetPointBounds,
-  type SetPointBounds,
-} from 'lib/ui/ClimateSettingForm/set-point-bounds.js'
-import { FormField } from 'lib/ui/FormField.js'
-import { InputLabel } from 'lib/ui/InputLabel.js'
-import { ContentHeader } from 'lib/ui/layout/ContentHeader.js'
-import { ClimateSettingControlGroup } from 'lib/ui/thermostat/ClimateSettingControlGroup.js'
-
-interface ClimateSettingScheduleFormClimateSettingProps {
-  title: string
-  control: Control<ClimateSettingScheduleFormFields>
-  deviceId: string
-  onBack: () => void
-  onCancel: (() => void) | undefined
-  onSave: () => void
-}
-
-export function ClimateSettingScheduleFormClimateSetting({
-  title,
-  control,
-  deviceId,
-  onBack,
-  onCancel,
-  onSave,
-}: ClimateSettingScheduleFormClimateSettingProps): JSX.Element {
-  const { device } = useDevice({
-    device_id: deviceId,
-  })
-
-  if (device == null) return <></>
-  if (!isThermostatDevice(device)) return <></>
-
-  const setPointBounds = getSetPointBounds(device)
-
-  return (
-    <>
-      <ContentHeader
-        title={title}
-        onBack={onBack}
-        subheading={device?.properties.name}
-      />
-      <div className='seam-main'>
-        <div className='seam-climate-setting-schedule-form-climate-setting'>
-          <div className='seam-content'>
-            <div>
-              <InputLabel>{t.climateSetting}</InputLabel>
-              <span className='seam-label'>{t.climateSettingSubHeading}</span>
-            </div>
-            <FormContent control={control} setPointBounds={setPointBounds} />
-          </div>
-        </div>
-        <div className='seam-actions'>
-          <Button onClick={onCancel}>{t.cancel}</Button>
-          <Button variant='solid' onClick={onSave}>
-            {t.save}
-          </Button>
-        </div>
-      </div>
-    </>
-  )
-}
-
-interface FormContentProps {
-  control: Control<ClimateSettingScheduleFormFields>
-  setPointBounds: SetPointBounds
-}
-
-function FormContent({
-  control,
-  setPointBounds,
-}: FormContentProps): JSX.Element {
-  return (
-    <FormField>
-      <Controller
-        name='climateSetting'
-        control={control}
-        render={({ field: { value, onChange } }) => (
-          <ClimateSettingControlGroup
-            mode={value.hvacModeSetting}
-            onModeChange={(mode) => {
-              onChange({ ...value, hvacModeSetting: mode })
-            }}
-            coolValue={value.coolingSetPoint}
-            heatValue={value.heatingSetPoint}
-            {...setPointBounds}
-            onCoolValueChange={(coolingSetPoint) => {
-              onChange({
-                ...value,
-                coolingSetPoint,
-              })
-            }}
-            onHeatValueChange={(heatingSetPoint) => {
-              onChange({
-                ...value,
-                heatingSetPoint,
-              })
-            }}
-          />
-        )}
-      />
-    </FormField>
-  )
-}
-
-const t = {
-  climateSetting: 'Climate setting',
-  climateSettingSubHeading: 'Choose mode and adjust the climate',
-  cancel: 'Cancel',
-  save: 'Save',
-  next: 'Next',
-}