diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/line.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/line.svelte
index d021277a1..bfe9c12d7 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/line.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/line.svelte
@@ -15,11 +15,6 @@
 
     let { label, value = $bindable(), limited = false, column }: Props = $props();
 
-    let nullable = $state(false);
-    $effect(() => {
-        nullable = !limited ? !column.required : false;
-    });
-
     const defaultData = getDefaultSpatialData('linestring') as number[][];
     function onAddPoint() {
         value = [...(value || defaultData), getDefaultSpatialData('point') as number[]];
@@ -39,9 +34,7 @@
         value = getDefaultSpatialData('linestring') as number[][];
     }
 
-    $effect(() => {
-        nullable = !limited ? !column.required : false;
-    });
+    const nullable = $derived(!limited ? !column.required : false);
 </script>
 
 <Layout.Stack>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/point.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/point.svelte
index 7f874a158..9b0d49e29 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/point.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/point.svelte
@@ -15,8 +15,6 @@
 
     let { label, value = $bindable(), limited = false, column }: Props = $props();
 
-    let nullable = $state(false);
-
     function handlePointChange(index: number, newValue: number) {
         if (value) {
             value[index] = newValue;
@@ -27,9 +25,7 @@
         value = getDefaultSpatialData('point') as number[];
     }
 
-    $effect(() => {
-        nullable = !limited ? !column.required : false;
-    });
+    const nullable = $derived(!limited ? !column.required : false);
 </script>
 
 <Layout.Stack>
diff --git a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/polygon.svelte b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/polygon.svelte
index a979eff8e..4e204f61a 100644
--- a/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/polygon.svelte
+++ b/src/routes/(console)/project-[region]-[project]/databases/database-[database]/table-[table]/rows/columns/types/polygon.svelte
@@ -15,8 +15,6 @@
 
     let { label, value = $bindable(), limited = false, column }: Props = $props();
 
-    let nullable = $state(false);
-
     function pushCoordinate(ringIndex: number) {
         const ring = value[ringIndex];
         if (!ring) return;
@@ -59,9 +57,7 @@
         value = getDefaultSpatialData('polygon') as number[][][];
     }
 
-    $effect(() => {
-        nullable = !limited ? !column.required : false;
-    });
+    const nullable = $derived(!limited ? !column.required : false);
 </script>
 
 <Layout.Stack>