Select and conditional fields

packages/builder/src/components/backend/Datasources/ConfigEditor/ConfigInput.svelte

@@ -4,11 +4,13 @@
   import LongFormField from "./fields/LongForm.svelte"
   import FieldGroupField from "./fields/FieldGroup.svelte"
   import StringField from "./fields/String.svelte"
+  import SelectField from "./fields/Select.svelte"
 
   export let type
   export let value
   export let error
   export let name
+  export let config
   export let showModal = () => {}
 
   const selectComponent = type => {
@@ -20,6 +22,8 @@
       return LongFormField
     } else if (type === "fieldGroup") {
       return FieldGroupField
+    } else if (type === "select") {
+      return SelectField
     } else {
       return StringField
     }
@@ -34,6 +38,7 @@
   {value}
   {error}
   {name}
+  {config}
   {showModal}
   on:blur
   on:change

packages/builder/src/components/backend/Datasources/ConfigEditor/fields/Select.svelte

@@ -0,0 +1,30 @@
+<script>
+  import { Label, Select } from "@budibase/bbui"
+
+  export let type
+  export let name
+  export let value
+  export let error
+  export let config
+</script>
+
+<div class="form-row">
+  <Label>{name}</Label>
+  <Select
+    on:blur
+    on:change
+    options={config.options}
+    {type}
+    value={value || undefined}
+    {error}
+  />
+</div>
+
+<style>
+  .form-row {
+    display: grid;
+    grid-template-columns: 20% 1fr;
+    grid-gap: var(--spacing-l);
+    align-items: center;
+  }
+</style>

packages/builder/src/components/backend/Datasources/ConfigEditor/index.svelte

@@ -82,13 +82,14 @@
     />
   {/if}
 
-  {#each $configStore.validatedConfig as { type, key, value, error, name, hidden }}
+  {#each $configStore.validatedConfig as { type, key, value, error, name, hidden, config }}
     {#if hidden === undefined || !eval(processStringSync(hidden, $configStore.config))}
       <ConfigInput
         {type}
         {value}
         {error}
         {name}
+        {config}
         showModal={() =>
           showModal(newValue => configStore.updateFieldValue(key, newValue))}
         on:blur={() => configStore.markFieldActive(key)}

packages/builder/src/components/backend/Datasources/ConfigEditor/stores/validatedConfig.js

@@ -102,6 +102,7 @@ export const createValidatedConfigStore = (integration, config) => {
           name: capitalise(properties.display || key),
           type: properties.type,
           hidden: properties.hidden,
+          config: properties.config,
         })
       })
 

packages/server/src/integrations/microsoftSqlServer.ts

@@ -76,6 +76,33 @@ const SCHEMA: Integration = {
       type: DatasourceFieldType.BOOLEAN,
       default: true,
     },
+    authType: {
+      type: DatasourceFieldType.SELECT,
+      config: { options: ["Active Directory"] },
+    },
+    adAuthConfig: {
+      type: DatasourceFieldType.FIELD_GROUP,
+      default: true,
+      display: "Configure Active Directory",
+      hidden: "'{{authType}}' !== 'Active Directory'",
+      fields: {
+        clientId: {
+          type: DatasourceFieldType.STRING,
+          required: false,
+          display: "Client ID",
+        },
+        clientSecret: {
+          type: DatasourceFieldType.STRING,
+          required: false,
+          display: "Client secret",
+        },
+        tenantId: {
+          type: DatasourceFieldType.STRING,
+          required: false,
+          display: "Tenant ID",
+        },
+      },
+    },
   },
   query: {
     create: {

packages/types/src/sdk/datasources.ts

@@ -36,6 +36,7 @@ export enum DatasourceFieldType {
   JSON = "json",
   FILE = "file",
   FIELD_GROUP = "fieldGroup",
+  SELECT = "select",
 }
 
 export enum SourceName {
@@ -103,15 +104,28 @@ export interface ExtraQueryConfig {
   }
 }
 
+interface DatasourceBasicFieldConfig {
+  type: DatasourceFieldType
+  display?: string
+  required?: boolean
+  default?: any
+  deprecated?: boolean
+  hidden?: string
+}
+
+interface DatasourceSelectFieldConfig extends DatasourceBasicFieldConfig {
+  type: DatasourceFieldType.SELECT
+  config: { options: string[] }
+}
+
+type DatasourceFieldConfig =
+  | DatasourceBasicFieldConfig
+  | DatasourceSelectFieldConfig
+
 export interface DatasourceConfig {
-  [key: string]: {
+  [key: string]: DatasourceFieldConfig & {
-    type: string
+    fields?: DatasourceConfig
-    display?: string
+  }
-    required?: boolean
-    default?: any
-    deprecated?: boolean
-    hidden?: string
-  } & { fields?: DatasourceConfig }
 }
 
 export interface Integration {