Infrastructure/ghost
0
Fork 0
mirror of https://github.com/TryGhost/Ghost.git synced 2025-02-10 23:36:14 -05:00
Code Issues Activity

Added autocompletion to Lexical button urls

Browse source 
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
1 changed files with 32 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
ghost/admin/app/components/koenig-lexical-editor.js
View file

@ -5,6 +5,7 @@ import ghostPaths from 'ghost-admin/utils/ghost-paths';
import {action} from '@ember/object';
import {inject} from 'ghost-admin/decorators/inject';
import {inject as service} from '@ember/service';
import {task} from 'ember-concurrency';
export const fileTypes = {
image: {
@ -127,8 +128,10 @@ export default class KoenigLexicalEditor extends Component {
@service feature;
@service ghostPaths;
@service session;
@service store;
@inject config;
offers = null;
@action
onError(error) {
@ -146,8 +149,17 @@ export default class KoenigLexicalEditor extends Component {
// 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) => {
const fetchEmbed = async (url, {type}) => {
const fetchEmbed = async (url, {type}) => {
let oembedEndpoint = this.ghostPaths.url.api('oembed');
let response = await this.ajax.request(oembedEndpoint, {
data: {url, type}
@ -155,6 +167,23 @@ export default class KoenigLexicalEditor extends Component {
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 = {
unsplash: {
defaultHeaders: {
@ -166,7 +195,8 @@ export default class KoenigLexicalEditor extends Component {
}
},
tenor: this.config.tenor?.googleApiKey ? this.config.tenor : null,
fetchEmbed: fetchEmbed
fetchEmbed: fetchEmbed,
fetchAutocompleteLinks
};
const cardConfig = Object.assign({}, defaultCardConfig, props.cardConfig);