Start of API key modal.

This commit is contained in:
Michael Drury 2022-02-09 20:30:52 +00:00
parent 2820614324
commit 911f2780ef
4 changed files with 79 additions and 0 deletions

View File

@ -0,0 +1,36 @@
<script>
import { ModalContent, Body, Input, notifications } from "@budibase/bbui"
import { auth } from "stores/portal"
import { onMount } from "svelte"
let apiKey = null
let loaded = false
async function generateAPIKey() {
try {
await auth.generateAPIKey()
notifications.success("New API key generated.")
} catch (err) {
notifications.error("Unable to generate new API key")
}
}
onMount(async () => {
apiKey = auth.fetchAPIKey()
})
</script>
{#if loaded}
<ModalContent
title="Developer information"
showSecondaryButton
secondaryButtonText="Re-generate key"
secondaryButtonAction={generateAPIKey}
>
<Body size="S">
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" />
</ModalContent>
{/if}

View File

@ -19,12 +19,14 @@
import { gradient } from "actions"
import UpdateUserInfoModal from "components/settings/UpdateUserInfoModal.svelte"
import ChangePasswordModal from "components/settings/ChangePasswordModal.svelte"
import UpdateAPIKeyModal from "components/settings/UpdateAPIKeyModal.svelte"
import { processStringSync } from "@budibase/string-templates"
import Logo from "assets/bb-emblem.svg"
let loaded = false
let userInfoModal
let changePasswordModal
let apiKeyModal
onMount(async () => {
try {
@ -81,6 +83,12 @@
<MenuItem icon="UserEdit" on:click={() => userInfoModal.show()}>
Update user information
</MenuItem>
<MenuItem
icon="UserDeveloper"
on:click={() => apiKeyModal.show()}
>
View developer information
</MenuItem>
<MenuItem
icon="LockClosed"
on:click={() => changePasswordModal.show()}
@ -155,6 +163,9 @@
<Modal bind:this={changePasswordModal}>
<ChangePasswordModal />
</Modal>
<Modal bind:this={apiKeyModal}>
<UpdateAPIKeyModal />
</Modal>
{/if}
<style>

View File

@ -172,6 +172,17 @@ export function createAuthStore() {
resetCode,
})
},
generateAPIKey: async () => {
return API.generateAPIKey()
},
fetchAPIKey: async () => {
const info = await API.fetchDeveloperInfo()
if (info?.apiKey) {
return info.apiKey
} else {
return null
}
},
}
return {

View File

@ -126,4 +126,25 @@ export const buildUserEndpoints = API => ({
},
})
},
/**
* Using the logged in user, this will generate a new API key,
* assuming the user is a builder.
* @return {Promise<object>} returns the API response, including an API key.
*/
generateAPIKey: async () => {
return await API.post({
url: "/api/global/users/api/key",
})
},
/**
* retrieves the API key for the logged in user.
* @return {Promise<object>} An object containing the user developer information.
*/
fetchDeveloperInfo: async () => {
return await API.get({
url: "/api/global/users/api/key",
})
},
})