lint ✨

6 years ago · 0ac322b11b
17 changed files with 132 additions and 105 deletions
--- a/packages/builder/src/components/automation/AutomationBuilder/BlockList.svelte
+++ b/packages/builder/src/components/automation/AutomationBuilder/BlockList.svelte
@ -50,7 +50,10 @@

  function addBlockToAutomation(stepId, blockDefinition) {
    const newBlock = $automationStore.selectedAutomation.constructBlock(
-      selectedTab, stepId, blockDefinition)
+      selectedTab,
+      stepId,
+      blockDefinition
+    )
    automationStore.actions.addBlockToAutomation(newBlock)
    closePopover()
    if (stepId === "WEBHOOK") {
--- a/packages/builder/src/components/automation/SetupPanel/SchemaSetup.svelte
+++ b/packages/builder/src/components/automation/SetupPanel/SchemaSetup.svelte
@ -36,9 +36,7 @@
 </script>

 <div class="root">
-  <div class="add-field">
-    <i class="ri-add-line" on:click={addField} />
-  </div>
+  <div class="add-field"><i class="ri-add-line" on:click={addField} /></div>
  <div class="spacer" />
  {#each fieldsArray as field}
    <div class="field">
@ -57,13 +55,11 @@
        <option>datetime</option>
      </Select>

-      <i class="remove-field ri-delete-bin-line"
+      <i
+        class="remove-field ri-delete-bin-line"
        on:click={() => removeField(field.name)} />
-
-      
    </div>
  {/each}
-
 </div>

 <style>
@ -105,7 +101,8 @@
  }

  .field :global(input) {
-    padding: var(--spacing-m) var(--spacing-xl) var(--spacing-xs) var(--spacing-m);
+    padding: var(--spacing-m) var(--spacing-xl) var(--spacing-xs)
+      var(--spacing-m);
    font-size: var(--font-size-s);
    font-weight: bold;
  }
@ -129,5 +126,4 @@
  .add-field > i {
    cursor: pointer;
  }
-
 </style>
--- a/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte
+++ b/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateDatasourceModal.svelte
@ -16,7 +16,11 @@

  function checkValid(evt) {
    const datasourceName = evt.target.value
-    if ($backendUiStore.datasources?.some(datasource => datasource.name === datasourceName)) {
+    if (
+      $backendUiStore.datasources?.some(
+        datasource => datasource.name === datasourceName
+      )
+    ) {
      error = `Datasource with name ${datasourceName} already exists. Please choose another name.`
      return
    }
@ -30,7 +34,7 @@
    const response = await backendUiStore.actions.datasources.save({
      name,
      source: type,
-      config
+      config,
    })
    notifier.success(`Datasource ${name} created successfully.`)
    analytics.captureEvent("Datasource Created", { name })
--- a/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateQueryModal.svelte
+++ b/packages/builder/src/components/backend/DatasourceNavigator/modals/CreateQueryModal.svelte
@ -16,7 +16,11 @@

  function checkValid(evt) {
    const datasourceName = evt.target.value
-    if ($backendUiStore.datasources?.some(datasource => datasource.name === datasourceName)) {
+    if (
+      $backendUiStore.datasources?.some(
+        datasource => datasource.name === datasourceName
+      )
+    ) {
      error = `Datasource with name ${tableName} already exists. Please choose another name.`
      return
    }
@ -30,7 +34,7 @@
    await backendUiStore.actions.datasources.save({
      name,
      source: type,
-      config
+      config,
    })
    notifier.success(`Datasource ${name} created successfully.`)
    analytics.captureEvent("Datasource Created", { name })
--- a/packages/builder/src/components/backend/DatasourceNavigator/popovers/EditDatasourcePopover.svelte
+++ b/packages/builder/src/components/backend/DatasourceNavigator/popovers/EditDatasourcePopover.svelte
@ -3,7 +3,7 @@
  import { notifier } from "builderStore/store/notifications"
  import { DropdownMenu, Button, Input } from "@budibase/bbui"
  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
-  import IntegrationConfigForm from "../TableIntegrationMenu//IntegrationConfigForm.svelte" 
+  import IntegrationConfigForm from "../TableIntegrationMenu//IntegrationConfigForm.svelte"
  import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"

  export let datasource
@ -36,13 +36,13 @@
    <i class="ri-more-line" />
  </div>
  <DropdownMenu align="left" {anchor} bind:this={dropdown}>
-      <DropdownContainer>
-        <DropdownItem
-          icon="ri-delete-bin-line"
-          title="Delete"
-          on:click={showModal}
-          data-cy="delete-datasource" />
-      </DropdownContainer>
+    <DropdownContainer>
+      <DropdownItem
+        icon="ri-delete-bin-line"
+        title="Delete"
+        on:click={showModal}
+        data-cy="delete-datasource" />
+    </DropdownContainer>
  </DropdownMenu>
 </div>
 <ConfirmDialog
@ -66,7 +66,7 @@
  div.icon i {
    font-size: 16px;
  }
-  
+
  .actions {
    padding: var(--spacing-xl);
    display: grid;
--- a/packages/builder/src/components/backend/DatasourceNavigator/popovers/EditQueryPopover.svelte
+++ b/packages/builder/src/components/backend/DatasourceNavigator/popovers/EditQueryPopover.svelte
@ -3,7 +3,7 @@
  import { notifier } from "builderStore/store/notifications"
  import { DropdownMenu, Button, Input } from "@budibase/bbui"
  import ConfirmDialog from "components/common/ConfirmDialog.svelte"
-  import IntegrationConfigForm from "../TableIntegrationMenu//IntegrationConfigForm.svelte" 
+  import IntegrationConfigForm from "../TableIntegrationMenu//IntegrationConfigForm.svelte"
  import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"

  export let query
@ -35,13 +35,13 @@
    <i class="ri-more-line" />
  </div>
  <DropdownMenu align="left" {anchor} bind:this={dropdown}>
-      <DropdownContainer>
-        <DropdownItem
-          icon="ri-delete-bin-line"
-          title="Delete"
-          on:click={showModal}
-          data-cy="delete-datasource" />
-      </DropdownContainer>
+    <DropdownContainer>
+      <DropdownItem
+        icon="ri-delete-bin-line"
+        title="Delete"
+        on:click={showModal}
+        data-cy="delete-datasource" />
+    </DropdownContainer>
  </DropdownMenu>
 </div>
 <ConfirmDialog
@ -49,8 +49,7 @@
  okText="Delete Query"
  onOk={deleteQuery}
  title="Confirm Deletion">
-  Are you sure you wish to delete this query?
-  This action cannot be undone.
+  Are you sure you wish to delete this query? This action cannot be undone.
 </ConfirmDialog>

 <style>
@ -64,7 +63,7 @@
  div.icon i {
    font-size: 16px;
  }
-  
+
  .actions {
    padding: var(--spacing-xl);
    display: grid;
--- a/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
+++ b/packages/builder/src/components/backend/TableNavigator/modals/CreateTableModal.svelte
@ -2,7 +2,14 @@
  import { goto } from "@sveltech/routify"
  import { backendUiStore, store } from "builderStore"
  import { notifier } from "builderStore/store/notifications"
-  import { Input, Label, ModalContent, Button, Spacer, Toggle } from "@budibase/bbui"
+  import {
+    Input,
+    Label,
+    ModalContent,
+    Button,
+    Spacer,
+    Toggle,
+  } from "@budibase/bbui"
  import TableDataImport from "../TableDataImport.svelte"
  import analytics from "analytics"
  import screenTemplates from "builderStore/store/screenTemplates"
@ -35,7 +42,7 @@
    let newTable = {
      name,
      schema: dataImport.schema || {},
-      dataImport
+      dataImport,
    }

    // Only set primary display if defined
@ -90,6 +97,7 @@
    text="Generate screens in the design section"
    bind:checked={createAutoscreens} />
  <div>
-  <Label grey extraSmall>Create Table from CSV (Optional)</Label>
-  <TableDataImport bind:dataImport />
+    <Label grey extraSmall>Create Table from CSV (Optional)</Label>
+    <TableDataImport bind:dataImport />
+  </div>
 </ModalContent>
--- a/packages/builder/src/components/common/NavItem.svelte
+++ b/packages/builder/src/components/common/NavItem.svelte
@ -32,9 +32,7 @@

    <slot name="icon" />
    {#if icon}
-      <div class="icon">
-        <i class={icon} />
-      </div>
+      <div class="icon"><i class={icon} /></div>
    {/if}
    <div class="text">{text}</div>
    {#if withActions}
--- a/packages/builder/src/components/integration/QueryFieldsBuilder.svelte
+++ b/packages/builder/src/components/integration/QueryFieldsBuilder.svelte
@ -5,7 +5,7 @@
    Label,
    Input,
    Heading,
-    Select
+    Select,
  } from "@budibase/bbui"
  import Editor from "./QueryEditor.svelte"

@ -32,7 +32,7 @@
        type={schema.fields[field]?.type}
        required={schema.fields[field]?.required}
        bind:value={fields[field]} />
-      </div>
+    </div>
  {/each}
 </form>
 <Label extraSmall grey>Data</Label>
@ -45,13 +45,12 @@
    value={fields.customData} />
 {/if}

-
 <style>
-.field {
-  margin-bottom: var(--spacing-m);
-  display: grid;
-  grid-template-columns: 1fr 2%;
-  grid-gap: var(--spacing-m);
-  align-items: center;
-}
-</style>
+  .field {
+    margin-bottom: var(--spacing-m);
+    display: grid;
+    grid-template-columns: 1fr 2%;
+    grid-gap: var(--spacing-m);
+    align-items: center;
+  }
+</style>
--- a/packages/builder/src/components/integration/QueryParameterBuilder.svelte
+++ b/packages/builder/src/components/integration/QueryParameterBuilder.svelte
@ -61,7 +61,6 @@
      Add Parameter
    </Button>
  {/if}
-
 </section>

 <style>
--- a/packages/builder/src/components/integration/QueryViewer.svelte
+++ b/packages/builder/src/components/integration/QueryViewer.svelte
@ -57,7 +57,7 @@
  )

  $: datasourceType = datasource?.source
-  
+
  $: config = $backendUiStore.integrations[datasourceType]?.query

  $: shouldShowQueryConfig = config && query.queryVerb && query.queryType
@ -158,8 +158,7 @@
      <IntegrationQueryEditor
        {query}
        schema={config[query.queryVerb][query.queryType]}
-        bind:parameters
-      />
+        bind:parameters />

      <Spacer medium />

--- a/packages/builder/src/components/userInterface/EventsEditor/EventEditor.svelte
+++ b/packages/builder/src/components/userInterface/EventsEditor/EventEditor.svelte
@ -75,7 +75,8 @@
        <div class="action-container">
          <div class="action-header" on:click={selectAction(action)}>
            <span class:selected={action === selectedAction}>
-              {index + 1}. {action[EVENT_TYPE_KEY]}
+              {index + 1}.
+              {action[EVENT_TYPE_KEY]}
            </span>
          </div>
          <i
--- a/packages/builder/src/components/userInterface/EventsEditor/actions/SaveFields.svelte
+++ b/packages/builder/src/components/userInterface/EventsEditor/actions/SaveFields.svelte
@ -1,6 +1,13 @@
 <script>
  // accepts an array of field names, and outputs an object of { FieldName: value }
-  import { DataList, Label, TextButton, Spacer, Select, Input } from "@budibase/bbui"
+  import {
+    DataList,
+    Label,
+    TextButton,
+    Spacer,
+    Select,
+    Input,
+  } from "@budibase/bbui"
  import { store, backendUiStore, currentAsset } from "builderStore"
  import fetchBindableProperties from "builderStore/fetchBindableProperties"
  import { CloseCircleIcon, AddIcon } from "components/common/Icons"
@ -14,7 +21,7 @@

  export let parameterFields
  export let schemaFields
-  export let fieldLabel="Column"
+  export let fieldLabel = "Column"

  const emptyField = () => ({ name: "", value: "" })

@ -60,7 +67,9 @@
        // value and type is needed by the client, so it can parse
        // a string into a correct type
        newParameterFields[field.name] = {
-          type: schemaFields ? schemaFields.find(f => f.name === field.name).type : "string",
+          type: schemaFields
+            ? schemaFields.find(f => f.name === field.name).type
+            : "string",
          value: readableToRuntimeBinding(bindableProperties, field.value),
        }
      }
@ -83,7 +92,7 @@
        {/each}
      </Select>
    {:else}
-      <Input secondary bind:value={field.name} on:blur={rebuildParameters}/> 
+      <Input secondary bind:value={field.name} on:blur={rebuildParameters} />
    {/if}
    <Label size="m" color="dark">Value</Label>
    <DataList secondary bind:value={field.value} on:blur={rebuildParameters}>
@ -105,7 +114,8 @@
    <Spacer small />

    <TextButton text small blue on:click={addField}>
-      Add {fieldLabel}
+      Add
+      {fieldLabel}
      <div style="height: 20px; width: 20px;">
        <AddIcon />
      </div>
--- a/packages/builder/src/components/userInterface/EventsEditor/actions/TriggerAutomation.svelte
+++ b/packages/builder/src/components/userInterface/EventsEditor/actions/TriggerAutomation.svelte
@ -5,12 +5,14 @@

  const AUTOMATION_STATUS = {
    NEW: "new",
-    EXISTING: "existing"
+    EXISTING: "existing",
  }

  export let parameters = {}

-  let automationStatus = parameters.automationId ? AUTOMATION_STATUS.EXISTING : AUTOMATION_STATUS.NEW
+  let automationStatus = parameters.automationId
+    ? AUTOMATION_STATUS.EXISTING
+    : AUTOMATION_STATUS.NEW

  $: automations = $automationStore.automations
    .filter(a => a.definition.trigger?.stepId === "APP")
@ -46,45 +48,46 @@
    automationStatus = AUTOMATION_STATUS.EXISTING
    parameters.newAutomationName = ""
  }
-
 </script>

 <div class="root">
-
  <div class="radio-container" on:click={setNew}>
-    <input 
-      type="radio" 
-      value={AUTOMATION_STATUS.NEW} 
+    <input
+      type="radio"
+      value={AUTOMATION_STATUS.NEW}
      bind:group={automationStatus}
-      disabled={!hasAutomations}> 
-      
-    <Label disabled={!hasAutomations}>Create a new automation </Label>
+      disabled={!hasAutomations} />

+    <Label disabled={!hasAutomations}>Create a new automation</Label>
  </div>

  <div class="radio-container" on:click={setExisting}>
-
-    <input 
-      type="radio" 
+    <input
+      type="radio"
      value={AUTOMATION_STATUS.EXISTING}
      bind:group={automationStatus}
-      disabled={!hasAutomations}> 
-      
-    <Label disabled={!hasAutomations}>Use an existing automation </Label>
+      disabled={!hasAutomations} />

+    <Label disabled={!hasAutomations}>Use an existing automation</Label>
  </div>

  <Label size="m" color="dark">Automation</Label>

  {#if automationStatus === AUTOMATION_STATUS.EXISTING}
-    <Select secondary bind:value={parameters.automationId} placeholder="Choose automation">
+    <Select
+      secondary
+      bind:value={parameters.automationId}
+      placeholder="Choose automation">
      <option value="" />
      {#each automations as automation}
        <option value={automation._id}>{automation.name}</option>
      {/each}
    </Select>
  {:else}
-    <Input secondary bind:value={parameters.newAutomationName} placeholder="Enter automation name" />
+    <Input
+      secondary
+      bind:value={parameters.newAutomationName}
+      placeholder="Enter automation name" />
  {/if}

  <SaveFields
@ -92,7 +95,6 @@
    schemaFields={automationStatus === AUTOMATION_STATUS.EXISTING && selectedAutomation && selectedAutomation.schema}
    fieldLabel="Field"
    on:fieldschanged={onFieldsChanged} />
-
 </div>

 <style>
@ -132,5 +134,4 @@
  .radio-container > input:focus {
    outline: none;
  }
-
 </style>
--- a/packages/builder/src/components/userInterface/TableViewSelect.svelte
+++ b/packages/builder/src/components/userInterface/TableViewSelect.svelte
@ -14,7 +14,6 @@

  export let value = {}

-
  $: tables = $backendUiStore.tables.map(m => ({
    label: m.name,
    name: `all_${m._id}`,
@ -33,12 +32,12 @@
  }, [])

  $: queries = $backendUiStore.queries.map(query => ({
-      label: query.name,
-      name: query.name,
-      ...query,
-      schema: query.schema,
-      parameters: query.parameters,
-      type: "query",
+    label: query.name,
+    name: query.name,
+    ...query,
+    schema: query.schema,
+    parameters: query.parameters,
+    type: "query",
  }))

  $: bindableProperties = fetchBindableProperties({
@ -82,8 +81,12 @@
  }

  function fetchDatasourceSchema(query) {
-    const source = $backendUiStore.datasources.find(ds => ds._id === query.datasourceId).source
-    return $backendUiStore.integrations[source].query[query.queryVerb][query.queryType];
+    const source = $backendUiStore.datasources.find(
+      ds => ds._id === query.datasourceId
+    ).source
+    return $backendUiStore.integrations[source].query[query.queryVerb][
+      query.queryType
+    ]
  }
 </script>

@ -94,22 +97,26 @@
  <span>{value.label ? value.label : 'Table / View / Query'}</span>
  <Icon name="arrowdown" />
 </div>
-{#if value.type === "query"}
-  <i class="ri-settings-5-line" on:click={openBindingDrawer}/>
+{#if value.type === 'query'}
+  <i class="ri-settings-5-line" on:click={openBindingDrawer} />
  {#if bindingDrawerOpen}
    <BottomDrawer title={'Query'} onClose={closeDatabindingDrawer}>
      <div slot="buttons">
-        <Button blue thin on:click={() => { 
-          notifier.success("Query parameters saved.")
-          handleSelected(value)
-        }}>Save</Button>
+        <Button
+          blue
+          thin
+          on:click={() => {
+            notifier.success('Query parameters saved.')
+            handleSelected(value)
+          }}>
+          Save
+        </Button>
      </div>
      <div class="drawer-contents" slot="body">
-        <IntegrationQueryEditor 
+        <IntegrationQueryEditor
          query={value}
          schema={fetchDatasourceSchema(value)}
-          editable={false}
-        />
+          editable={false} />
        <Spacer large />
        {#if value.parameters.length > 0}
          <ParameterBuilder
@ -178,7 +185,6 @@
  </div>
 </DropdownMenu>

-
 <style>
  .dropdownbutton {
    background-color: var(--grey-2);
--- a/packages/builder/src/pages/[application]/data/table/[selectedTable]/index.svelte
+++ b/packages/builder/src/pages/[application]/data/table/[selectedTable]/index.svelte
@ -7,9 +7,7 @@

 {#if $backendUiStore.selectedDatabase._id && selectedTable.name}
  <TableDataTable />
-{:else}
-  <i>Create your first table to start building</i>
-{/if}
+{:else}<i>Create your first table to start building</i>{/if}

 <style>
  i {
--- a/packages/standard-components/src/grid/Component.svelte
+++ b/packages/standard-components/src/grid/Component.svelte
@ -155,7 +155,9 @@
        {#if selectedRows.length > 0}
          <DeleteButton text small on:click={modal.show()}>
            <Icon name="addrow" />
-            Delete {selectedRows.length} row(s)
+            Delete
+            {selectedRows.length}
+            row(s)
          </DeleteButton>
        {/if}
      </div>