MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Changing the API key modal to have a copy input which allows copying the API key easily.

This commit is contained in:
mike12345567 2022-02-28 14:29:19 +00:00
parent 1ecd2f298f
commit 6415abb3d4
6 changed files with 66 additions and 88 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

53
packages/builder/src/components/automation/Shared/WebhookDisplay.svelte
View File

@ -1,5 +1,5 @@
<script>
import { Input, Icon, notifications } from "@budibase/bbui"
import CopyInput from "components/common/inputs/CopyInput.svelte"
export let value
@ -10,55 +10,6 @@
return `${window.location.origin}/${uri}`
}
function copyToClipboard() {
const dummy = document.createElement("textarea")
document.body.appendChild(dummy)
dummy.value = fullWebhookURL(value)
dummy.select()
document.execCommand("copy")
document.body.removeChild(dummy)
notifications.success(`URL copied to clipboard`)
}
</script>
<div>
<Input readonly value={fullWebhookURL(value)} />
<div class="icon" on:click={() => copyToClipboard()}>
<Icon size="S" name="Copy" />
</div>
</div>
<style>
div {
position: relative;
}
.icon {
right: 1px;
bottom: 1px;
position: absolute;
justify-content: center;
align-items: center;
display: flex;
flex-direction: row;
box-sizing: border-box;
border-left: 1px solid var(--spectrum-alias-border-color);
border-top-right-radius: var(--spectrum-alias-border-radius-regular);
border-bottom-right-radius: var(--spectrum-alias-border-radius-regular);
width: 31px;
color: var(--spectrum-alias-text-color);
background-color: var(--spectrum-global-color-gray-75);
transition: background-color
var(--spectrum-global-animation-duration-100, 130ms),
box-shadow var(--spectrum-global-animation-duration-100, 130ms),
border-color var(--spectrum-global-animation-duration-100, 130ms);
height: calc(var(--spectrum-alias-item-height-m) - 2px);
}
.icon:hover {
cursor: pointer;
color: var(--spectrum-alias-text-color-hover);
background-color: var(--spectrum-global-color-gray-50);
border-color: var(--spectrum-alias-border-color-hover);
}
</style>
<CopyInput {value} copyValue={fullWebhookURL(value)} />

58
packages/builder/src/components/common/inputs/CopyInput.svelte Normal file
View File

@ -0,0 +1,58 @@
<script>
import { Input, Icon, notifications } from "@budibase/bbui"
export let label = null
export let value
export let copyValue
const copyToClipboard = val => {
const dummy = document.createElement("textarea")
document.body.appendChild(dummy)
dummy.value = val
dummy.select()
document.execCommand("copy")
document.body.removeChild(dummy)
notifications.success(`URL copied to clipboard`)
}
</script>
<div>
<Input readonly {value} {label} />
<div class="icon" on:click={() => copyToClipboard(value || copyValue)}>
<Icon size="S" name="Copy" />
</div>
</div>
<style>
div {
position: relative;
}
.icon {
right: 1px;
bottom: 1px;
position: absolute;
justify-content: center;
align-items: center;
display: flex;
flex-direction: row;
box-sizing: border-box;
border-left: 1px solid var(--spectrum-alias-border-color);
border-top-right-radius: var(--spectrum-alias-border-radius-regular);
border-bottom-right-radius: var(--spectrum-alias-border-radius-regular);
width: 31px;
color: var(--spectrum-alias-text-color);
background-color: var(--spectrum-global-color-gray-75);
transition: background-color
var(--spectrum-global-animation-duration-100, 130ms),
box-shadow var(--spectrum-global-animation-duration-100, 130ms),
border-color var(--spectrum-global-animation-duration-100, 130ms);
height: calc(var(--spectrum-alias-item-height-m) - 2px);
}
.icon:hover {
cursor: pointer;
color: var(--spectrum-alias-text-color-hover);
background-color: var(--spectrum-global-color-gray-50);
border-color: var(--spectrum-alias-border-color-hover);
}
</style>

5
packages/builder/src/components/settings/UpdateAPIKeyModal.svelte
View File

@ -1,7 +1,8 @@
<script>
import { ModalContent, Body, Input, notifications } from "@budibase/bbui"
import { ModalContent, Body, notifications } from "@budibase/bbui"
import { auth } from "stores/portal"
import { onMount } from "svelte"
import CopyInput from "components/common/inputs/CopyInput.svelte"
let apiKey = null
@ -32,5 +33,5 @@
You can find information about your developer account here, such as the API
key used to access the Budibase API.
</Body>
<Input disabled bind:value={apiKey} label="API key" />
<CopyInput bind:value={apiKey} label="API key" />
</ModalContent>

2
packages/server/package.json
View File

@ -164,8 +164,6 @@
"rimraf": "^3.0.2",
"supertest": "^4.0.2",
"swagger-jsdoc": "^6.1.0",
"@apidevtools/swagger-parser": "^10.0.3",
"swagger-parser": "^10.0.3",
"ts-jest": "^27.0.3",
"ts-node": "^10.0.0",
"typescript": "^4.3.5",

4
packages/server/src/automations/utils.js
View File

@ -5,7 +5,7 @@ const CouchDB = require("../db")
const { queue } = require("./bullboard")
const newid = require("../db/newid")
const { updateEntityMetadata } = require("../utilities")
const { MetadataTypes } = require("../constants")
const { MetadataTypes, WebhookType } = require("../constants")
const { getProdAppID } = require("@budibase/backend-core/db")
const { cloneDeep } = require("lodash/fp")
const { getAppDB, getAppId } = require("@budibase/backend-core/context")
@ -159,7 +159,7 @@ exports.checkForWebhooks = async ({ oldAuto, newAuto }) => {
request: {
body: new webhooks.Webhook(
"Automation webhook",
webhooks.WebhookType.AUTOMATION,
WebhookType.AUTOMATION,
newAuto._id
),
},

32
packages/server/yarn.lock
View File

@ -39,18 +39,6 @@
call-me-maybe "^1.0.1"
z-schema "^4.2.3"
"@apidevtools/swagger-parser@10.0.3", "@apidevtools/swagger-parser@^10.0.3":
version "10.0.3"
resolved "https://registry.yarnpkg.com/@apidevtools/swagger-parser/-/swagger-parser-10.0.3.tgz#32057ae99487872c4dd96b314a1ab4b95d89eaf5"
integrity sha512-sNiLY51vZOmSPFZA5TF35KZ2HbgYklQnTSDnkghamzLb3EkNtcQnrBQEj5AOCxHpTtXpqMCRM1CrmV2rG6nw4g==
dependencies:
"@apidevtools/json-schema-ref-parser" "^9.0.6"
"@apidevtools/openapi-schemas" "^2.0.4"
"@apidevtools/swagger-methods" "^3.0.2"
"@jsdevtools/ono" "^7.1.3"
call-me-maybe "^1.0.1"
z-schema "^5.0.1"
"@azure/abort-controller@^1.0.0":
version "1.0.4"
resolved "https://registry.yarnpkg.com/@azure/abort-controller/-/abort-controller-1.0.4.tgz#fd3c4d46c8ed67aace42498c8e2270960250eafd"
@ -11562,13 +11550,6 @@ swagger-parser@10.0.2:
dependencies:
"@apidevtools/swagger-parser" "10.0.2"
swagger-parser@^10.0.3:
version "10.0.3"
resolved "https://registry.yarnpkg.com/swagger-parser/-/swagger-parser-10.0.3.tgz#04cb01c18c3ac192b41161c77f81e79309135d03"
integrity sha512-nF7oMeL4KypldrQhac8RyHerJeGPD1p2xDh900GPvc+Nk7nWP6jX2FcC7WmkinMoAmoO774+AFXcWsW8gMWEIg==
dependencies:
"@apidevtools/swagger-parser" "10.0.3"
symbol-tree@^3.2.2, symbol-tree@^3.2.4:
version "3.2.4"
resolved "https://registry.yarnpkg.com/symbol-tree/-/symbol-tree-3.2.4.tgz#430637d248ba77e078883951fb9aa0eed7c63fa2"
@ -12299,7 +12280,7 @@ validate.js@0.13.1:
resolved "https://registry.yarnpkg.com/validate.js/-/validate.js-0.13.1.tgz#b58bfac04a0f600a340f62e5227e70d95971e92a"
integrity sha512-PnFM3xiZ+kYmLyTiMgTYmU7ZHkjBZz2/+F0DaALc/uUtVzdCt1wAosvYJ5hFQi/hz8O4zb52FQhHZRC+uVkJ+g==
validator@^13.6.0, validator@^13.7.0:
validator@^13.6.0:
version "13.7.0"
resolved "https://registry.yarnpkg.com/validator/-/validator-13.7.0.tgz#4f9658ba13ba8f3d82ee881d3516489ea85c0857"
integrity sha512-nYXQLCBkpJ8X6ltALua9dRrZDHVYxjJ1wgskNt1lH9fzGjs3tgojGSCBjmEPwkWS1y29+DrizMTW19Pr9uB2nw==
@ -12841,17 +12822,6 @@ z-schema@^4.2.3:
optionalDependencies:
commander "^2.7.1"
z-schema@^5.0.1:
version "5.0.2"
resolved "https://registry.yarnpkg.com/z-schema/-/z-schema-5.0.2.tgz#f410394b2c9fcb9edaf6a7511491c0bb4e89a504"
integrity sha512-40TH47ukMHq5HrzkeVE40Ad7eIDKaRV2b+Qpi2prLc9X9eFJFzV7tMe5aH12e6avaSS/u5l653EQOv+J9PirPw==
dependencies:
lodash.get "^4.4.2"
lodash.isequal "^4.5.0"
validator "^13.7.0"
optionalDependencies:
commander "^2.7.1"
zlib@1.0.5:
version "1.0.5"
resolved "https://registry.yarnpkg.com/zlib/-/zlib-1.0.5.tgz#6e7c972fc371c645a6afb03ab14769def114fcc0"