fixed db url handling

packages/tools/src/getConnectionLabel.ts

@@ -12,6 +12,9 @@ function getConnectionLabelCore(connection, { allowExplicitDatabase = true } = {
   if (connection.displayName) {
     return connection.displayName;
   }
+  if (connection.useDatabaseUrl) {
+    return `${connection.databaseUrl}`;
+  }
   if (connection.singleDatabase && connection.server && allowExplicitDatabase && connection.defaultDatabase) {
     return `${connection.defaultDatabase} on ${connection.server}`;
   }
@@ -24,9 +27,6 @@ function getConnectionLabelCore(connection, { allowExplicitDatabase = true } = {
   if (connection.singleDatabase && connection.defaultDatabase) {
     return `${connection.defaultDatabase}`;
   }
-  if (connection.useDatabaseUrl) {
-    return `${connection.databaseUrl}`;
-  }
 
   return '';
 }

packages/web/src/forms/FormRadioGroupField.svelte

@@ -4,19 +4,26 @@
 
   export let options = [];
   export let name;
+  export let matchValueToOption = null;
 
   const { values, setFieldValue } = getFormContext();
 
-  let group = $values[name] ?? options.find(x => x.default)?.value;
-
-  $: setFieldValue(name, group);
-
   $: optionsWithId = options.map(x => ({ ...x, id: uuidv1() }));
+
+  function handleChange(event) {
+    setFieldValue(name, event.currentTarget.value);
+  }
 </script>
 
 {#each optionsWithId as option}
   <div>
-    <input type="radio" bind:group value={option.value} id={option.id} />
+    <input
+      type="radio"
+      checked={matchValueToOption ? matchValueToOption($values[name], option) : $values[name] == option.value}
+      on:change={handleChange}
+      value={option.value}
+      id={option.id}
+    />
     <label for={option.id}>{option.label}</label>
   </div>
 {/each}