Ghost/ghost/admin/app/templates/settings/labs.hbs

<section class="gh-canvas">
    <GhCanvasHeader class="gh-canvas-header">
        <div class="flex flex-column">
            <div class="gh-canvas-breadcrumb">
                <LinkTo @route="settings">
                    Settings
                </LinkTo>
                {{svg-jar "arrow-right-small"}} Labs
            </div>
            <h2 class="gh-canvas-title" data-test-screen-title>
                Labs
            </h2>
        </div>
    </GhCanvasHeader>

    <section class="view-container settings-debug">
        <p class="gh-box gh-box-tip">{{svg-jar "idea"}}This is a testing ground for new or experimental features. They may change, break or inexplicably disappear at any time.</p>

        <div class="gh-main-section">
            <h4 class="gh-main-section-header small bn">Migration options</h4>
            <div class="gh-expandable {{if this.importErrors "overflow-hidden"}}">
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Import content</h4>
                            <p class="gh-expandable-description">Import posts from a JSON or zip file</p>
                        </div>
                        <LinkTo @route="settings.labs.import" class="gh-btn" data-test-link="import-content">
                            <span>Open Importer</span>
                        </LinkTo>
                    </div>
                </div>

                {{#if this.feature.migrateApp}}
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Migrate content</h4>
                            <p class="gh-expandable-description">Import your content from Substack</p>
                        </div>
                        <LinkTo @route="migrate" class="gh-btn" data-test-link="migrate">
                            <span>Open</span>
                        </LinkTo>
                    </div>
                </div>
                {{/if}}

                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Export your content</h4>
                            <p class="gh-expandable-description">Download all of your posts and settings in a single, glorious JSON file</p>
                        </div>
                        <button type="button" class="gh-btn" {{action "downloadFile" "db"}}><span>Export</span></button>
                    </div>
                </div>

                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Delete all content</h4>
                            <p class="gh-expandable-description">Permanently delete all posts and tags from the database, a hard reset</p>
                        </div>
                        <button type="button" class="gh-btn gh-btn-red" {{on "click" this.confirmDeleteAll}} data-test-button="delete-all"><span>Delete</span></button>
                    </div>
                </div>
            </div>
        </div>

        <div class="gh-main-section">
            <h4 class="gh-main-section-header small bn">Beta features</h4>
            <div class="gh-expandable">
                <div class="gh-expandable-block">
                    <GhUploader
                        @extensions={{this.redirectsFileExtensions}}
                        @uploadUrl="/redirects/upload/"
                        @paramName="redirects"
                        @onUploadSuccess={{perform this.redirectUploadResult true}}
                        @onUploadFailure={{perform this.redirectUploadResult false}}
                        as |uploader|
                    >
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Redirects</h4>
                            <p class="gh-expandable-description">Configure redirects for old or moved content, more info in <a href="https://ghost.org/tutorials/implementing-redirects/" target="_blank" rel="noopener noreferrer">the docs</a></p>
                        </div>
                        <div class="gh-setting-action flex flex-column items-end">
                            {{#if uploader.isUploading}}
                                {{uploader.progressBar}}
                            {{else}}
                                <button
                                    type="button"
                                    class="gh-btn gh-btn-icon {{if this.redirectSuccess "gh-btn-green"}} {{if this.redirectFailure "gh-btn-red"}}"
                                    onclick={{action "triggerFileDialog"}}
                                    data-test-button="upload-redirects"
                                >
                                    <span>
                                        {{#if this.redirectSuccess}}
                                            {{svg-jar "check-circle"}} Uploaded
                                        {{else if this.redirectFailure}}
                                            {{svg-jar "retry"}} Upload Failed
                                        {{else}}
                                            Upload redirects YAML/JSON
                                        {{/if}}
                                    </span>
                                </button>
                                <div><a href="#" {{action "downloadFile" "redirects/download"}} data-test-link="download-redirects">Download current redirects</a></div>
                            {{/if}}

                            {{#each uploader.errors as |error|}}
                                <div class="gh-setting-error" data-test-error="redirects">{{or error.context error.message}}</div>
                            {{/each}}

                            <div style="display:none">
                                <GhFileInput @multiple={{false}} @action={{uploader.setFiles}} @accept={{this.redirectsFileMimeTypes}} data-test-file-input="redirects" />
                            </div>
                        </div>
                    </div>
                    </GhUploader>
                </div>

                <div class="gh-expandable-block">
                    <GhUploader
                        @extensions={{this.yamlExtension}}
                        @uploadUrl="/settings/routes/yaml/"
                        @paramName="routes"
                        @onUploadSuccess={{perform this.routesUploadResult true}}
                        @onUploadFailure={{perform this.routesUploadResult false}}
                        as |uploader|
                    >
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Routes</h4>
                            <p class="gh-expandable-description">Configure dynamic routing by modifying the routes.yaml file</p>
                        </div>
                        <div class="gh-setting-action flex flex-column items-end">
                            {{#if uploader.isUploading}}
                                {{uploader.progressBar}}
                            {{else}}
                                <button
                                    type="button"
                                    class="gh-btn gh-btn-icon {{if this.routesSuccess "gh-btn-green"}} {{if this.routesFailure "gh-btn-red"}}"
                                    onclick={{action "triggerFileDialog"}}
                                    data-test-button="upload-routes"
                                >
                                    <span>
                                        {{#if this.routesSuccess}}
                                            {{svg-jar "check-circle"}} Uploaded
                                        {{else if this.routesFailure}}
                                            {{svg-jar "retry"}} Upload Failed
                                        {{else}}
                                            Upload routes YAML
                                        {{/if}}
                                    </span>
                                </button>
                                <div><a href="#" {{action "downloadFile" "settings/routes/yaml"}} data-test-link="download-routes">Download current routes.yaml</a></div>
                            {{/if}}

                            {{#each uploader.errors as |error|}}
                                <div class="gh-setting-error" data-test-error="routes">{{or error.context error.message}}</div>
                            {{/each}}

                            <div style="display:none">
                                <GhFileInput @multiple={{false}} @action={{uploader.setFiles}} @accept={{this.yamlAccept}} data-test-file-input="routes" />
                            </div>
                        </div>
                    </div>
                    </GhUploader>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Enable Portal translations (beta)</h4>
                            <p class="gh-expandable-description">
                               Enable support for translations in the members signup/login system
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="i18n" />
                        </div>
                    </div>
                </div>
            </div>
        </div>


        {{#if (enable-developer-experiments)}}
         <div class="gh-main-section">
            <h4 class="gh-main-section-header small bn">Alpha Features</h4>
            <div class="gh-expandable">
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">URL cache</h4>
                            <p class="gh-expandable-description">
                               Enable URL Caching
                            </p>
                        </div>
                        <div class="for-switch">
                           <GhFeatureFlag @flag="urlCache" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Lexical editor</h4>
                            <p class="gh-expandable-description">
                               Makes lexical editor the default when creating new posts/pages.
                            </p>
                        </div>
                        <div class="for-switch">
                           <GhFeatureFlag @flag="lexicalEditor" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Lexical multiplayer</h4>
                            <p class="gh-expandable-description">
                                Enables multiplayer editing in the lexical editor.
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="lexicalMultiplayer" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Webmentions</h4>
                            <p class="gh-expandable-description">
                                Allows viewing received mentions on the dashboard.
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="webmentions" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Show email errors</h4>
                            <p class="gh-expandable-description">
                                This makes email errors visible in the UI.
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="emailErrors" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Websockets</h4>
                            <p class="gh-expandable-description">
                                Test out Websockets functionality at <code>/ghost/#/websockets</code>.
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="websockets" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Stripe Automatic Tax</h4>
                            <p class="gh-expandable-description">
                               Use Stripe Automatic Tax at Stripe Checkout. Needs to be enabled in Stripe
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="stripeAutomaticTax" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Making it rain</h4>
                            <p class="gh-expandable-description">
                               Building momentum in the eyes of our publishers.
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="makingItRain" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Migrate content</h4>
                            <p class="gh-expandable-description">
                               Import content from other platforms to Ghost
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="migrateApp" />
                        </div>
                    </div>
                </div>
                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Post history</h4>
                            <p class="gh-expandable-description">
                                Enables post history revision within the editor
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="postHistory" />
                        </div>
                    </div>
                </div>

                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Revision Diffing</h4>
                            <p class="gh-expandable-description">
                                Enables showing post history differences within the editor
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="postDiffing" />
                        </div>
                    </div>
                </div>

                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Image Editor</h4>
                            <p class="gh-expandable-description">
                                Allows publishers to edit images in the lexical editor
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="imageEditor" />
                        </div>
                    </div>
                </div>

                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Signup Card</h4>
                            <p class="gh-expandable-description">
                                Enables the signup card in the Lexical editor
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="signupCard" />
                        </div>
                    </div>
                </div>

                <div class="gh-expandable-block">
                    <div class="gh-expandable-header">
                        <div>
                            <h4 class="gh-expandable-title">Collections</h4>
                            <p class="gh-expandable-description">
                                Enables Collections 2.0
                            </p>
                        </div>
                        <div class="for-switch">
                            <GhFeatureFlag @flag="collections" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {{/if}}
    </section>
</section>