0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-17 23:44:39 -05:00

Added autocompletion to Lexical button urls

fixes https://github.com/TryGhost/Team/issues/3031

This implements the fetchAutocompleteLinks method, which is used by the button and email CTA cards to autocomplete urls.
This commit is contained in:
Simon Backx 2023-04-18 16:24:02 +01:00
parent 56b6fedb72
commit 2738d25cc6

View file

@ -5,6 +5,7 @@ import ghostPaths from 'ghost-admin/utils/ghost-paths';
import {action} from '@ember/object'; import {action} from '@ember/object';
import {inject} from 'ghost-admin/decorators/inject'; import {inject} from 'ghost-admin/decorators/inject';
import {inject as service} from '@ember/service'; import {inject as service} from '@ember/service';
import {task} from 'ember-concurrency';
export const fileTypes = { export const fileTypes = {
image: { image: {
@ -127,8 +128,10 @@ export default class KoenigLexicalEditor extends Component {
@service feature; @service feature;
@service ghostPaths; @service ghostPaths;
@service session; @service session;
@service store;
@inject config; @inject config;
offers = null;
@action @action
onError(error) { onError(error) {
@ -146,6 +149,15 @@ export default class KoenigLexicalEditor extends Component {
// don't rethrow, Lexical will attempt to gracefully recover // don't rethrow, Lexical will attempt to gracefully recover
} }
@task({restartable: true})
*fetchOffersTask() {
if (this.offers) {
return this.offers;
}
this.offers = yield this.store.query('offer', {limit: 'all', filter: 'status:active'});
return this.offers;
}
ReactComponent = (props) => { ReactComponent = (props) => {
const fetchEmbed = async (url, {type}) => { const fetchEmbed = async (url, {type}) => {
let oembedEndpoint = this.ghostPaths.url.api('oembed'); let oembedEndpoint = this.ghostPaths.url.api('oembed');
@ -155,6 +167,23 @@ export default class KoenigLexicalEditor extends Component {
return response; return response;
}; };
const fetchAutocompleteLinks = async () => {
const offers = await this.fetchOffersTask.perform();
const defaults = [
{label: 'Homepage', value: window.location.origin + '/'},
{label: 'Free signup', value: window.location.origin + '/#/portal/signup/free'}
];
const offersLinks = offers.toArray().map((offer) => {
return {
label: `Offer - ${offer.name}`,
value: this.config.getSiteUrl(offer.code)
};
});
return [...defaults, ...offersLinks];
};
const defaultCardConfig = { const defaultCardConfig = {
unsplash: { unsplash: {
defaultHeaders: { defaultHeaders: {
@ -166,7 +195,8 @@ export default class KoenigLexicalEditor extends Component {
} }
}, },
tenor: this.config.tenor?.googleApiKey ? this.config.tenor : null, tenor: this.config.tenor?.googleApiKey ? this.config.tenor : null,
fetchEmbed: fetchEmbed fetchEmbed: fetchEmbed,
fetchAutocompleteLinks
}; };
const cardConfig = Object.assign({}, defaultCardConfig, props.cardConfig); const cardConfig = Object.assign({}, defaultCardConfig, props.cardConfig);