mohiit1502/Automata
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: Enable cred setup for workflows created from templates (no-changelog) (#8240)

Browse Source 
## Summary

Enable users to open credential setup for workflows that have been
created from templates if they skip it.

Next steps (will be their own PRs):
- Add telemetry events
- Add e2e test
- Hide the button when user sets up all the credentials
- Change the feature flag to a new one

## Related tickets and issues

https://linear.app/n8n/issue/ADO-1637/feature-support-template-credential-setup-for-http-request-nodes-that
This commit is contained in:
Tomi Turtiainen
2024-01-05 18:07:57 +02:00
committed by GitHub
parent df5d07bcb8
commit 3cf6704dbb
22 changed files with 858 additions and 560 deletions
Download Patch File Download Diff File Expand all files Collapse all files

156
packages/editor-ui/src/stores/ui.store.ts
View File

@@ -38,6 +38,7 @@ import {
N8N_PRICING_PAGE_URL,
WORKFLOW_HISTORY_VERSION_RESTORE,
SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY,
SETUP_CREDENTIALS_MODAL_KEY,
} from '@/constants';
import type {
CloudUpdateLinkSourceType,
@@ -84,67 +85,47 @@ try {
}
} catch (e) {}
export type UiStore = ReturnType<typeof useUIStore>;
export const useUIStore = defineStore(STORES.UI, {
state: (): UIState => ({
activeActions: [],
activeCredentialType: null,
theme: savedTheme,
modals: {
[ABOUT_MODAL_KEY]: {
open: false,
},
[CHAT_EMBED_MODAL_KEY]: {
open: false,
},
[CHANGE_PASSWORD_MODAL_KEY]: {
open: false,
},
[CONTACT_PROMPT_MODAL_KEY]: {
open: false,
},
[CREDENTIAL_SELECT_MODAL_KEY]: {
open: false,
},
...Object.fromEntries(
[
ABOUT_MODAL_KEY,
CHAT_EMBED_MODAL_KEY,
CHANGE_PASSWORD_MODAL_KEY,
CONTACT_PROMPT_MODAL_KEY,
CREDENTIAL_SELECT_MODAL_KEY,
DUPLICATE_MODAL_KEY,
ONBOARDING_CALL_SIGNUP_MODAL_KEY,
PERSONALIZATION_MODAL_KEY,
INVITE_USER_MODAL_KEY,
TAGS_MANAGER_MODAL_KEY,
VALUE_SURVEY_MODAL_KEY,
VERSIONS_MODAL_KEY,
WORKFLOW_LM_CHAT_MODAL_KEY,
WORKFLOW_SETTINGS_MODAL_KEY,
WORKFLOW_SHARE_MODAL_KEY,
WORKFLOW_ACTIVE_MODAL_KEY,
COMMUNITY_PACKAGE_INSTALL_MODAL_KEY,
MFA_SETUP_MODAL_KEY,
SOURCE_CONTROL_PUSH_MODAL_KEY,
SOURCE_CONTROL_PULL_MODAL_KEY,
EXTERNAL_SECRETS_PROVIDER_MODAL_KEY,
DEBUG_PAYWALL_MODAL_KEY,
WORKFLOW_HISTORY_VERSION_RESTORE,
SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY,
SETUP_CREDENTIALS_MODAL_KEY,
].map((modalKey) => [modalKey, { open: false }]),
),
[DELETE_USER_MODAL_KEY]: {
open: false,
activeId: null,
},
[DUPLICATE_MODAL_KEY]: {
open: false,
},
[ONBOARDING_CALL_SIGNUP_MODAL_KEY]: {
open: false,
},
[PERSONALIZATION_MODAL_KEY]: {
open: false,
},
[INVITE_USER_MODAL_KEY]: {
open: false,
},
[TAGS_MANAGER_MODAL_KEY]: {
open: false,
},
[VALUE_SURVEY_MODAL_KEY]: {
open: false,
},
[VERSIONS_MODAL_KEY]: {
open: false,
},
[WORKFLOW_LM_CHAT_MODAL_KEY]: {
open: false,
},
[WORKFLOW_SETTINGS_MODAL_KEY]: {
open: false,
},
[WORKFLOW_SHARE_MODAL_KEY]: {
open: false,
},
[WORKFLOW_ACTIVE_MODAL_KEY]: {
open: false,
},
[COMMUNITY_PACKAGE_INSTALL_MODAL_KEY]: {
open: false,
},
[COMMUNITY_PACKAGE_CONFIRM_MODAL_KEY]: {
open: false,
mode: '',
@@ -155,9 +136,6 @@ export const useUIStore = defineStore(STORES.UI, {
curlCommand: '',
httpNodeParameters: '',
},
[MFA_SETUP_MODAL_KEY]: {
open: false,
},
[LOG_STREAM_MODAL_KEY]: {
open: false,
data: undefined,
@@ -168,24 +146,6 @@ export const useUIStore = defineStore(STORES.UI, {
activeId: null,
showAuthSelector: false,
},
[SOURCE_CONTROL_PUSH_MODAL_KEY]: {
open: false,
},
[SOURCE_CONTROL_PULL_MODAL_KEY]: {
open: false,
},
[EXTERNAL_SECRETS_PROVIDER_MODAL_KEY]: {
open: false,
},
[DEBUG_PAYWALL_MODAL_KEY]: {
open: false,
},
[WORKFLOW_HISTORY_VERSION_RESTORE]: {
open: false,
},
[SUGGESTED_TEMPLATES_PREVIEW_MODAL_KEY]: {
open: false,
},
},
modalStack: [],
sidebarMenuCollapsed: true,
@@ -463,17 +423,6 @@ export const useUIStore = defineStore(STORES.UI, {
return name !== openModalName;
});
},
closeAllModals(): void {
Object.keys(this.modals).forEach((name) => {
if (this.modals[name].open) {
this.modals[name] = {
...this.modals[name],
open: false,
};
}
});
this.modalStack = [];
},
draggableStartDragging(type: string, data: string): void {
this.draggable = {
isDragging: true,
@@ -672,3 +621,44 @@ export const useUIStore = defineStore(STORES.UI, {
},
},
});
/**
* Helper function for listening to credential changes in the store
*/
export const listenForModalChanges = (opts: {
store: UiStore;
onModalOpened?: (name: keyof Modals) => void;
onModalClosed?: (name: keyof Modals) => void;
}): void => {
const { store, onModalClosed, onModalOpened } = opts;
const listeningForActions = ['openModal', 'openModalWithData', 'closeModal'];
store.$onAction((result) => {
const { name, after, args } = result;
after(async () => {
if (!listeningForActions.includes(name)) {
return;
}
switch (name) {
case 'openModal': {
const modalName = args[0];
onModalOpened?.(modalName);
break;
}
case 'openModalWithData': {
const { name: modalName } = args[0] ?? {};
onModalOpened?.(modalName);
break;
}
case 'closeModal': {
const modalName = args[0];
onModalClosed?.(modalName);
break;
}
}
});
});
};