CodeMirror/budibase
1
0
Fork 0
mirror of synced 2024-06-29 11:31:06 +12:00
Code Issues Projects Releases Wiki Activity

REST integration complete

Browse source
This commit is contained in:
Martin McKeaveney 2021-02-15 18:41:56 +00:00
parent 6019af93ee
commit 3a1a375c35
9 changed files with 171 additions and 62 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
packages/builder/src/components/backend/DatasourceNavigator/icons/Rest.svelte Normal file
View file

@ -0,0 +1,36 @@
<script>
export let width = "100"
export let height = "100"
</script>
<svg
{width}
{height}
viewBox="0 0 120 120"
fill="none"
xmlns="http://www.w3.org/2000/svg">
<path
d="M103.125 20.625H68.25L60.375
36.375H16.5V99.375H111V20.625H103.125ZM103.125 36.375H72.375L76.5
28.5H103.125V36.375Z"
fill="#FFBA58" />
<path
d="M75 46.875V52.5H60C58.0127 52.5059 56.1085 53.298 54.7033 54.7033C53.298
56.1085 52.5059 58.0127 52.5 60V75H46.875C44.3886 75 42.004 75.9877 40.2459
77.7459C38.4877 79.504 37.5 81.8886 37.5 84.375C37.5 86.8614 38.4877 89.246
40.2459 91.0041C42.004 92.7623 44.3886 93.75 46.875
93.75H52.5V108.75C52.5059 110.737 53.298 112.642 54.7033 114.047C56.1085
115.452 58.0127 116.244 60 116.25H74.25V110.625C74.25 107.94 75.3167 105.364
77.2155 103.466C79.1143 101.567 81.6897 100.5 84.375 100.5C87.0603 100.5
89.6357 101.567 91.5345 103.466C93.4333 105.364 94.5 107.94 94.5
110.625V116.25H108.75C110.737 116.244 112.642 115.452 114.047
114.047C115.452 112.642 116.244 110.737 116.25 108.75V94.5H110.625C107.94
94.5 105.364 93.4333 103.466 91.5345C101.567 89.6357 100.5 87.0603 100.5
84.375C100.5 81.6897 101.567 79.1143 103.466 77.2155C105.364 75.3167 107.94
74.25 110.625 74.25H116.25V60C116.244 58.0127 115.452 56.1085 114.047
54.7033C112.642 53.298 110.737 52.5059 108.75 52.5H93.75V46.875C93.75
44.3886 92.7623 42.004 91.0041 40.2459C89.246 38.4877 86.8614 37.5 84.375
37.5C81.8886 37.5 79.504 38.4877 77.7459 40.2459C75.9877 42.004 75 44.3886
75 46.875Z"
fill="#E76A00" />
</svg>

2
packages/builder/src/components/backend/DatasourceNavigator/icons/index.js
View file

@ -8,6 +8,7 @@ import Airtable from "./Airtable.svelte"
import SqlServer from "./SQLServer.svelte"
import MySQL from "./MySQL.svelte"
import ArangoDB from "./ArangoDB.svelte"
import Rest from "./Rest.svelte"
export default {
POSTGRES: Postgres,
@ -20,4 +21,5 @@ export default {
AIRTABLE: Airtable,
MYSQL: MySQL,
ARANGODB: ArangoDB,
REST: Rest,
}

45
packages/builder/src/components/integration/KeyValueBuilder.svelte Normal file
View file

@ -0,0 +1,45 @@
<script>
import { Input } from "@budibase/bbui"
export let object = {}
let fields = []
$: object = fields.reduce(
(acc, next) => ({ ...acc, [next.name]: next.value }),
{}
)
function addEntry() {
fields = [...fields, {}]
}
function deleteEntry(idx) {
fields.splice(idx, 1)
fields = fields
}
</script>
<!-- Builds Objects with Key Value Pairs. Useful for building things like Request Headers. -->
<div class="container">
{#each fields as field, idx}
<Input outline thin bind:value={field.name} />
<Input outline bind:value={field.value} />
<i class="ri-close-circle-fill" on:click={() => deleteEntry(idx)} />
{/each}
</div>
<i class="ri-add-circle-fill" on:click={addEntry} />
<style>
.container {
display: grid;
grid-template-columns: 1fr 1fr 20px;
grid-gap: var(--spacing-m);
align-items: center;
}
.ri-close-circle-fill,
.ri-add-circle-fill {
cursor: pointer;
}
</style>

60
packages/builder/src/components/integration/QueryFieldsBuilder.svelte
View file

@ -8,6 +8,7 @@
Select,
} from "@budibase/bbui"
import Editor from "./QueryEditor.svelte"
import KeyValueBuilder from "./KeyValueBuilder.svelte"
export let fields = {}
export let schema
@ -27,53 +28,21 @@
fields.customData = detail.value
}
function updateSubfieldName({ names, definition }) {
console.log(names, definition)
const temp = definition[names.old]
definition[names.new] = temp
delete definition[names.old]
// fields = fields
}
// function addCustomField() {
// }
// function removeCustomField() {
// }
</script>
<form on:submit|preventDefault>
<div class="field">
{#each schemaKeys as field}
<!-- New Stuff -->
{#if schema.fields[field]?.type === "object"}
<Label extraSmall grey>{field}</Label>
<div class="inner-fields">
{#each Object.keys(fields[field] || {}) as subfield}
<Input outline thin on:change={e => updateSubfieldName({
names: {
new: e.target.value,
old: subfield
},
definition: fields[field]
})}
/>
<Input outline bind:value={fields[field][subfield]} />
<i class="ri-close-circle-fill" on:click={() => {
delete fields[field][subfield]
fields[field] = fields[field]
}} />
{/each}
</div>
<i class="ri-add-circle-fill" on:click={() => {
// set new empty field
fields[field] = {
...fields[field] || {},
[""]: ""
}
}} />
<KeyValueBuilder bind:object={fields[field]} />
{:else if schema.fields[field]?.type === "json"}
<Label extraSmall grey>{field}</Label>
<Editor
mode="json"
on:change={({ detail }) => fields[field] = detail.value}
readOnly={!editable}
value={fields[field]} />
{:else}
<Input
label={field}
@ -97,10 +66,6 @@
{/if}
<style>
form {
width: 600px;
}
.field {
margin-bottom: var(--spacing-m);
display: grid;
@ -109,11 +74,4 @@
align-items: center;
}
.inner-fields {
margin-bottom: var(--spacing-m);
display: grid;
grid-template-columns: 1fr 1fr 20px;
grid-gap: var(--spacing-m);
align-items: center;
}
</style>

8
packages/builder/src/components/integration/QueryViewer.svelte
View file

@ -181,7 +181,13 @@
{#if data}
<Switcher headings={PREVIEW_HEADINGS} bind:value={tab}>
{#if tab === 'JSON'}
<pre class="preview">{JSON.stringify(data[0], undefined, 2)}</pre>
<pre class="preview">
{#if !data[0]}
Please run your query to fetch some data.
{:else}
{JSON.stringify(data[0], undefined, 2)}
{/if}
</pre>
{:else if tab === 'PREVIEW'}
<ExternalDataSourceTable {query} {data} />
{:else if tab === 'SCHEMA'}

2
packages/server/src/api/index.js
View file

@ -53,6 +53,8 @@ router.use(async (ctx, next) => {
router.get("/health", ctx => (ctx.status = 200))
router.post("/yeet", ctx => (ctx.body = ctx.request.body))
router.use(authRoutes.routes())
router.use(authRoutes.allowedMethods())

1
packages/server/src/integrations/Integration.js
View file

@ -10,4 +10,5 @@ exports.FIELD_TYPES = {
PASSWORD: "password",
LIST: "list",
OBJECT: "object",
JSON: "json",
}

2
packages/server/src/integrations/airtable.js
View file

@ -50,7 +50,7 @@ const SCHEMA = {
},
},
delete: {
type: FIELD_TYPES.JSON,
type: QUERY_TYPES.JSON,
},
},
}

77
packages/server/src/integrations/rest.js
View file

@ -11,6 +11,20 @@ const SCHEMA = {
},
},
query: {
create: {
type: QUERY_TYPES.FIELDS,
fields: {
path: {
type: FIELD_TYPES.STRING,
},
headers: {
type: FIELD_TYPES.OBJECT,
},
requestBody: {
type: FIELD_TYPES.JSON,
},
},
},
read: {
type: QUERY_TYPES.FIELDS,
fields: {
@ -22,6 +36,34 @@ const SCHEMA = {
},
},
},
update: {
type: QUERY_TYPES.FIELDS,
fields: {
path: {
type: FIELD_TYPES.STRING,
},
headers: {
type: FIELD_TYPES.OBJECT,
},
requestBody: {
type: FIELD_TYPES.JSON,
},
},
},
delete: {
type: QUERY_TYPES.FIELDS,
fields: {
path: {
type: FIELD_TYPES.STRING,
},
headers: {
type: FIELD_TYPES.OBJECT,
},
requestBody: {
type: FIELD_TYPES.JSON,
},
},
},
},
}
@ -30,9 +72,15 @@ class RestIntegration {
this.config = config
}
// create(query) {
// return this.query(query)
// }
async create({ path, headers = {}, requestBody }) {
const response = await fetch(this.config.url + path, {
method: "POST",
headers,
body: requestBody,
})
return await response.json()
}
async read({ path, headers = {} }) {
const response = await fetch(this.config.url + path, {
@ -42,13 +90,24 @@ class RestIntegration {
return await response.json()
}
// update(query) {
// return this.query(query)
// }
async update({ path, headers = {}, requestBody }) {
const response = await fetch(this.config.url + path, {
method: "POST",
headers,
body: requestBody,
})
// delete(query) {
// return this.query(query)
// }
return await response.json()
}
async delete({ path, headers = {} }) {
const response = await fetch(this.config.url + path, {
method: "DELETE",
headers,
})
return await response.json()
}
}
module.exports = {