diff --git a/client/src/assets/style.scss b/client/src/assets/style.scss
index 29edc40..2e33aa6 100644
--- a/client/src/assets/style.scss
+++ b/client/src/assets/style.scss
@@ -253,6 +253,7 @@ section.content {
.settings-modal .actions {
display: flex;
align-items: center;
+ justify-content: flex-end;
}
.settings-modal .actions .remove {
diff --git a/client/src/pages/sensors/SensorsPage.tsx b/client/src/pages/sensors/SensorsPage.tsx
index 1119dae..40b0790 100644
--- a/client/src/pages/sensors/SensorsPage.tsx
+++ b/client/src/pages/sensors/SensorsPage.tsx
@@ -33,7 +33,7 @@ export const SensorsPage = () => {
{sensors.data?.map((i) => (
-
+
))}
diff --git a/client/src/pages/sensors/components/SensorFormModal.tsx b/client/src/pages/sensors/components/SensorFormModal.tsx
index 1cc9871..0974d02 100644
--- a/client/src/pages/sensors/components/SensorFormModal.tsx
+++ b/client/src/pages/sensors/components/SensorFormModal.tsx
@@ -1,7 +1,7 @@
import { createSensor, SensorInfo, updateSensor } from '@/api/sensors'
import { Modal } from '@/components/Modal'
import { useState } from 'preact/hooks'
-import { useMutation } from 'react-query'
+import { useMutation, useQueryClient } from 'react-query'
type Props = {
open: boolean
@@ -10,24 +10,31 @@ type Props = {
}
export const SensorFormModal = ({ open, onClose, sensor }: Props) => {
+ const queryClient = useQueryClient()
+ const createMutation = useMutation(createSensor)
+ const updateMutation = useMutation(updateSensor)
+
const [formState, setFormState] = useState(() => ({
name: sensor?.name ?? '',
}))
- const createMutation = useMutation(createSensor)
- const updateMutation = useMutation(updateSensor)
-
const handleSave = async (e: Event) => {
e.preventDefault()
e.stopPropagation()
- onClose()
+ if (isLoading) {
+ return
+ }
if (sensor) {
- updateMutation.mutate({ id: sensor.id, name: formState.name })
+ await updateMutation.mutateAsync({ id: sensor.id, name: formState.name })
} else {
- createMutation.mutate(formState.name)
+ await createMutation.mutateAsync(formState.name)
}
+
+ queryClient.invalidateQueries(['/sensors'])
+
+ onClose()
}
const handleChange = (e: Event) => {
@@ -39,6 +46,8 @@ export const SensorFormModal = ({ open, onClose, sensor }: Props) => {
})
}
+ const isLoading = createMutation.isLoading || updateMutation.isLoading
+
return (
diff --git a/client/src/pages/sensors/components/SensorItem.tsx b/client/src/pages/sensors/components/SensorItem.tsx
index cb69b4f..256d34a 100644
--- a/client/src/pages/sensors/components/SensorItem.tsx
+++ b/client/src/pages/sensors/components/SensorItem.tsx
@@ -4,9 +4,10 @@ import { useState } from 'preact/hooks'
type Props = {
sensor: SensorInfo
+ onEdit: (sensor: SensorInfo) => void
}
-export const SensorItem = ({ sensor }: Props) => {
+export const SensorItem = ({ sensor, onEdit }: Props) => {
const [showPassword, setShowPassword] = useState(false)
return (
@@ -25,7 +26,7 @@ export const SensorItem = ({ sensor }: Props) => {
-