Merge branch 'master' of github.com:Budibase/budibase into form-builder
This commit is contained in:
Andrew Kingston
commit
2d0a7d825c
20
hosting/bootstrap.sh
Executable file
20
hosting/bootstrap.sh
Executable file
|
|
@ -0,0 +1,20 @@
|
|||
#!/usr/bin/env bash
|
||||
|
||||
GITHUB_BASE_URL=https://raw.githubusercontent.com/Budibase/budibase/master/hosting
|
||||
|
||||
if ! [ -x "$(command -v wget)" ]; then
|
||||
echo 'Error: wget is not installed. Please install it for your operating system.' >&2
|
||||
exit 1
|
||||
fi
|
||||
|
||||
fetch_config_files() {
|
||||
wget $GITHUB_BASE_URL/docker-compose.yaml
|
||||
wget $GITHUB_BASE_URL/envoy.yaml
|
||||
wget $GITHUB_BASE_URL/hosting.properties
|
||||
wget $GITHUB_BASE_URL/start.sh
|
||||
}
|
||||
|
||||
fetch_config_files
|
||||
|
||||
# Start budibase
|
||||
docker-compose --env-file hosting.properties up -d
|
||||
|
|
@ -2,6 +2,7 @@ version: "3"
|
|||
|
||||
services:
|
||||
app-service:
|
||||
restart: always
|
||||
image: budibase/budibase-apps
|
||||
ports:
|
||||
- "${APP_PORT}:4002"
|
||||
|
|
@ -18,6 +19,7 @@ services:
|
|||
- worker-service
|
||||
|
||||
worker-service:
|
||||
restart: always
|
||||
image: budibase/budibase-worker
|
||||
ports:
|
||||
- "${WORKER_PORT}:4003"
|
||||
|
|
@ -36,6 +38,7 @@ services:
|
|||
- couch-init
|
||||
|
||||
minio-service:
|
||||
restart: always
|
||||
image: minio/minio
|
||||
volumes:
|
||||
- minio_data:/data
|
||||
|
|
@ -53,6 +56,7 @@ services:
|
|||
retries: 3
|
||||
|
||||
proxy-service:
|
||||
restart: always
|
||||
image: envoyproxy/envoy:v1.16-latest
|
||||
volumes:
|
||||
- ./envoy.yaml:/etc/envoy/envoy.yaml
|
||||
|
|
@ -66,6 +70,7 @@ services:
|
|||
- couchdb-service
|
||||
|
||||
couchdb-service:
|
||||
restart: always
|
||||
image: apache/couchdb:3.0
|
||||
environment:
|
||||
- COUCHDB_PASSWORD=${COUCH_DB_PASSWORD}
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@
|
|||
}
|
||||
},
|
||||
"dependencies": {
|
||||
"@budibase/bbui": "^1.54.0",
|
||||
"@budibase/bbui": "^1.54.1",
|
||||
"@budibase/client": "^0.5.3",
|
||||
"@budibase/colorpicker": "^1.0.1",
|
||||
"@budibase/string-templates": "^0.5.3",
|
||||
|
|
|
|||
|
|
@ -103,6 +103,15 @@
|
|||
opacity: 1;
|
||||
}
|
||||
|
||||
.column-header-name {
|
||||
white-space: normal !important;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.sort-icon {
|
||||
position: relative;
|
||||
top: 2px;
|
||||
|
|
|
|||
|
|
@ -43,8 +43,8 @@
|
|||
<div class="datasource-icon" slot="icon">
|
||||
<svelte:component
|
||||
this={ICONS[datasource.source]}
|
||||
height="15"
|
||||
width="15" />
|
||||
height="18"
|
||||
width="18" />
|
||||
</div>
|
||||
<EditDatasourcePopover {datasource} />
|
||||
</NavItem>
|
||||
|
|
@ -61,3 +61,10 @@
|
|||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
.datasource-icon {
|
||||
margin-right: 3px;
|
||||
padding-top: 3px;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -7,10 +7,9 @@
|
|||
<form>
|
||||
{#each Object.keys(integration) as configKey}
|
||||
<Input
|
||||
thin
|
||||
type={integration[configKey].type}
|
||||
label={configKey}
|
||||
bind:value={integration[configKey]} />
|
||||
<Spacer medium />
|
||||
<Spacer large />
|
||||
{/each}
|
||||
</form>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,42 @@
|
|||
<script>
|
||||
import { backendUiStore, store, allScreens } from "builderStore"
|
||||
import { notifier } from "builderStore/store/notifications"
|
||||
import { DropdownMenu, Button, Input, TextButton, Icon } from "@budibase/bbui"
|
||||
import ConfirmDialog from "components/common/ConfirmDialog.svelte"
|
||||
import IntegrationConfigForm from "../TableIntegrationMenu//IntegrationConfigForm.svelte"
|
||||
import { DropdownContainer, DropdownItem } from "components/common/Dropdowns"
|
||||
import ParameterBuilder from "components/integration/QueryParameterBuilder.svelte"
|
||||
|
||||
export let bindable
|
||||
export let parameters
|
||||
|
||||
let anchor
|
||||
let dropdown
|
||||
let confirmDeleteDialog
|
||||
|
||||
function hideEditor() {
|
||||
dropdown?.hide()
|
||||
}
|
||||
</script>
|
||||
|
||||
<div on:click|stopPropagation bind:this={anchor}>
|
||||
<TextButton
|
||||
text
|
||||
on:click={dropdown.show}
|
||||
active={false}>
|
||||
<Icon name="add" />
|
||||
Add Parameters
|
||||
</TextButton>
|
||||
<DropdownMenu align="right" {anchor} bind:this={dropdown}>
|
||||
<div class="wrapper">
|
||||
<ParameterBuilder bind:parameters {bindable} />
|
||||
</div>
|
||||
</DropdownMenu>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.wrapper {
|
||||
padding: var(--spacing-xl);
|
||||
min-width: 600px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -57,7 +57,7 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
<Button secondary small on:click={drawer.show}>Define Actions</Button>
|
||||
<Button secondary wide on:click={drawer.show}>Define Actions</Button>
|
||||
<Drawer bind:this={drawer} title={'Actions'}>
|
||||
<heading slot="buttons">
|
||||
<Button thin blue on:click={saveEventData}>Save</Button>
|
||||
|
|
|
|||
|
|
@ -9,12 +9,17 @@
|
|||
export let onStyleChanged = () => {}
|
||||
export let open = false
|
||||
|
||||
$: style = componentInstance["_styles"][styleCategory] || {}
|
||||
$: changed = properties.some(prop => hasPropChanged(style, prop))
|
||||
|
||||
const hasPropChanged = (style, prop) => {
|
||||
return style[prop.key] != null && style[prop.key] !== ""
|
||||
}
|
||||
|
||||
$: style = componentInstance["_styles"][styleCategory] || {}
|
||||
$: changed = properties.some(prop => hasPropChanged(style, prop))
|
||||
const getControlProps = props => {
|
||||
const { label, key, control, ...otherProps } = props || {}
|
||||
return otherProps || {}
|
||||
}
|
||||
</script>
|
||||
|
||||
<DetailSummary name={`${name}${changed ? ' *' : ''}`} on:open show={open} thin>
|
||||
|
|
@ -28,7 +33,7 @@
|
|||
key={prop.key}
|
||||
value={style[prop.key]}
|
||||
onChange={value => onStyleChanged(styleCategory, prop.key, value)}
|
||||
props={{ options: prop.options, placeholder: prop.placeholder }} />
|
||||
props={getControlProps(prop)} />
|
||||
{/each}
|
||||
</div>
|
||||
{/if}
|
||||
|
|
|
|||
|
|
@ -78,9 +78,7 @@
|
|||
const source = $backendUiStore.datasources.find(
|
||||
ds => ds._id === query.datasourceId
|
||||
).source
|
||||
return $backendUiStore.integrations[source].query[query.queryVerb][
|
||||
query.queryType
|
||||
]
|
||||
return $backendUiStore.integrations[source].query[query.queryVerb]
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -155,8 +155,9 @@
|
|||
}
|
||||
|
||||
:global(.CodeMirror) {
|
||||
height: auto !important;
|
||||
border-radius: var(--border-radius-m);
|
||||
font-family: var(--font-sans) !important;
|
||||
height: 500px !important;
|
||||
border-radius: var(--border-radius-s);
|
||||
font-family: monospace !important;
|
||||
line-height: 1.3;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -24,18 +24,18 @@
|
|||
</script>
|
||||
|
||||
<form on:submit|preventDefault>
|
||||
<div class="field">
|
||||
{#each schemaKeys as field}
|
||||
<Label extraSmall grey>{field}</Label>
|
||||
<div class="field">
|
||||
<Input
|
||||
placeholder="Enter {field} name"
|
||||
outline
|
||||
disabled={!editable}
|
||||
type={schema.fields[field]?.type}
|
||||
required={schema.fields[field]?.required}
|
||||
bind:value={fields[field]} />
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
</form>
|
||||
<Label extraSmall grey>Data</Label>
|
||||
{#if schema.customisable}
|
||||
<Editor
|
||||
label="Query"
|
||||
|
|
@ -49,7 +49,7 @@
|
|||
.field {
|
||||
margin-bottom: var(--spacing-m);
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 2%;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-gap: var(--spacing-m);
|
||||
align-items: center;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<script>
|
||||
import { Button, Label, Input, Heading } from "@budibase/bbui"
|
||||
import { Button, Input, Heading, Spacer } from "@budibase/bbui"
|
||||
import BindableInput from "components/common/BindableInput.svelte"
|
||||
import {
|
||||
readableToRuntimeBinding,
|
||||
|
|
@ -31,19 +31,22 @@
|
|||
|
||||
<section>
|
||||
<Heading extraSmall black>Parameters</Heading>
|
||||
<Spacer large />
|
||||
<div class="parameters" class:bindable>
|
||||
<Label extraSmall grey>Parameter Name</Label>
|
||||
<Label extraSmall grey>Default</Label>
|
||||
{#if bindable}
|
||||
<Label extraSmall grey>Value</Label>
|
||||
{:else}
|
||||
<div />
|
||||
{/if}
|
||||
{#each parameters as parameter, idx}
|
||||
<Input thin disabled={bindable} bind:value={parameter.name} />
|
||||
<Input thin disabled={bindable} bind:value={parameter.default} />
|
||||
<Input
|
||||
placeholder="Parameter Name"
|
||||
thin
|
||||
disabled={bindable}
|
||||
bind:value={parameter.name} />
|
||||
<Input
|
||||
placeholder="Default"
|
||||
thin
|
||||
disabled={bindable}
|
||||
bind:value={parameter.default} />
|
||||
{#if bindable}
|
||||
<BindableInput
|
||||
placeholder="Value"
|
||||
type="string"
|
||||
thin
|
||||
on:change={evt => onBindingChange(parameter.name, evt.detail)}
|
||||
|
|
@ -57,9 +60,7 @@
|
|||
{/each}
|
||||
</div>
|
||||
{#if !bindable}
|
||||
<Button thin secondary small on:click={newQueryParameter}>
|
||||
Add Parameter
|
||||
</Button>
|
||||
<Button secondary on:click={newQueryParameter}>Add Parameter</Button>
|
||||
{/if}
|
||||
</section>
|
||||
|
||||
|
|
|
|||
|
|
@ -16,6 +16,7 @@
|
|||
import { FIELDS } from "constants/backend"
|
||||
import IntegrationQueryEditor from "components/integration/index.svelte"
|
||||
import ExternalDataSourceTable from "components/backend/DataTable/ExternalDataSourceTable.svelte"
|
||||
import EditQueryParamsPopover from "components/backend/DatasourceNavigator/popovers/EditQueryParamsPopover.svelte"
|
||||
import { backendUiStore } from "builderStore"
|
||||
|
||||
const PREVIEW_HEADINGS = [
|
||||
|
|
@ -40,6 +41,7 @@
|
|||
let tab = "JSON"
|
||||
let parameters
|
||||
let data = []
|
||||
let popover
|
||||
|
||||
$: datasource = $backendUiStore.datasources.find(
|
||||
ds => ds._id === query.datasourceId
|
||||
|
|
@ -61,7 +63,7 @@
|
|||
$: config = $backendUiStore.integrations[datasourceType]?.query
|
||||
$: docsLink = $backendUiStore.integrations[datasourceType]?.docs
|
||||
|
||||
$: shouldShowQueryConfig = config && query.queryVerb && query.queryType
|
||||
$: shouldShowQueryConfig = config && query.queryVerb
|
||||
|
||||
function newField() {
|
||||
fields = [...fields, {}]
|
||||
|
|
@ -129,62 +131,44 @@
|
|||
</script>
|
||||
|
||||
<header>
|
||||
<Heading small>{query.name}</Heading>
|
||||
<div class="input">
|
||||
<Input placeholder="✎ Edit Query Name" bind:value={query.name} />
|
||||
</div>
|
||||
{#if config}
|
||||
<div class="queryVerbs">
|
||||
{#each Object.keys(config) as queryVerb}
|
||||
<div
|
||||
class="queryVerb"
|
||||
class:selected={queryVerb === query.queryVerb}
|
||||
on:click={() => {
|
||||
query.queryVerb = queryVerb
|
||||
}}>
|
||||
{queryVerb}
|
||||
</div>
|
||||
{/each}
|
||||
</div>
|
||||
{#if query.queryVerb}
|
||||
<Select thin secondary bind:value={query.queryType}>
|
||||
<option value={''}>Select an option</option>
|
||||
{#each Object.keys(config[query.queryVerb]) as queryType}
|
||||
<option value={queryType}>{queryType}</option>
|
||||
<div class="props">
|
||||
<div class="query-type">Query type: <span class="query-type-span">{config[query.queryVerb].type}</span></div>
|
||||
<div class="select">
|
||||
<Select primary thin bind:value={query.queryVerb}>
|
||||
{#each Object.keys(config) as queryVerb}
|
||||
<option value={queryVerb}>{queryVerb}</option>
|
||||
{/each}
|
||||
</Select>
|
||||
{/if}
|
||||
<Spacer medium />
|
||||
<Button primary href={docsLink} target="_blank">
|
||||
<i class="ri-book-2-line" />
|
||||
</Button>
|
||||
</div>
|
||||
</div>
|
||||
<EditQueryParamsPopover bind:parameters={query.parameters} bindable={false} />
|
||||
{/if}
|
||||
</header>
|
||||
|
||||
<Spacer large />
|
||||
<Spacer extraLarge />
|
||||
|
||||
{#if shouldShowQueryConfig}
|
||||
<section>
|
||||
<div class="config">
|
||||
<Label extraSmall grey>Query Name</Label>
|
||||
<Input thin bind:value={query.name} />
|
||||
|
||||
<Spacer medium />
|
||||
|
||||
<IntegrationQueryEditor
|
||||
{query}
|
||||
schema={config[query.queryVerb][query.queryType]}
|
||||
schema={config[query.queryVerb]}
|
||||
bind:parameters />
|
||||
|
||||
<Spacer medium />
|
||||
<Spacer extraLarge />
|
||||
<Spacer large />
|
||||
|
||||
<div class="viewer-controls">
|
||||
<Button
|
||||
wide
|
||||
thin
|
||||
blue
|
||||
disabled={data.length === 0}
|
||||
on:click={saveQuery}>
|
||||
Save
|
||||
Save Query
|
||||
</Button>
|
||||
<Button wide thin primary on:click={previewQuery}>Run</Button>
|
||||
<Button primary on:click={previewQuery}>Run Query</Button>
|
||||
</div>
|
||||
|
||||
<section class="viewer">
|
||||
|
|
@ -196,10 +180,11 @@
|
|||
<ExternalDataSourceTable {query} {data} />
|
||||
{:else if tab === 'SCHEMA'}
|
||||
{#each fields as field, idx}
|
||||
<Spacer small />
|
||||
<div class="field">
|
||||
<Input thin type={'text'} bind:value={field.name} />
|
||||
<Select secondary thin bind:value={field.type}>
|
||||
<option value={''}>Select an option</option>
|
||||
<Input outline placeholder="Field Name" type={'text'} bind:value={field.name} />
|
||||
<Select thin border bind:value={field.type}>
|
||||
<option value={''}>Select a field type</option>
|
||||
<option value={'STRING'}>Text</option>
|
||||
<option value={'NUMBER'}>Number</option>
|
||||
<option value={'BOOLEAN'}>Boolean</option>
|
||||
|
|
@ -210,7 +195,8 @@
|
|||
on:click={() => deleteField(idx)} />
|
||||
</div>
|
||||
{/each}
|
||||
<Button thin secondary on:click={newField}>Add Field</Button>
|
||||
<Spacer small />
|
||||
<Button thin secondary on:click={newField}>Add Field</Button>
|
||||
{/if}
|
||||
</Switcher>
|
||||
{/if}
|
||||
|
|
@ -220,11 +206,28 @@
|
|||
{/if}
|
||||
|
||||
<style>
|
||||
|
||||
.input {
|
||||
width: 300px;
|
||||
}
|
||||
|
||||
.select {
|
||||
width: 200px;
|
||||
margin-right: 40px;
|
||||
}
|
||||
|
||||
.props {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-left: auto;
|
||||
align-items: center;
|
||||
gap: var(--layout-l);
|
||||
}
|
||||
|
||||
.field {
|
||||
display: grid;
|
||||
grid-gap: 10px;
|
||||
grid-template-columns: 1fr 1fr 50px;
|
||||
margin-bottom: var(--spacing-m);
|
||||
gap: var(--spacing-l);
|
||||
}
|
||||
|
||||
a {
|
||||
|
|
@ -240,6 +243,16 @@
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.query-type {
|
||||
font-family: var(--font-sans);
|
||||
color: var(--grey-8);
|
||||
font-size: var(--font-size-s);
|
||||
}
|
||||
|
||||
.query-type-span {
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.preview {
|
||||
width: 800px;
|
||||
height: 100%;
|
||||
|
|
@ -253,32 +266,18 @@
|
|||
align-items: center;
|
||||
}
|
||||
|
||||
.queryVerbs {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
font-size: var(--font-size-m);
|
||||
align-items: center;
|
||||
margin-left: var(--spacing-l);
|
||||
}
|
||||
|
||||
.queryVerb {
|
||||
text-transform: capitalize;
|
||||
margin-right: var(--spacing-m);
|
||||
color: var(--grey-5);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.selected {
|
||||
color: var(--white);
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.viewer-controls {
|
||||
display: grid;
|
||||
grid-gap: var(--spacing-m);
|
||||
grid-auto-flow: column;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
margin-left: auto;
|
||||
direction: rtl;
|
||||
grid-template-columns: 10% 10% 1fr;
|
||||
margin-bottom: var(--spacing-m);
|
||||
z-index: 5;
|
||||
gap: var(--spacing-m);
|
||||
min-width: 150px;
|
||||
}
|
||||
|
||||
.viewer {
|
||||
margin-top: -28px;
|
||||
z-index: -2;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -20,13 +20,6 @@
|
|||
}
|
||||
</script>
|
||||
|
||||
{#if editable}
|
||||
<ParameterBuilder bind:parameters={query.parameters} bindable={false} />
|
||||
<Spacer large />
|
||||
{/if}
|
||||
|
||||
<Heading extraSmall black>Query</Heading>
|
||||
<Spacer medium />
|
||||
|
||||
{#if schema}
|
||||
{#key query._id}
|
||||
|
|
@ -38,7 +31,6 @@
|
|||
readOnly={!editable}
|
||||
value={query.fields.sql} />
|
||||
{:else if schema.type === QueryTypes.JSON}
|
||||
<Spacer large />
|
||||
<Editor
|
||||
label="Query"
|
||||
mode="json"
|
||||
|
|
|
|||
|
|
@ -73,7 +73,7 @@
|
|||
<a
|
||||
target="_blank"
|
||||
href="https://github.com/Budibase/budibase/discussions">
|
||||
<i class="ri-question-line" />
|
||||
<i class="ri-github-fill" />
|
||||
</a>
|
||||
</div>
|
||||
<SettingsLink />
|
||||
|
|
@ -89,8 +89,8 @@
|
|||
<div class="beta">
|
||||
<Button
|
||||
secondary
|
||||
href="https://www.budibase.com/blog/budibase-public-beta/">
|
||||
Budibase is in Beta
|
||||
href="https://github.com/Budibase/budibase/discussions/categories/ideas">
|
||||
Request feature
|
||||
</Button>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -21,9 +21,9 @@
|
|||
query => query._id === $backendUiStore.selectedQueryId
|
||||
) || {
|
||||
datasourceId: $params.selectedDatasource,
|
||||
name: "New Query",
|
||||
parameters: [],
|
||||
fields: {},
|
||||
queryVerb: "read",
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
@ -35,8 +35,10 @@
|
|||
|
||||
<style>
|
||||
section {
|
||||
background: var(--background);
|
||||
padding: var(--spacing-xl);
|
||||
border-radius: var(--border-radius-m);
|
||||
overflow: scroll;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
background: transparent; /* make scrollbar transparent */
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<script>
|
||||
import { goto } from "@sveltech/routify"
|
||||
import { Button, Spacer, Icon, TextButton } from "@budibase/bbui"
|
||||
import { Button, Spacer, Icon } from "@budibase/bbui"
|
||||
import { backendUiStore } from "builderStore"
|
||||
import { notifier } from "builderStore/store/notifications"
|
||||
import IntegrationConfigForm from "components/backend/DatasourceNavigator/TableIntegrationMenu/IntegrationConfigForm.svelte"
|
||||
|
|
@ -14,31 +14,129 @@
|
|||
await backendUiStore.actions.datasources.save(datasource)
|
||||
notifier.success(`Datasource ${name} saved successfully.`)
|
||||
}
|
||||
|
||||
function onClickQuery(query) {
|
||||
if ($backendUiStore.selectedQueryId === query._id) {
|
||||
return
|
||||
}
|
||||
backendUiStore.actions.queries.select(query)
|
||||
$goto(`../${query._id}`)
|
||||
}
|
||||
</script>
|
||||
|
||||
{#if datasource}
|
||||
<TextButton text small on:click={() => $goto('../new')}>
|
||||
<Icon name="filter" />
|
||||
Create Query
|
||||
</TextButton>
|
||||
<section>
|
||||
<h4>{datasource.name}: Configuration</h4>
|
||||
<IntegrationConfigForm integration={datasource.config} />
|
||||
<Spacer medium />
|
||||
<footer>
|
||||
<Button blue wide on:click={saveDatasource}>Save</Button>
|
||||
</footer>
|
||||
<header>
|
||||
<h3 class="section-title">{datasource.name}</h3>
|
||||
</header>
|
||||
<Spacer extraLarge />
|
||||
<div class="container">
|
||||
<div class="config-header">
|
||||
<h5>Configuration</h5>
|
||||
<Button secondary on:click={saveDatasource}>Save</Button>
|
||||
</div>
|
||||
<Spacer medium />
|
||||
<IntegrationConfigForm integration={datasource.config} />
|
||||
</div>
|
||||
<Spacer extraLarge />
|
||||
<div class="container">
|
||||
<div class="query-header">
|
||||
<h5>Queries</h5>
|
||||
<Button blue on:click={() => $goto('../new')}>Create Query</Button>
|
||||
</div>
|
||||
<Spacer extraLarge />
|
||||
<div class="query-list">
|
||||
{#each $backendUiStore.queries.filter(query => query.datasourceId === datasource._id) as query}
|
||||
<div class="query-list-item" on:click={() => onClickQuery(query)}>
|
||||
<p class="query-name">{query.name}</p>
|
||||
<p>{query.queryVerb}</p>
|
||||
<p>4000 records</p>
|
||||
<p>→</p>
|
||||
</div>
|
||||
{/each}
|
||||
<Spacer medium />
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
{/if}
|
||||
|
||||
<style>
|
||||
h4 {
|
||||
margin-top: var(--spacing-xl);
|
||||
margin-bottom: var(--spacing-s);
|
||||
h3 {
|
||||
margin: 0;
|
||||
}
|
||||
section {
|
||||
background: var(--background);
|
||||
margin: 0 auto;
|
||||
width: 800px;
|
||||
}
|
||||
|
||||
header {
|
||||
margin: 0 0 var(--spacing-xs) 0;
|
||||
}
|
||||
|
||||
.section-title {
|
||||
text-transform: capitalize;
|
||||
}
|
||||
|
||||
.config-header {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
margin: 0 0 var(--spacing-xs) 0;
|
||||
}
|
||||
|
||||
.container {
|
||||
border-radius: var(--border-radius-m);
|
||||
padding: var(--spacing-xl);
|
||||
background: var(--background);
|
||||
padding: var(--layout-s);
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
h5 {
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.query-header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
margin: 0 0 var(--spacing-s) 0;
|
||||
}
|
||||
|
||||
.query-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: var(--spacing-m);
|
||||
}
|
||||
|
||||
.query-list-item {
|
||||
border-radius: var(--border-radius-m);
|
||||
background: var(--background);
|
||||
border: var(--border-grey);
|
||||
display: grid;
|
||||
grid-template-columns: 2fr 0.75fr 0.75fr 1fr 20px;
|
||||
align-items: center;
|
||||
padding: var(--spacing-m) var(--layout-xs);
|
||||
gap: var(--layout-xs);
|
||||
transition: 200ms background ease;
|
||||
}
|
||||
|
||||
.query-list-item:hover {
|
||||
background: var(--grey-1);
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
p {
|
||||
font-size: var(--font-size-xs);
|
||||
color: var(--grey-8);
|
||||
}
|
||||
|
||||
.query-name {
|
||||
color: var(--ink);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
font-size: var(--font-size-s);
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -842,10 +842,10 @@
|
|||
lodash "^4.17.19"
|
||||
to-fast-properties "^2.0.0"
|
||||
|
||||
"@budibase/bbui@^1.54.0":
|
||||
version "1.54.0"
|
||||
resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.54.0.tgz#60e6c0faa3d8f1781c503e74f8b8990f75ba2c40"
|
||||
integrity sha512-98koXkueqda6oQT6q0NPNvdL878ETRevtmmm34aSz9C6B4Oz68VVCsiFzRWuHvP/7wiNaAxMgY1nsEsCwP3LpQ==
|
||||
"@budibase/bbui@^1.54.1":
|
||||
version "1.54.1"
|
||||
resolved "https://registry.yarnpkg.com/@budibase/bbui/-/bbui-1.54.1.tgz#ad0439c0be6a4dc818cd9dacda00f053b0daa9d5"
|
||||
integrity sha512-ZY2OP/tF+ReMSyzZIGZV6wpQ4eIEzYGxZV3n+C+oNjzK5u3rwWPCDEVDlZgJSqJ61z+sEf2zuIyAh88lq9RTaA==
|
||||
dependencies:
|
||||
markdown-it "^12.0.2"
|
||||
quill "^1.3.7"
|
||||
|
|
|
|||
|
|
@ -1,15 +1,13 @@
|
|||
import { notificationStore } from "../store/notification"
|
||||
|
||||
/**
|
||||
* API cache for cached request responses.
|
||||
*/
|
||||
import { notificationStore } from "../store/notification"
|
||||
let cache = {}
|
||||
|
||||
/**
|
||||
* Handler for API errors.
|
||||
*/
|
||||
const handleError = error => {
|
||||
notificationStore.danger(error)
|
||||
return { error }
|
||||
}
|
||||
|
||||
|
|
@ -38,10 +36,12 @@ const makeApiCall = async ({ method, url, body, json = true }) => {
|
|||
case 200:
|
||||
return response.json()
|
||||
case 404:
|
||||
notificationStore.danger("Not found")
|
||||
return handleError(`${url}: Not Found`)
|
||||
case 400:
|
||||
return handleError(`${url}: Bad Request`)
|
||||
case 403:
|
||||
notificationStore.danger("Forbidden")
|
||||
return handleError(`${url}: Forbidden`)
|
||||
default:
|
||||
if (response.status >= 200 && response.status < 400) {
|
||||
|
|
@ -77,7 +77,7 @@ const makeCachedApiCall = async params => {
|
|||
const requestApiCall = method => async params => {
|
||||
const { url, cache = false } = params
|
||||
const fixedUrl = `/${url}`.replace("//", "/")
|
||||
const enrichedParams = { ...params, method, fixedUrl }
|
||||
const enrichedParams = { ...params, method, url: fixedUrl }
|
||||
return await (cache ? makeCachedApiCall : makeApiCall)(enrichedParams)
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1,10 +1,15 @@
|
|||
import { notificationStore } from "../store/notification"
|
||||
import API from "./api"
|
||||
/**
|
||||
* Executes an automation. Must have "App Action" trigger.
|
||||
*/
|
||||
export const triggerAutomation = async (automationId, fields) => {
|
||||
return await API.post({
|
||||
const res = await API.post({
|
||||
url: `/api/automations/${automationId}/trigger`,
|
||||
body: { fields },
|
||||
})
|
||||
res.error
|
||||
? notificationStore.danger("An error has occurred")
|
||||
: notificationStore.success("Automation triggered")
|
||||
return res
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,14 +1,18 @@
|
|||
import { notificationStore } from "../store/notification"
|
||||
import API from "./api"
|
||||
|
||||
/**
|
||||
* Executes a query against an external data connector.
|
||||
*/
|
||||
export const executeQuery = async ({ queryId, parameters }) => {
|
||||
const response = await API.post({
|
||||
const res = await API.post({
|
||||
url: `/api/queries/${queryId}`,
|
||||
body: {
|
||||
parameters,
|
||||
},
|
||||
})
|
||||
return response
|
||||
if (res.error) {
|
||||
notificationStore.danger("An error has occurred")
|
||||
}
|
||||
return res
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,3 +1,4 @@
|
|||
import { notificationStore } from "../store/notification"
|
||||
import API from "./api"
|
||||
import { fetchTableDefinition } from "./tables"
|
||||
|
||||
|
|
@ -15,42 +16,58 @@ export const fetchRow = async ({ tableId, rowId }) => {
|
|||
* Creates a row in a table.
|
||||
*/
|
||||
export const saveRow = async row => {
|
||||
return await API.post({
|
||||
const res = await API.post({
|
||||
url: `/api/${row.tableId}/rows`,
|
||||
body: row,
|
||||
})
|
||||
res.error
|
||||
? notificationStore.danger("An error has occurred")
|
||||
: notificationStore.success("Row saved")
|
||||
return res
|
||||
}
|
||||
|
||||
/**
|
||||
* Updates a row in a table.
|
||||
*/
|
||||
export const updateRow = async row => {
|
||||
return await API.patch({
|
||||
const res = await API.patch({
|
||||
url: `/api/${row.tableId}/rows/${row._id}`,
|
||||
body: row,
|
||||
})
|
||||
res.error
|
||||
? notificationStore.danger("An error has occurred")
|
||||
: notificationStore.success("Row updated")
|
||||
return res
|
||||
}
|
||||
|
||||
/**
|
||||
* Deletes a row from a table.
|
||||
*/
|
||||
export const deleteRow = async ({ tableId, rowId, revId }) => {
|
||||
return await API.del({
|
||||
const res = await API.del({
|
||||
url: `/api/${tableId}/rows/${rowId}/${revId}`,
|
||||
})
|
||||
res.error
|
||||
? notificationStore.danger("An error has occurred")
|
||||
: notificationStore.success("Row deleted")
|
||||
return res
|
||||
}
|
||||
|
||||
/**
|
||||
* Deletes many rows from a table.
|
||||
*/
|
||||
export const deleteRows = async ({ tableId, rows }) => {
|
||||
return await API.post({
|
||||
const res = await API.post({
|
||||
url: `/api/${tableId}/rows`,
|
||||
body: {
|
||||
rows,
|
||||
type: "delete",
|
||||
},
|
||||
})
|
||||
res.error
|
||||
? notificationStore.danger("An error has occurred")
|
||||
: notificationStore.success(`${rows.length} row(s) deleted`)
|
||||
return res
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -5,6 +5,7 @@ import {
|
|||
routeStore,
|
||||
screenStore,
|
||||
bindingStore,
|
||||
builderStore,
|
||||
} from "./store"
|
||||
import { styleable } from "./utils/styleable"
|
||||
import { linkable } from "./utils/linkable"
|
||||
|
|
@ -16,6 +17,7 @@ export default {
|
|||
notifications: notificationStore,
|
||||
routeStore,
|
||||
screenStore,
|
||||
builderStore,
|
||||
styleable,
|
||||
linkable,
|
||||
DataProvider,
|
||||
|
|
|
|||
|
|
@ -31,7 +31,6 @@ function generateQueryValidation() {
|
|||
default: Joi.string()
|
||||
})),
|
||||
queryVerb: Joi.string().allow(...Object.values(QueryVerb)).required(),
|
||||
queryType: Joi.string().required(),
|
||||
schema: Joi.object({}).required().unknown(true)
|
||||
}))
|
||||
}
|
||||
|
|
|
|||
|
|
@ -26,7 +26,6 @@ const TEST_QUERY = {
|
|||
fields:{},
|
||||
schema:{},
|
||||
queryVerb:"read",
|
||||
queryType:"Table",
|
||||
}
|
||||
|
||||
describe("/datasources", () => {
|
||||
|
|
|
|||
|
|
@ -26,7 +26,6 @@ const TEST_QUERY = {
|
|||
fields:{},
|
||||
schema:{},
|
||||
queryVerb:"read",
|
||||
queryType:"Table",
|
||||
}
|
||||
|
||||
describe("/queries", () => {
|
||||
|
|
|
|||
|
|
@ -17,48 +17,40 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
create: {
|
||||
"Airtable Record": {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
read: {
|
||||
Table: {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
view: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
view: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
update: {
|
||||
Fields: {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
"Airtable Ids": {
|
||||
type: FIELD_TYPES.JSON,
|
||||
},
|
||||
type: FIELD_TYPES.JSON,
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -16,28 +16,20 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
create: {
|
||||
"CouchDB DSL": {
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
read: {
|
||||
"CouchDB DSL": {
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
update: {
|
||||
"CouchDB Document": {
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
delete: {
|
||||
"Document ID": {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -20,56 +20,48 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
create: {
|
||||
DynamoConfig: {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
customisable: true,
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
customisable: true,
|
||||
},
|
||||
},
|
||||
read: {
|
||||
DynamoConfig: {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
},
|
||||
customisable: true,
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
},
|
||||
customisable: true,
|
||||
},
|
||||
},
|
||||
update: {
|
||||
DynamoConfig: {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
customisable: true,
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
customisable: true,
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
"Dynamo Partition Key": {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
key: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
table: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
key: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -13,57 +13,49 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
create: {
|
||||
"ES Query DSL": {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
read: {
|
||||
"ES Query DSL": {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
update: {
|
||||
"ES Query DSL": {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
customisable: true,
|
||||
fields: {
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
delete: {
|
||||
"Document ID": {
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
type: QUERY_TYPES.FIELDS,
|
||||
fields: {
|
||||
index: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
id: {
|
||||
type: FIELD_TYPES.STRING,
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
|
|||
|
|
@ -24,14 +24,10 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
create: {
|
||||
SQL: {
|
||||
type: "sql",
|
||||
},
|
||||
type: "sql",
|
||||
},
|
||||
read: {
|
||||
SQL: {
|
||||
type: "sql",
|
||||
},
|
||||
type: "sql",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -20,14 +20,10 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
create: {
|
||||
JSON: {
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
read: {
|
||||
JSON: {
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
type: QUERY_TYPES.JSON,
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -31,24 +31,16 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
create: {
|
||||
SQL: {
|
||||
type: "sql",
|
||||
},
|
||||
type: "sql",
|
||||
},
|
||||
read: {
|
||||
SQL: {
|
||||
type: "sql",
|
||||
},
|
||||
type: "sql",
|
||||
},
|
||||
update: {
|
||||
SQL: {
|
||||
type: "sql",
|
||||
},
|
||||
type: "sql",
|
||||
},
|
||||
delete: {
|
||||
SQL: {
|
||||
type: "sql",
|
||||
},
|
||||
type: "sql",
|
||||
},
|
||||
},
|
||||
}
|
||||
|
|
|
|||
|
|
@ -19,13 +19,11 @@ const SCHEMA = {
|
|||
},
|
||||
query: {
|
||||
read: {
|
||||
Bucket: {
|
||||
type: "fields",
|
||||
fields: {
|
||||
bucket: {
|
||||
type: "string",
|
||||
required: true,
|
||||
},
|
||||
type: "fields",
|
||||
fields: {
|
||||
bucket: {
|
||||
type: "string",
|
||||
required: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load diff
|
|
@ -2,12 +2,13 @@
|
|||
import { getContext } from "svelte"
|
||||
import { isEmpty } from "lodash/fp"
|
||||
|
||||
const { API, styleable, DataProvider } = getContext("sdk")
|
||||
const { API, styleable, DataProvider, builderStore } = getContext("sdk")
|
||||
const component = getContext("component")
|
||||
|
||||
export let datasource = []
|
||||
|
||||
let rows = []
|
||||
let loaded = false
|
||||
|
||||
$: fetchData(datasource)
|
||||
|
||||
|
|
@ -15,21 +16,22 @@
|
|||
if (!isEmpty(datasource)) {
|
||||
rows = await API.fetchDatasource(datasource)
|
||||
}
|
||||
loaded = true
|
||||
}
|
||||
</script>
|
||||
|
||||
<div use:styleable={$component.styles}>
|
||||
{#if rows.length > 0}
|
||||
{#each rows as row}
|
||||
<DataProvider {row}>
|
||||
{#if $component.children === 0}
|
||||
<p>Add some components too.</p>
|
||||
{:else}
|
||||
{#if $component.children === 0 && $builderStore.inBuilder}
|
||||
<p>Add some components too</p>
|
||||
{:else}
|
||||
{#each rows as row}
|
||||
<DataProvider {row}>
|
||||
<slot />
|
||||
{/if}
|
||||
</DataProvider>
|
||||
{/each}
|
||||
{:else}
|
||||
</DataProvider>
|
||||
{/each}
|
||||
{/if}
|
||||
{:else if loaded && $builderStore.inBuilder}
|
||||
<p>Feed me some data</p>
|
||||
{/if}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in a new issue