diff --git a/app/assets/javascripts/discourse/components/generated-invite-link.js.es6 b/app/assets/javascripts/discourse/components/generated-invite-link.js.es6
new file mode 100644
index 00000000000..be1c34fb3d2
--- /dev/null
+++ b/app/assets/javascripts/discourse/components/generated-invite-link.js.es6
@@ -0,0 +1,6 @@
+export default Ember.Component.extend({
+  didInsertElement() {
+    this._super();
+    this.$('input').select().focus();
+  }
+});
diff --git a/app/assets/javascripts/discourse/controllers/invite.js.es6 b/app/assets/javascripts/discourse/controllers/invite.js.es6
index 03d848e6a22..e9293ea8059 100644
--- a/app/assets/javascripts/discourse/controllers/invite.js.es6
+++ b/app/assets/javascripts/discourse/controllers/invite.js.es6
@@ -1,5 +1,6 @@
 import ModalFunctionality from 'discourse/mixins/modal-functionality';
 import { emailValid } from 'discourse/lib/utilities';
+import computed from 'ember-addons/ember-computed-decorators';
 
 export default Ember.Controller.extend(ModalFunctionality, {
   userInvitedShow: Ember.inject.controller('user-invited-show'),
@@ -11,6 +12,17 @@ export default Ember.Controller.extend(ModalFunctionality, {
   customMessage: null,
   inviteIcon: "envelope",
 
+  @computed('isMessage', 'invitingToTopic')
+  title(isMessage, invitingToTopic) {
+    if (isMessage) {
+      return 'topic.invite_private.title';
+    } else if (invitingToTopic) {
+      return 'topic.invite_reply.title';
+    } else {
+      return 'user.invited.create';
+    }
+  },
+
   isAdmin: function(){
     return Discourse.User.currentProp("admin");
   }.property(),
@@ -120,9 +132,7 @@ export default Ember.Controller.extend(ModalFunctionality, {
   },
 
   successMessage: function() {
-    if (this.get('model.inviteLink')) {
-      return I18n.t('user.invited.generated_link_message', {inviteLink: this.get('model.inviteLink'), invitedEmail: this.get('emailOrUsername')});
-    } else if (this.get('hasGroups')) {
+    if (this.get('hasGroups')) {
       return I18n.t('topic.invite_private.success_group');
     } else if (this.get('isMessage')) {
       return I18n.t('topic.invite_private.success');
diff --git a/app/assets/javascripts/discourse/templates/components/generated-invite-link.hbs b/app/assets/javascripts/discourse/templates/components/generated-invite-link.hbs
new file mode 100644
index 00000000000..09d02aae71a
--- /dev/null
+++ b/app/assets/javascripts/discourse/templates/components/generated-invite-link.hbs
@@ -0,0 +1,5 @@
+<p>{{i18n "user.invited.link_generated"}}</p>
+<p>
+  <input class='invite-link-input' style='width: 75%' type='text' value={{link}}>
+</p>
+<p>{{i18n "user.invited.valid_for" email=email}}</p>
diff --git a/app/assets/javascripts/discourse/templates/modal/invite.hbs b/app/assets/javascripts/discourse/templates/modal/invite.hbs
index 2ffca0e33dc..b61593b1fb6 100644
--- a/app/assets/javascripts/discourse/templates/modal/invite.hbs
+++ b/app/assets/javascripts/discourse/templates/modal/invite.hbs
@@ -1,4 +1,4 @@
-<div class="modal-body invite-modal">
+{{#d-modal-body id="invite-modal" title=title}}
   {{#if model.error}}
     <div class="alert alert-error">
       <button class="close" data-dismiss="alert">×</button>
@@ -6,7 +6,11 @@
     </div>
   {{/if}}
   {{#if model.finished}}
-    {{{successMessage}}}
+    {{#if model.inviteLink}}
+      {{generated-invite-link link=model.inviteLink email=emailOrUsername}}
+    {{else}}
+      {{{successMessage}}}
+    {{/if}}
   {{else}}
     <label>{{inviteInstructions}}</label>
     {{#if allowExistingMembers}}
@@ -44,7 +48,8 @@
     {{/if}}
 
   {{/if}}
-</div>
+{{/d-modal-body}}
+
 <div class="modal-footer">
   {{#if model.finished}}
     {{d-button class="btn-primary" action="closeModal" label="close"}}
diff --git a/app/assets/javascripts/discourse/views/invite.js.es6 b/app/assets/javascripts/discourse/views/invite.js.es6
deleted file mode 100644
index 811097ec144..00000000000
--- a/app/assets/javascripts/discourse/views/invite.js.es6
+++ /dev/null
@@ -1,24 +0,0 @@
-import ModalBodyView from "discourse/views/modal-body";
-
-export default ModalBodyView.extend({
-  templateName: 'modal/invite',
-
-  title: function() {
-    if (this.get('controller.isMessage')) {
-      return I18n.t('topic.invite_private.title');
-    } else if (this.get('controller.invitingToTopic')) {
-      return I18n.t('topic.invite_reply.title');
-    } else {
-      return I18n.t('user.invited.create');
-    }
-  }.property('controller.{invitingToTopic,isMessage}'),
-
-  inviteLinkChanged: function() {
-    if (!Ember.isEmpty(this.get('controller.model.inviteLink'))) {
-      Em.run.next(function() {
-        $('.invite-link-input').select().focus();
-      });
-    }
-  }.observes('controller.model.inviteLink')
-
-});
diff --git a/config/locales/client.en.yml b/config/locales/client.en.yml
index 3a00814e541..26fbdbaa1a2 100644
--- a/config/locales/client.en.yml
+++ b/config/locales/client.en.yml
@@ -771,7 +771,8 @@ en:
         account_age_days: "Account age in days"
         create: "Send an Invite"
         generate_link: "Copy Invite Link"
-        generated_link_message: '<p>Invite link generated successfully!</p><p><input class="invite-link-input" style="width: 75%;" type="text" value="%{inviteLink}"></p><p>Invite link is only valid for this email address: <b>%{invitedEmail}</b></p>'
+        link_generated: "Invite link generated successfully!"
+        valid_for: "Invite link is only valid for this email address: %{email}"
         bulk_invite:
           none: "You haven't invited anyone here yet. You can send individual invites, or invite a bunch of people at once by <a href='https://meta.discourse.org/t/send-bulk-invites/16468'>uploading a bulk invite file</a>."
           text: "Bulk Invite from File"