SYNC: Merge branch 'feature/firestore'

packages/web/src/forms/FormFileInputField.svelte

@@ -0,0 +1,58 @@
+<script lang="ts">
+  import SimpleFilesInput, { ProcessedFile } from '../impexp/SimpleFilesInput.svelte';
+  import { parseFileAsString } from '../utility/parseFileAsString';
+  import { getFormContext } from './FormProviderCore.svelte';
+  import { createEventDispatcher } from 'svelte';
+
+  export let label: string;
+  export let buttonLabel: string = 'Choose File';
+  export let name: string;
+  export let disabled: boolean = false;
+  export let accept: string = '.json,application/json';
+  export let templateProps = {};
+
+  const { template, setFieldValue, values } = getFormContext();
+  const dispatch = createEventDispatcher();
+
+  let fileName: string | null = null;
+  $: hasValue = $values?.[name] != null;
+  $: displayLabel = getDisplayLabel(buttonLabel, hasValue, fileName);
+
+  async function handleFileChange(fileData: ProcessedFile): Promise<void> {
+    const parseResult = await parseFileAsString(fileData.file);
+
+    if (parseResult.success) {
+      fileName = fileData.name;
+      setFieldValue(name, parseResult.data);
+      dispatch('change', {
+        success: true,
+        data: parseResult.data,
+        fileName: fileData.name,
+      });
+    } else {
+      fileName = null;
+      setFieldValue(name, null);
+      dispatch('change', {
+        success: false,
+        error: parseResult.error,
+        fileName: fileData.name,
+      });
+    }
+  }
+
+  function getDisplayLabel(baseLabel: string, hasValue: boolean, fileName: string | null): string {
+    if (!hasValue) {
+      return baseLabel;
+    }
+
+    if (fileName) {
+      return `${baseLabel} (${fileName})`;
+    }
+
+    return `${baseLabel} (JSON loaded)`;
+  }
+</script>
+
+<svelte:component this={template} type="file" {label} {disabled} {...templateProps}>
+  <SimpleFilesInput label={displayLabel} {accept} {disabled} onChange={handleFileChange} {...$$restProps} />
+</svelte:component>

packages/web/src/settings/ConnectionDriverFields.svelte

@@ -18,9 +18,7 @@
   import FormDropDownTextField from '../forms/FormDropDownTextField.svelte';
   import { getConnectionLabel } from 'dbgate-tools';
   import { _t } from '../translations';
-  import FilesInput from '../impexp/FilesInput.svelte';
-  import SimpleFilesInput from '../impexp/SimpleFilesInput.svelte';
-  import FormJsonFileInputField from '../forms/FormJsonFileInputField.svelte';
+  import FormFileInputField from '../forms/FormFileInputField.svelte';
 
   export let getDatabaseList;
   export let currentConnection;
@@ -465,8 +463,8 @@
   />
 {/if}
 
-{#if driver?.showConnectionField('certificateJson', $values, showConnectionFieldArgs)}
-  <FormJsonFileInputField disabled={isConnected} label="Service account key JSON" name="certificateJson" />
+{#if driver?.showConnectionField('connectionDefinition', $values, showConnectionFieldArgs)}
+  <FormFileInputField disabled={isConnected} label="Service account key JSON" name="connectionDefinition" />
 {/if}
 
 {#if driver}

packages/web/src/utility/parseFileAsJson.js

@@ -1,26 +1,3 @@
-/**
- * @template [T = any]
- * @typedef {Object} FileParseResultSuccess
- * @property {true} success
- * @property {T} data
- */
-
-/**
- * @typedef {Object} FileParseResultError
- * @property {false} success
- * @property {string} error
- */
-
-/**
- * @template [T = any]
- * @typedef {FileParseResultSuccess<T> | FileParseResultError} FileParseResult
- */
-
-/**
- * @template [T = any]
- * @param {File} file
- * @returns {Promise<FileParseResult<T>>}
- */
 export async function parseFileAsJson(file) {
   try {
     const text = await file.text();

packages/web/src/utility/parseFileAsString.js

@@ -0,0 +1,15 @@
+export async function parseFileAsString(file) {
+  try {
+    const text = await file.text();
+    const data = text;
+    return {
+      success: true,
+      data,
+    };
+  } catch (error) {
+    return {
+      success: false,
+      error: error instanceof Error ? error.message : 'Unknown parsing error',
+    };
+  }
+}