Rename SeamEditableDeviceName to EditableDeviceName

Author: razor-x

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

@@ -6,14 +6,14 @@ import { NestedAccessCodeTable } from 'lib/seam/components/AccessCodeTable/Acces
 import type { NestedSpecificDeviceDetailsProps } from 'lib/seam/components/DeviceDetails/DeviceDetails.js'
 import { DeviceInfo } from 'lib/seam/components/DeviceDetails/DeviceInfo.js'
 import { DeviceModel } from 'lib/seam/components/DeviceDetails/DeviceModel.js'
-import { SeamEditableDeviceName } from 'lib/seam/components/SeamEditableDeviceName/SeamEditableDeviceName.js'
 import { deviceErrorFilter, deviceWarningFilter } from 'lib/seam/filters.js'
 import type { LockDevice } from 'lib/seam/locks/lock-device.js'
 import { useToggleLock } from 'lib/seam/locks/use-toggle-lock.js'
 import { Alerts } from 'lib/ui/Alert/Alerts.js'
 import { Button } from 'lib/ui/Button.js'
 import { BatteryStatusIndicator } from 'lib/ui/device/BatteryStatusIndicator.js'
 import { DeviceImage } from 'lib/ui/device/DeviceImage.js'
+import { EditableDeviceName } from 'lib/ui/device/EditableDeviceName.js'
 import { OnlineStatus } from 'lib/ui/device/OnlineStatus.js'
 import { ContentHeader } from 'lib/ui/layout/ContentHeader.js'
 import { useToggle } from 'lib/ui/use-toggle.js'
@@ -98,7 +98,7 @@ export function LockDeviceDetails({
             </div>
             <div className='seam-info'>
               <span className='seam-label'>{t.device}</span>
-              <SeamEditableDeviceName
+              <EditableDeviceName
                 tagName='h4'
                 value={device.properties.name}
                 className='seam-device-name'

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

@@ -4,9 +4,9 @@ import { useState } from 'react'
 import type { NestedSpecificDeviceDetailsProps } from 'lib/seam/components/DeviceDetails/DeviceDetails.js'
 import { DeviceInfo } from 'lib/seam/components/DeviceDetails/DeviceInfo.js'
 import { DeviceModel } from 'lib/seam/components/DeviceDetails/DeviceModel.js'
-import { SeamEditableDeviceName } from 'lib/seam/components/SeamEditableDeviceName/SeamEditableDeviceName.js'
 import type { NoiseSensorDevice } from 'lib/seam/noise-sensors/noise-sensor-device.js'
 import { DeviceImage } from 'lib/ui/device/DeviceImage.js'
+import { EditableDeviceName } from 'lib/ui/device/EditableDeviceName.js'
 import { NoiseLevelStatus } from 'lib/ui/device/NoiseLevelStatus.js'
 import { OnlineStatus } from 'lib/ui/device/OnlineStatus.js'
 import { ContentHeader } from 'lib/ui/layout/ContentHeader.js'
@@ -48,7 +48,7 @@ export function NoiseSensorDeviceDetails({
               </div>
               <div className='seam-info'>
                 <span className='seam-label'>{t.noiseSensor}</span>
-                <SeamEditableDeviceName
+                <EditableDeviceName
                   onEdit={onEditName}
                   tagName='h4'
                   value={device.properties.name}

…bleDeviceName/SeamEditableDeviceName.tsx src/lib/ui/device/EditableDeviceName.tsxsrc/lib/seam/components/SeamEditableDeviceName/SeamEditableDeviceName.tsx renamed to src/lib/ui/device/EditableDeviceName.tsx src/lib/seam/components/SeamEditableDeviceName/SeamEditableDeviceName.tsx renamed to src/lib/ui/device/EditableDeviceName.tsx

@@ -12,13 +12,6 @@ import { CheckIcon } from 'lib/icons/Check.js'
 import { CloseIcon } from 'lib/icons/Close.js'
 import { EditIcon } from 'lib/icons/Edit.js'
 
-export type SeamDeviceNameProps = {
-  onEdit?: (newName: string) => void
-  editable?: boolean
-  tagName?: string
-  value: string
-} & HTMLAttributes<HTMLElement>
-
 function IconButton(
   props: PropsWithChildren<HTMLAttributes<HTMLButtonElement>>
 ): JSX.Element {
@@ -61,13 +54,20 @@ const isValidName = (name: string): Result => {
   } as const
 }
 
-export function SeamEditableDeviceName({
+type EditableDeviceNameProps = {
+  onEdit?: (newName: string) => void
+  editable?: boolean
+  tagName?: string
+  value: string
+} & HTMLAttributes<HTMLElement>
+
+export function EditableDeviceName({
   onEdit,
   editable = true,
   tagName,
   value,
   ...props
-}: SeamDeviceNameProps): JSX.Element {
+}: EditableDeviceNameProps): JSX.Element {
   const [editing, setEditing] = useState(false)
   const [errorText, setErrorText] = useState<null | string>(null)
   const [currentValue, setCurrentValue] = useState(value)

src/lib/ui/thermostat/ThermostatCard.tsx

@@ -3,9 +3,9 @@ import { useState } from 'react'
 
 import { FanIcon } from 'lib/icons/Fan.js'
 import { OffIcon } from 'lib/icons/Off.js'
-import { SeamEditableDeviceName } from 'lib/seam/components/SeamEditableDeviceName/SeamEditableDeviceName.js'
 import type { ThermostatDevice } from 'lib/seam/thermostats/thermostat-device.js'
 import { DeviceImage } from 'lib/ui/device/DeviceImage.js'
+import { EditableDeviceName } from 'lib/ui/device/EditableDeviceName.js'
 import { ClimateSettingStatus } from 'lib/ui/thermostat/ClimateSettingStatus.js'
 import { Temperature } from 'lib/ui/thermostat/Temperature.js'
 
@@ -52,7 +52,7 @@ function Content(props: ThermostatCardProps): JSX.Element | null {
       </div>
       <div className='seam-thermostat-card-details'>
         <div className='seam-thermostat-heading-wrap'>
-          <SeamEditableDeviceName
+          <EditableDeviceName
             value={device.properties.name}
             tagName='h4'
             className='seam-thermostat-card-heading'