added Command+S quick save alias and fixed relations draft restore

ui/src/components/base/Toasts.svelte

@@ -1,5 +1,5 @@
 <script>
-    import { fade } from "svelte/transition";
+    import { fade, slide } from "svelte/transition";
     import { flip } from "svelte/animate";
     import { toasts, removeToast } from "@/stores/toasts";
 </script>
@@ -12,7 +12,8 @@
             class:alert-success={toast.type == "success"}
             class:alert-danger={toast.type == "error"}
             class:alert-warning={toast.type == "warning"}
-            transition:fade={{ duration: 150 }}
+            in:slide={{ duration: 150 }}
+            out:fade={{ duration: 150 }}
             animate:flip={{ duration: 150 }}
         >
             <div class="icon">

ui/src/components/records/RecordUpsertPanel.svelte

@@ -101,7 +101,8 @@
         isLoaded = true;
     }
 
-    function replaceOriginal(newOriginal) {
+    async function replaceOriginal(newOriginal) {
+        setErrors({}); // reset errors
         original = newOriginal || new Record();
         uploadedFilesMap = {};
         deletedFileIndexesMap = {};
@@ -115,6 +116,9 @@
             record[k] = newOriginal[k];
         }
 
+        // wait to populate the fields to get the normalized values
+        await tick();
+
         originalSerializedData = JSON.stringify(record);
 
         deleteDraft();
@@ -353,7 +357,7 @@
     }
 
     function handleFormKeydown(e) {
-        if (e.ctrlKey && e.code == "KeyS") {
+        if ((e.ctrlKey || e.metaKey) && e.code == "KeyS") {
             e.preventDefault();
             e.stopPropagation();
             save(false);

ui/src/components/records/RecordsPicker.svelte

@@ -310,7 +310,7 @@
             <span class="txt">Cancel</span>
         </button>
         <button type="button" class="btn" on:click={() => save()}>
-            <span class="txt">Save selection</span>
+            <span class="txt">Set selection</span>
         </button>
     </svelte:fragment>
 </OverlayPanel>

ui/src/components/records/fields/RelationField.svelte

@@ -23,13 +23,28 @@
         fieldRef?.changed();
     }
 
-    load();
+    $: if (needLoad(list, value)) {
+        load();
+    }
+
+    function needLoad() {
+        if (isLoading) {
+            return false;
+        }
+
+        const ids = CommonHelper.toArray(value);
+
+        list = list.filter((item) => ids.includes(item.id));
+
+        return ids.length != list.length;
+    }
 
     async function load() {
         const ids = CommonHelper.toArray(value);
 
+        list = []; // reset
+
         if (!field?.options?.collectionId || !ids.length) {
-            list = [];
             isLoading = false;
             return;
         }
@@ -100,7 +115,7 @@
 
     <div class="list">
         <div class="relations-list">
-            {#each list as record}
+            {#each list as record (record.id)}
                 <div class="list-item">
                     <div class="content">
                         <RecordInfo {record} displayFields={field.options?.displayFields} />

ui/src/utils/CommonHelper.js

@@ -1327,7 +1327,7 @@ export default class CommonHelper {
             setup: (editor) => {
                 editor.on('keydown', (e) => {
                     // propagate save shortcut to the parent
-                    if (e.ctrlKey && e.code == "KeyS" && editor.formElement) {
+                    if ((e.ctrlKey || e.metaKey) && e.code == "KeyS" && editor.formElement) {
                         e.preventDefault();
                         e.stopPropagation();
                         editor.formElement.dispatchEvent(new KeyboardEvent("keydown", e));