diff --git a/ghost/admin/app/components/gh-member-avatar.js b/ghost/admin/app/components/gh-member-avatar.js
index e225a6ea9c..6c7c909f94 100644
--- a/ghost/admin/app/components/gh-member-avatar.js
+++ b/ghost/admin/app/components/gh-member-avatar.js
@@ -1,5 +1,4 @@
-import Component from '@ember/component';
-import {computed} from '@ember/object';
+import Component from '@glimmer/component';
 import {htmlSafe} from '@ember/string';
 
 const stringToHslColor = function (str, saturation, lightness) {
@@ -12,33 +11,24 @@ const stringToHslColor = function (str, saturation, lightness) {
     return 'hsl(' + h + ', ' + saturation + '%, ' + lightness + '%)';
 };
 
-export default Component.extend({
-    tagName: '',
-    containerClass: '',
-    member: null,
-    initialsClass: computed('sizeClass', function () {
-        return this.sizeClass || 'gh-member-list-avatar';
-    }),
+export default class GhMemberAvatarComponent extends Component {
+    get memberName() {
+        let {member} = this.args;
+        return member.name || member.email || 'NM';
+    }
 
-    backgroundStyle: computed('member.{name,email}', function () {
-        let name = this.member.name || this.member.email || 'NM';
-        if (name) {
-            let color = stringToHslColor(name, 55, 55);
-            return htmlSafe(`background-color: ${color}`);
+    get backgroundStyle() {
+        let color = stringToHslColor(this.memberName, 55, 55);
+        return htmlSafe(`background-color: ${color}`);
+    }
+
+    get initials() {
+        if (this.memberName === 'NM') {
+            return 'NM';
         }
 
-        return htmlSafe('');
-    }),
-
-    initials: computed('member.{name,email}', function () {
-        let name = this.member.name || this.member.email;
-        if (name) {
-            let names = name.split(' ');
-            let intials = names.length > 1 ? [names[0][0], names[names.length - 1][0]] : [names[0][0]];
-            return intials.join('').toUpperCase();
-        }
-
-        // New Member initials
-        return 'NM';
-    })
-});
+        let names = this.memberName.split(' ');
+        let intials = names.length > 1 ? [names[0][0], names[names.length - 1][0]] : [names[0][0]];
+        return intials.join('').toUpperCase();
+    }
+}
diff --git a/ghost/admin/app/templates/components/gh-member-avatar.hbs b/ghost/admin/app/templates/components/gh-member-avatar.hbs
index e6e14e2ebe..d5d847c1d2 100644
--- a/ghost/admin/app/templates/components/gh-member-avatar.hbs
+++ b/ghost/admin/app/templates/components/gh-member-avatar.hbs
@@ -1,6 +1,6 @@
-<figure class="gh-member-gravatar {{this.containerClass}}">
-    <div class="gh-member-initials flex items-center justify-center br-100 {{this.containerClass}}" style={{this.backgroundStyle}}>
-        <span class="gh-member-avatar-label {{this.initialsClass}}">{{this.initials}}</span>
+<figure class="gh-member-gravatar {{@containerClass}}">
+    <div class="gh-member-initials flex items-center justify-center br-100 {{@containerClass}}" style={{this.backgroundStyle}}>
+        <span class="gh-member-avatar-label {{or @sizeClass "gh-member-list-avatar"}}">{{this.initials}}</span>
     </div>
-    <img class="gh-member-avatar-image" src={{gravatar this.member.email size=180}} />
+    <img class="gh-member-avatar-image" src={{gravatar @member.email size=180}} />
 </figure>
\ No newline at end of file