5fec563c5c
* ⚡ Create endpoint for node credential translation * ⚡ Add API helper method in FE * 🔨 Add creds JSON files to tsconfig * ⚡ Refactor credentials loading * ⚡ Refactor calls in CredentialConfig * ✏️ Add dummy translations * ⚡ Split translations per node * 🔥 Remove deprecated method * ⚡ Refactor nesting in collections * 🚚 Rename topParameter methods for accuracy * ✏️ Fill out GitHub dummy cred * 🚚 Clarify naming for collection utils * ✏️ Fill out dummy translation * 🔥 Remove surplus colons * 🔥 Remove logging * ⚡ Restore missing space * 🔥 Remove lingering colon * ⚡ Add path to InputLabel calls * ✏️ Fill out dummy translations * 🐛 Fix multipleValuesButtonText logic * ⚡ Add sample properties to be deleted * ⚡ Render deeply nested params * 📦 Update package-lock.json * 🔥 remove logging * ✏️ Add dummy value to Slack translation * ✏️ Add placeholder to dummy translation * ⚡ Fix placeholder rendering for button text * 👕 Fix lint * 🔥 Remove outdated comment * 🐛 Pass in missing arg for placeholder * ✏️ Fill out Slack translation * ⚡ Add explanatory comment * ✏️ Fill out dummy translation * ✏️ Update documentation * 🔥 Remove broken link * ✏️ Add pending functionality * ✏️ Fix indentation * 🐛 Fix method call in CredentialEdit * ⚡ Implement eventTriggerDescription * 🐛 Fix table-json-binary radio buttons * ✏️ Clarify usage of eventTriggerDescription * 🔥 Remove unneeded arg * 🐛 Fix display in CodeEdit and TextEdit * 🔥 Remove logging * ✏️ Add translation for test cred options * ✏️ Add test for separate file in same dir * ✏️ Add test for versioned node * ✏️ Add test for node in grouped dir * ✏️ Add minor clarifications * ✏️ Add nested collection test * ✏️ Add pending functionality * ⚡ Generalize collections handling * 🚚 Rename helper to remove redundancy * 🚚 Improve naming in helpers * ✏️ Improve helpers documentation * ✏️ Improve i18n methods documentation * 🚚 Make endpoint naming consistent * ✏️ Add final newlines * ✏️ Clean up JSON examples * ⚡ Reuse i18n method * ⚡ Improve utils readability * ⚡ Return early if cred translation exists * 🔥 Remove dummy translations
98 lines
1.9 KiB
Vue
98 lines
1.9 KiB
Vue
<template>
|
|
<div>
|
|
<n8n-input-label :label="label">
|
|
<div :class="$style.copyText" @click="copy">
|
|
<span>{{ copyContent }}</span>
|
|
<div :class="$style.copyButton"><span>{{ copyButtonText }}</span></div>
|
|
</div>
|
|
</n8n-input-label>
|
|
<div :class="$style.subtitle">{{ subtitle }}</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import mixins from 'vue-typed-mixins';
|
|
import { copyPaste } from './mixins/copyPaste';
|
|
import { showMessage } from './mixins/showMessage';
|
|
|
|
export default mixins(copyPaste, showMessage).extend({
|
|
props: {
|
|
label: {
|
|
type: String,
|
|
},
|
|
subtitle: {
|
|
type: String,
|
|
},
|
|
copyContent: {
|
|
type: String,
|
|
},
|
|
copyButtonText: {
|
|
type: String,
|
|
},
|
|
successMessage: {
|
|
type: String,
|
|
},
|
|
},
|
|
methods: {
|
|
copy(): void {
|
|
this.copyToClipboard(this.$props.copyContent);
|
|
|
|
this.$showMessage({
|
|
title: this.$locale.baseText('credentialEdit.credentialEdit.showMessage.title'),
|
|
message: this.$props.successMessage,
|
|
type: 'success',
|
|
});
|
|
},
|
|
},
|
|
});
|
|
</script>
|
|
|
|
<style lang="scss" module>
|
|
|
|
.copyText {
|
|
span {
|
|
font-family: Monaco, Consolas;
|
|
line-height: 1.5;
|
|
font-size: var(--font-size-s);
|
|
}
|
|
|
|
padding: var(--spacing-xs);
|
|
background-color: var(--color-background-light);
|
|
border: var(--border-base);
|
|
border-radius: var(--border-radius-base);
|
|
cursor: pointer;
|
|
position: relative;
|
|
font-weight: var(--font-weight-regular);
|
|
|
|
&:hover {
|
|
--display-copy-button: flex;
|
|
width: 100%;
|
|
}
|
|
}
|
|
|
|
.copyButton {
|
|
display: var(--display-copy-button, none);
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
padding: var(--spacing-xs);
|
|
background-color: var(--color-background-light);
|
|
height: 100%;
|
|
align-items: center;
|
|
border-radius: var(--border-radius-base);
|
|
|
|
span {
|
|
font-family: unset;
|
|
}
|
|
}
|
|
|
|
.subtitle {
|
|
margin-top: var(--spacing-2xs);
|
|
font-size: var(--font-size-2xs);
|
|
line-height: var(--font-line-height-loose);
|
|
font-weight: var(--font-weight-regular);
|
|
word-break: normal;
|
|
}
|
|
|
|
</style>
|