Code change:
export class WelcomeDialogService implements IWelcomeDialogService { declare readonly _serviceBrand: undefined; <del> private dialog: Dialog | undefined; private disposableStore: DisposableStore = new DisposableStore(); </del> constructor( <del> @ILayoutService private readonly layoutService: ILayoutService, @IInstantiationService private readonly instantiationService: IInstantiationService) { } private static iconWidgetFor(icon: string) { const themeIcon = ThemeIcon.fromId(icon); if (themeIcon) { const widget = $(ThemeIcon.asCSSSelector(themeIcon)); widget.classList.add('icon-widget'); return widget; } return ''; </del> <ins> @IDialogService private readonly dialogService: IDialogService) { </ins> } async show(welcomeDialogItem: IWelcomeDialogItem): Promise<void> { <del> this.disposableStore.clear(); const renderBody = (parent: HTMLElement) => { parent.classList.add(...('dialog-items')); parent.appendChild(document.createElement('hr')); </del> <ins> const renderBody = (icon: string, message: string): MarkdownString => { const mds = new MarkdownString(undefined, { supportThemeIcons: true, supportHtml: true }); mds.appendMarkdown(`<a>$(${icon})</a>`); mds.appendMarkdown(message); return mds; }; </ins> <del> for (const message of welcomeDialogItem.messages) { const descriptorComponent = $('.dialog-message', {}, WelcomeDialogService.iconWidgetFor(message.icon), $('.description-container', {}, $('.description.description.max-lines-3', { 'x-description-for': 'description' }, ...renderLabelWithIcons(message.message)))); parent.appendChild(descriptorComponent); } </del> <ins> const hr = new MarkdownString(undefined, { supportThemeIcons: true, supportHtml: true }); hr.appendMarkdown('<hr>'); </ins> <del> const actionsContainer = $('div.dialog-action-container'); parent.appendChild(actionsContainer); if (welcomeDialogItem.action) { this.disposableStore.add(this.instantiationService.createInstance(Link, actionsContainer, welcomeDialogItem.action, {})); } }; </del> <ins> const link = new MarkdownString(undefined, { supportThemeIcons: true, supportHtml: true }); if (welcomeDialogItem.action) { link.appendLink(welcomeDialogItem.action.href, welcomeDialogItem.action.label as string); } </ins> <del> this.dialog = new Dialog( this.layoutService.container, welcomeDialogItem.title, [welcomeDialogItem.buttonText], { detail: '', type: 'none', renderBody: renderBody, </del> <ins> await this.dialogService.prompt({ type: 'none', message: welcomeDialogItem.title, cancelButton: welcomeDialogItem.buttonText, custom: { </ins> disableCloseAction: true, <del> buttonStyles: defaultButtonStyles, checkboxStyles: defaultCheckboxStyles, inputBoxStyles: defaultInputBoxStyles, dialogStyles: defaultDialogStyles }); </del> <ins> markdownDetails: [ { markdown: hr, classes: ['hr'] }, ...welcomeDialogItem.messages.map(value => { return { markdown: renderBody(value.icon, value.message), classes: ['message-body'] }; }), { markdown: link, classes: ['link'] } ] } }); </ins> <del> this.disposableStore.add(this.dialog); await this.dialog.show(); </del> welcomeDialogItem.onClose?.(); <del> this.disposableStore.dispose(); </del> } }

Related discussion:
text: Related: ! A better user experience for blocking/deferring subsequent modal dialogs needs to be implemented.