normalized the caster to return always non-null value and fixed minor ui issues

ui/src/components/base/FilterAutocompleteInput.svelte

@@ -96,6 +96,8 @@
                 readOnlyCompartment.reconfigure(EditorState.readOnly.of(disabled)),
             ],
         });
+
+        triggerNativeChange();
     }
 
     $: if (editor && value != editor.state.doc.toString()) {
@@ -228,7 +230,7 @@
             return null;
         }
 
-        let options = [{ label: "null" }, { label: "false" }, { label: "true" }];
+        let options = [{ label: "false" }, { label: "true" }];
 
         if (!disableIndirectCollectionsKeys) {
             options.push({ label: "@collection.*", apply: "@collection." });

ui/src/components/base/PreviewPopup.svelte

@@ -26,11 +26,19 @@
     }
 </script>
 
-<OverlayPanel bind:this={panel} class="image-preview" popup on:show on:hide>
+<OverlayPanel bind:this={panel} class="image-preview" btnClose={false} popup on:show on:hide>
+    <svelte:fragment slot="header">
+        <div class="overlay-close" on:click|preventDefault={hide}>
+            <i class="ri-close-line" />
+        </div>
+    </svelte:fragment>
+
     <img src={url} alt="Preview" />
 
     <svelte:fragment slot="footer">
-        <a href={url} class="link-hint txt-ellipsis">/../{url.substring(url.lastIndexOf("/") + 1)}</a>
+        <a href={url} title="Download" class="link-hint txt-ellipsis">
+            /../{url.substring(url.lastIndexOf("/") + 1)}
+        </a>
         <div class="flex-fill" />
         <button type="button" class="btn btn-secondary" on:click={hide}>Close</button>
     </svelte:fragment>

ui/src/components/base/RefreshButton.svelte

@@ -44,7 +44,7 @@
             transform: rotate(180deg);
         }
     }
-    .btn.refreshing i:before {
-        animation: refresh 200ms linear;
+    .btn.refreshing i {
+        animation: refresh 200ms ease-out;
     }
 </style>