diff --git a/frontend/src/lib/components/AppConnectDrawer.svelte b/frontend/src/lib/components/AppConnectDrawer.svelte index 9cbd28edbd..28cb801616 100644 --- a/frontend/src/lib/components/AppConnectDrawer.svelte +++ b/frontend/src/lib/components/AppConnectDrawer.svelte @@ -6,6 +6,8 @@ import AppConnectInner from './AppConnectInner.svelte' import DarkModeObserver from './DarkModeObserver.svelte' + let expressOAuthSetup = false + let drawer: Drawer let resourceType = '' let step = 1 @@ -16,12 +18,17 @@ let appConnectInner: AppConnectInner | undefined = undefined let rtToLoad: string | undefined = '' - export async function open(rt?: string) { + export async function open(rt?: string, express?: boolean) { + expressOAuthSetup = express ?? false rtToLoad = rt drawer.openDrawer?.() } - $: appConnectInner?.open(rtToLoad) + $: appConnectInner && onRtToLoadChange(rtToLoad) + + function onRtToLoadChange(rtToLoad: string | undefined) { + appConnectInner?.open(rtToLoad, expressOAuthSetup) + } const dispatch = createEventDispatcher() diff --git a/frontend/src/lib/components/AppConnectInner.svelte b/frontend/src/lib/components/AppConnectInner.svelte index a1556bf7fc..848fb69922 100644 --- a/frontend/src/lib/components/AppConnectInner.svelte +++ b/frontend/src/lib/components/AppConnectInner.svelte @@ -1,5 +1,5 @@ {#each Object.keys(components['userresourcecomponent'].initialData.configuration) as key (key)} @@ -90,6 +95,8 @@
{ assignValue(e.detail) diff --git a/frontend/src/lib/components/apps/editor/component/Component.svelte b/frontend/src/lib/components/apps/editor/component/Component.svelte index e6d04022b1..d67708e65c 100644 --- a/frontend/src/lib/components/apps/editor/component/Component.svelte +++ b/frontend/src/lib/components/apps/editor/component/Component.svelte @@ -79,6 +79,7 @@ import AppDateSelect from '../../components/inputs/AppDateSelect.svelte' import AppDisplayComponentByJobId from '../../components/display/AppRecomputeAll.svelte' import AppRecomputeAll from '../../components/display/AppRecomputeAll.svelte' + import AppUserResource from '../../components/inputs/AppUserResource.svelte' export let component: AppComponent export let selected: boolean @@ -434,6 +435,14 @@ onSelect={component.onSelect} {render} /> + {:else if component.type === 'userresourcecomponent'} + {:else if component.type === 'multiselectcomponent'} & RecomputeOthersSource & { onSelect?: string[] } +export type ResourceConnectComponent = BaseComponent<'userresourcecomponent'> & + RecomputeOthersSource & { + onSelect?: string[] + } export type MultiSelectComponent = BaseComponent<'multiselectcomponent'> export type MultiSelectComponentV2 = BaseComponent<'multiselectcomponentv2'> export type CheckboxComponent = BaseComponent<'checkboxcomponent'> & @@ -361,6 +365,7 @@ export type TypedComponent = | DateSelectComponent | JobIdDisplayComponent | RecomputeAllComponent + | ResourceConnectComponent export type AppComponent = BaseAppComponent & TypedComponent @@ -2216,7 +2221,7 @@ This is a paragraph. } }, resourceselectcomponent: { - name: 'Resource Select', + name: 'Static Resource Select', icon: List, documentationLink: `${documentationBaseUrl}/resource_select`, dims: '2:1-3:1' as AppComponentDimensions, @@ -2254,6 +2259,38 @@ This is a paragraph. } } }, + userresourcecomponent: { + name: 'User Resource Input', + icon: List, + documentationLink: `${documentationBaseUrl}/resource_select`, + dims: '2:1-3:1' as AppComponentDimensions, + customCss: { + input: { style: '' } + }, + initialData: { + verticalAlignment: 'center', + componentInput: undefined, + configuration: { + resourceType: { + type: 'static', + fieldType: 'text', + value: 'postgresql' + }, + expressOauthSetup: { + type: 'static', + fieldType: 'boolean', + value: false, + tooltip: + 'If enabled, skip some steps while adding oauth resources: No scopes to set prior to OAuth sign-in, and no path to set after OAuth sign-in' + }, + disabled: { + type: 'static', + fieldType: 'boolean', + value: false + } + } + } + }, numberinputcomponent: { name: 'Number', icon: Binary, diff --git a/frontend/src/lib/components/apps/editor/component/sets.ts b/frontend/src/lib/components/apps/editor/component/sets.ts index 9113a3d404..dc11ce9268 100644 --- a/frontend/src/lib/components/apps/editor/component/sets.ts +++ b/frontend/src/lib/components/apps/editor/component/sets.ts @@ -54,6 +54,7 @@ const inputs: ComponentSet = { 'checkboxcomponent', 'selectcomponent', 'resourceselectcomponent', + 'userresourcecomponent', 'multiselectcomponentv2', 'selecttabcomponent', 'selectstepcomponent' diff --git a/frontend/src/lib/components/apps/editor/componentsPanel/quickStyleProperties.ts b/frontend/src/lib/components/apps/editor/componentsPanel/quickStyleProperties.ts index 29d17948ad..847075de5a 100644 --- a/frontend/src/lib/components/apps/editor/componentsPanel/quickStyleProperties.ts +++ b/frontend/src/lib/components/apps/editor/componentsPanel/quickStyleProperties.ts @@ -748,6 +748,9 @@ export const quickStyleProperties: Record< resourceselectcomponent: { input: inputDefaultProps }, + userresourcecomponent: { + input: inputDefaultProps + }, verticaldividercomponent: { divider: dividerDefaultProps, container: containerDefaultProps diff --git a/frontend/src/lib/components/apps/editor/settingsPanel/EventHandlers.svelte b/frontend/src/lib/components/apps/editor/settingsPanel/EventHandlers.svelte index ce49fc7578..a048a4fb20 100644 --- a/frontend/src/lib/components/apps/editor/settingsPanel/EventHandlers.svelte +++ b/frontend/src/lib/components/apps/editor/settingsPanel/EventHandlers.svelte @@ -17,6 +17,7 @@ 'formbuttoncomponent', 'checkboxcomponent', 'resourceselectcomponent', + 'userresourcecomponent', 'selectcomponent', 'tabscomponent', 'conditionalwrapper', @@ -64,7 +65,7 @@ bind:value={item.data.onToggle} /> {/if} - {#if item.data.type === 'resourceselectcomponent' || item.data.type === 'selectcomponent'} + {#if item.data.type === 'resourceselectcomponent' || item.data.type === 'selectcomponent' || item.data.type == 'userresourcecomponent'} void showToast?: (message: string, error?: boolean) => void recompute?: () => void + askNewResource?: () => void } > > diff --git a/frontend/src/lib/components/apps/utils.ts b/frontend/src/lib/components/apps/utils.ts index b0a542f5e2..76cb92ec01 100644 --- a/frontend/src/lib/components/apps/utils.ts +++ b/frontend/src/lib/components/apps/utils.ts @@ -267,6 +267,11 @@ declare function showToast(message: string, error?: boolean): void; declare async function waitJob(id: string): Promise; +/** + * ask user resource on a UserResourceComponent + */ +declare async function askNewResource(id: string): void; + ` : '' }