From 2d008a5cc304fb19e9dd8a287d618291ee0fa9f4 Mon Sep 17 00:00:00 2001
From: Mo Tarbin <mhed.t91@gmail.com>
Date: Thu, 21 Aug 2025 01:39:25 -0400
Subject: [PATCH] Refactor EditThingStateModal to use ResponsiveModal for
 improved consistency

---
 src/views/Modals/Inputs/EditThingState.jsx | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/src/views/Modals/Inputs/EditThingState.jsx b/src/views/Modals/Inputs/EditThingState.jsx
index d520718..fb90e55 100644
--- a/src/views/Modals/Inputs/EditThingState.jsx
+++ b/src/views/Modals/Inputs/EditThingState.jsx
@@ -7,9 +7,11 @@ import {
   Typography,
 } from '@mui/joy'
 import { useState } from 'react'
-import FadeModal from '../../../components/common/FadeModal'
+import { useResponsiveModal } from '../../../hooks/useResponsiveModal'
 
 function EditThingStateModal({ isOpen, onClose, onSave, currentThing }) {
+  const { ResponsiveModal } = useResponsiveModal()
+
   const [state, setState] = useState(currentThing?.state || '')
   const [errors, setErrors] = useState({})
 
@@ -38,7 +40,7 @@ function EditThingStateModal({ isOpen, onClose, onSave, currentThing }) {
   }
 
   return (
-    <FadeModal open={isOpen} onClose={onClose}>
+    <ResponsiveModal open={isOpen} onClose={onClose}>
       <Typography level='h4'>Update state</Typography>
 
       <FormControl>
@@ -60,7 +62,7 @@ function EditThingStateModal({ isOpen, onClose, onSave, currentThing }) {
           {currentThing?.id ? 'Cancel' : 'Close'}
         </Button>
       </Box>
-    </FadeModal>
+    </ResponsiveModal>
   )
 }
 export default EditThingStateModal