From b4a6eb594d503590a3e9855cb33154740a67e59b Mon Sep 17 00:00:00 2001
From: Kevin Ansfield <kevin@lookingsideways.co.uk>
Date: Tue, 18 May 2021 16:08:03 +0100
Subject: [PATCH] Converted `<GhSiteIframe>` to a glimmer component

no issue

- updated to class syntax and glimmer component behaviour
- tidied up and standardised usage of the component
---
 ghost/admin/app/components/gh-site-iframe.hbs |  9 +++++-
 ghost/admin/app/components/gh-site-iframe.js  | 29 +++++++++----------
 .../app/components/modal-portal-settings.hbs  |  4 +--
 .../app/templates/settings/membership.hbs     |  5 +---
 4 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/ghost/admin/app/components/gh-site-iframe.hbs b/ghost/admin/app/components/gh-site-iframe.hbs
index 241cdd358d..db1910017f 100644
--- a/ghost/admin/app/components/gh-site-iframe.hbs
+++ b/ghost/admin/app/components/gh-site-iframe.hbs
@@ -1 +1,8 @@
-<iframe id="site-frame" class="site-frame {{this.classNames}}" src={{this.srcUrl}} frameborder="0" allowtransparency="true" ...attributes></iframe>
\ No newline at end of file
+<iframe
+    class="site-frame"
+    src={{this.srcUrl}}
+    frameborder="0"
+    allowtransparency="true"
+    {{did-update this.resetSrcAttribute @guid}}
+    ...attributes
+></iframe>
\ No newline at end of file
diff --git a/ghost/admin/app/components/gh-site-iframe.js b/ghost/admin/app/components/gh-site-iframe.js
index ca535f0cc8..97adf18870 100644
--- a/ghost/admin/app/components/gh-site-iframe.js
+++ b/ghost/admin/app/components/gh-site-iframe.js
@@ -1,26 +1,23 @@
-import Component from '@ember/component';
-import {computed} from '@ember/object';
+import Component from '@glimmer/component';
+import {action} from '@ember/object';
 import {inject as service} from '@ember/service';
 
-export default Component.extend({
-    config: service(),
+export default class GhSiteIframeComponent extends Component {
+    @service config;
 
-    tagName: '',
+    get srcUrl() {
+        return this.args.src || `${this.config.get('blogUrl')}/`;
+    }
 
-    srcUrl: computed('src', function () {
-        return this.src || `${this.config.get('blogUrl')}/`;
-    }),
-
-    didReceiveAttrs() {
+    @action
+    resetSrcAttribute(iframe) {
         // reset the src attribute each time the guid changes - allows for
         // a click on the navigation item to reset back to the homepage
-        if ((this.guid !== this._lastGuid) || (this.src !== this._lastSrc)) {
-            let iframe = document.querySelector('#site-frame');
+        if (this.args.guid !== this._lastGuid) {
             if (iframe) {
-                iframe.src = this.src || `${this.config.get('blogUrl')}/`;
+                iframe.src = this.srcUrl;
             }
         }
-        this._lastGuid = this.guid;
-        this._lastSrc = this.src;
+        this._lastGuid = this.args.guid;
     }
-});
+}
diff --git a/ghost/admin/app/components/modal-portal-settings.hbs b/ghost/admin/app/components/modal-portal-settings.hbs
index 5b83db413a..e9fb9695f7 100644
--- a/ghost/admin/app/components/modal-portal-settings.hbs
+++ b/ghost/admin/app/components/modal-portal-settings.hbs
@@ -242,10 +242,8 @@
             <div class="gh-portal-preview-container {{if this.showLinksPage "hide"}}">
                 <div class="gh-portal-site-frame-cover"> </div>
                 <GhSiteIframe
-                    @guid="portal-preview-site"
                     @src={{this.portalPreviewUrl}}
-                    @classNames="gh-portal-siteiframe {{if this.hidePreviewFrame "invisible"}}"
-                ></GhSiteIframe>
+                    class="gh-portal-siteiframe {{if this.hidePreviewFrame "invisible"}}" />
             </div>
 
         </div>
diff --git a/ghost/admin/app/templates/settings/membership.hbs b/ghost/admin/app/templates/settings/membership.hbs
index 319c480747..3e550cda1e 100644
--- a/ghost/admin/app/templates/settings/membership.hbs
+++ b/ghost/admin/app/templates/settings/membership.hbs
@@ -51,10 +51,7 @@
                     {{#if (eq this.settings.membersSignupAccess 'none')}}
                         PORTAL DISABLED
                     {{else}}
-                        <GhSiteIframe
-                            @src={{this.portalPreviewUrl}}
-                            @classNames="{{if this.hidePreviewFrame "invisible"}}"
-                        ></GhSiteIframe>
+                        <GhSiteIframe @src={{this.portalPreviewUrl}} />
                     {{/if}}
                 </div>
             </div>