Matt Gowie Gowiem

DeviseInvitable + Rails API + Ember

Intro

In a recent project, I put together Rails API backend and a Ember CLI frontend for one of my awesome clients. With Rails5, Devise, and Ember Simple Auth Devise it's a beaut of a project; Being both a pleasure to work in as well as being an environment which is highly productive. One tiny hill I had to run up while working on this project was using the DeviseInvitable (DV) plugin to create a email invite sign up flow for the app's users. DV adds some out of the box routes and a mailer to your application so you can simply call User.invite!(email: '[email protected]') and it will create a user, assign them an invite token, and set them up so they can sign up via the email that it sends out.

In my project, I needed to make this system work with my Ember only frontend. This was a simple enough process but requir

	{{!-- app/templates/accept-invitation.hbs --}}
	{{#bs-form model=model onSubmit=(route-action "submit" model) as \|f\|}}
	{{f.element controlType="password" label="Password" placeholder="Password" property="password" required=true}}
	{{f.element controlType="password" label="Password Confirmation" placeholder="Password Confirmation" property="password_confirmation" required=true}}
	{{bs-button defaultText="Submit" type="primary" buttonType="submit"}}
	{{/bs-form}}

	# backend/app/controllers/users_invitations_controller.rb
	class UsersInvitationsController < Devise::InvitationsController

	def edit
	sign_out send("current_#{resource_name}") if send("#{resource_name}_signed_in?")
	set_minimum_password_length
	resource.invitation_token = params[:invitation_token]
	redirect_to "http://localhost:8080/users/invitation/accept?invitation_token=#{params[:invitation_token]}"
	end

	# backend/app/controllers/users_invitations_controller.rb
	class UsersInvitationsController < Devise::InvitationsController
	before_action :configure_permitted_parameters

	# ...

	private

	def configure_permitted_parameters
	devise_parameter_sanitizer.permit(:accept_invitation, keys: [:first_name, :last_name])

	# backend/config/routes.rb
	Rails.application.routes.draw do
	devise_for :users, controllers: { invitations: 'users_invitations' }

	# ...

	root to: 'application#root'
	end

	// frontend/app/router.js
	import Ember from 'ember';
	import config from './config/environment';

	const Router = Ember.Router.extend({
	location: config.locationType,
	rootURL: config.rootURL
	});

	Router.map(function() {

	# backend/app/controllers/users_invitations_controller.rb
	class UsersInvitationsController < ApplicationController
	end

	// frontend/app/routes/accept-invitation.js
	import Ember from 'ember';
	import config from '../config/environment';

	const { inject: { service }, isEmpty } = Ember;

	export default Ember.Route.extend({
	session: service('session'),
	beforeModel() {
	if (this.get('session.isAuthenticated')) {

	import Ember from 'ember';

	export default Ember.Mixin.create({
	normalizeQueryResponse(store, clazz, payload) {
	const result = this._super(...arguments);
	result.meta = result.meta \|\| {};

	if (payload.links) {
	result.meta.pagination = this.createPageMeta(payload.links);
	}