Adding mailing superpowers

.env

@@ -1,17 +1,26 @@
 #
 # This is the default env config.
-# Please create a `.env.local` file (you can copy the .env.local.example file)
+# Please create a `.env.local` file
+# (you can copy and edit the .env.local.example file)
 # to override this vars with your own configuration.
 #
 # See https://github.com/bkeepers/dotenv#what-other-env-files-can-i-use
 
-# =========================================================================
+# =============================================================================
 
 
 # Port for the API webserver
 PORT=3232
 
 API_HOST=api.luua.io
+APP_HOST=luua.io
 
-# If you want to setup a ngrox prox
+# Override in .env.local if you want to setup a ngrox prox
 NGROK_TUNNEL=false
+
+# Override in .env.local
+# if you want to deliver emails (for real) during local development
+LOCAL_MAILER=false
+
+# The sender of the mails
+MAIL_SENDER="hello@luua.io"

.env.local.example

@@ -21,3 +21,12 @@ NGROK_INSPECT=
 
 # DSN for sentry errors
 SENTRY_DSN=
+
+# SMTP parameters
+SMTP_ADDRESS=
+SMTP_PORT=
+SMTP_USER_NAME=
+SMTP_PASSWORD=
+SMTP_DOMAIN=
+SMTP_AUTHENTICATION=
+SMTP_ENABLE_STARTTLS_AUTO=

app/controllers/api/workspace_invitations_controller.rb

@@ -79,7 +79,6 @@ def create
     end
   end
 
-
   def workspace_invitation_params
     params.require(:workspace_invitation).permit(
       :id,

app/controllers/api/workspace_users_controller.rb

@@ -59,7 +59,6 @@ def create
     end
   end
 
-
   def workspace_user_params
     params.require(:workspace_user).permit(
       :id,

app/interactors/accept_workspace_invitation.rb

@@ -1,6 +1,6 @@
-# 
+#
 # When a user accept an invitation to join a workspace
-# 
+#
 class AcceptWorkspaceInvitation
   include Interactor
 
@@ -46,7 +46,6 @@ def replace_notification!(context)
   end
 
   def add_member!(context)
-
     # We add the user to the workspace
     wu = WorkspaceUser.new(
       workspace: context.workspace_invitation.workspace,

app/interactors/reject_workspace_invitation.rb

@@ -1,6 +1,6 @@
-# 
+#
 # When a user reject an invitation to join a workspace
-# 
+#
 class RejectWorkspaceInvitation
   include Interactor
 

app/mailers/user_mailer.rb

@@ -0,0 +1,10 @@
+class UserMailer < Devise::Mailer
+
+  include Devise::Controllers::UrlHelpers # Optional. eg. `confirmation_url`
+  default template_path: 'devise/mailer' # to make sure that your mailer uses the devise views
+  # If there is an object in your application that returns a contact email, you can use it as follows
+  # Note that Devise passes a Devise::Mailer object to your proc, hence the parameter throwaway (*).
+  default from: ->(*) { Class.instance.email_address }
+
+  # @TODO remove hardcoded frontend url in mailer template, and find a better solution
+end

app/models/ability.rb

@@ -9,7 +9,7 @@ def admin_ability(_user)
   end
 
   # For normal authed users
-  def regular_ability(user)
+  def regular_ability(user) # rubocop:todo Metrics/AbcSize
     can :manage, User, id: user.id
     can :read, Skill, skill_type: :global
     can :read, Skill, skill_type: :organization, organization: { id: user.organization_ids }
@@ -25,7 +25,7 @@ def regular_ability(user)
     can %i[create update destroy], Mission, created_by: user.id
 
     can %i[manage], MissionUser, mission: { workspace: { id: user.admin_workspace_ids } }
-    can %i[accept complete reject], MissionUser, user_id: user.id
+    can %i[complete reject], MissionUser, user_id: user.id
     can %i[read], MissionUser, user_id: user.id
 
     can %i[apply], Mission

app/serializers/notification_serializer.rb

@@ -33,7 +33,7 @@ def resource
     when 'MissionUser'
       MissionUserLightSerializer.new.serialize(object.resource)
     when 'WorkspaceInvitation'
-      puts "~~~~~~~~~~~~ß"
+      puts '~~~~~~~~~~~~ß'
       puts object.inspect
       puts object.resource.inspect
       WorkspaceInvitationSerializer.new.serialize(object.resource)

app/views/devise/mailer/confirmation_instructions.html.erb

@@ -0,0 +1,5 @@
+<p>Welcome <%= @email %>!</p>
+
+<p>You can confirm your account email through the link below:</p>
+
+<p><%= link_to 'Confirm my account', "#{ENV['APP_HOST']}/users/confirm/#{@token}" %></p>

app/views/devise/mailer/email_changed.html.erb

@@ -0,0 +1,7 @@
+<p>Hello <%= @email %>!</p>
+
+<% if @resource.try(:unconfirmed_email?) %>
+  <p>We're contacting you to notify you that your email is being changed to <%= @resource.unconfirmed_email %>.</p>
+<% else %>
+  <p>We're contacting you to notify you that your email has been changed to <%= @resource.email %>.</p>
+<% end %>

app/views/devise/mailer/password_change.html.erb

@@ -0,0 +1,3 @@
+<p>Hello <%= @resource.email %>!</p>
+
+<p>We're contacting you to notify you that your password has been changed.</p>

app/views/devise/mailer/reset_password_instructions.html.erb

@@ -0,0 +1,8 @@
+<p>Hello <%= @resource.email %>!</p>
+
+<p>Someone has requested a link to change your password. You can do this through the link below.</p>
+
+<p><%= link_to 'Change my password', edit_password_url(@resource, reset_password_token: @token) %></p>
+
+<p>If you didn't request this, please ignore this email.</p>
+<p>Your password won't change until you access the link above and create a new one.</p>

app/views/devise/mailer/unlock_instructions.html.erb

@@ -0,0 +1,7 @@
+<p>Hello <%= @resource.email %>!</p>
+
+<p>Your account has been locked due to an excessive number of unsuccessful sign in attempts.</p>
+
+<p>Click the link below to unlock your account:</p>
+
+<p><%= link_to 'Unlock my account', unlock_url(@resource, unlock_token: @token) %></p>

app/views/layouts/mailer.html.erb

@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+    <style>
+      /* Email styles need to be inline */
+    </style>
+  </head>
+
+  <body>
+    <%= yield %>
+  </body>
+</html>

app/views/layouts/mailer.text.erb

@@ -0,0 +1 @@
+<%= yield %>

config/credentials.yml.enc

@@ -1 +1 @@
-e7TzobyqYxdCH+HCAKjK718zhARDtc3ZW3mQQMJO86zcqq2f8eWa0h9OR1duey5mrga/IVOnQieNj7EtCE72lmKvl6kGOLgz+VyHw/bSEa9X8mcVkWXd+0wTHrDhTa7Pwb3wnydJorhG7K06WZ+haHBhzetX/MFcXjNxMjkeQtkbKNra47/Ps3+xMiBoLZrr7DfefaKRGUCtpTPpqblmW3WBkj/NyU+GGJnGJxT3OkeHdSZ/R15h8+a1ENgMCpkbyKuEsHz9dI1sVfMpQj6CzSqrj8PHo2f8UOI5Tmln71CoF1TiO3h8YxTAFfPbVmlbS+bf2e6DOGClczc=--70RfF1kKSVQLzYQI--RDOXXs2CbclT/g7zTW7Png==
+c/7pDprpYYeryanEW0CEKwqhUs1Nj/vSzqSzOy5cWAokny5lfWmwR5jcJ0gfIdzypgJnSKlweDN1qYqLhkk8duNQCkw7/hf2iTBMHEl7EvezepUcnqdatN+39kHOiMqMZE6t5npIqniFdJ2rlWUBWh647oJVwdS7niEVHO5JnMJBFHDB6kTUlNqEbGPVAuObEqieb61NS8lLlvEJtzgQQneXgpM/X+lDWN9pbyeneciHcO/CoZGrOnSf5YZBOqzdN7jw6svb7ezB0qSp8v3h586NuDeTTZGiVVya5GuW6ymPNG9ttc5GynYtXH/B0usuHDr2ks/vTpEG0vEYYejnQGgF5sgqDfjsBn0fRhAMo60kpwBlTJsJuVN7rpgX2b0jwvuPhrA2mfNQl33J05m3wyedaUMc+1I0ojzRPS9q57G+GNtFqPZdbCwOJ2sBb2lodf0OAxlhVR0mRGs2e7+ZlMaNo3TJJO8Lw/CiQvhktQ5PB9EAZoWZI87Wx3qrZ8r50/k7ckJ0Tvi89a1j5TWtUgZfiTB8K/IL0iUqrBdhIH6DkB8g4/j4FT/MOW8NDgqo0IpX/VFj6p4GvWi/y8LQ8jb3sgbJxbw=--WYrB8lgql6krUgdQ--1L0cncORYZ2EZN6QRTSVQA==

config/environments/development.rb

@@ -63,6 +63,25 @@
   # routes, locales, etc. This feature depends on the listen gem.
   config.file_watcher = ActiveSupport::EventedFileUpdateChecker
 
+  if ENV['LOCAL_MAILER'] == 'true'
+    puts '📩  Warning: Mailer is activated, mails will be sent for real'
+
+    config.action_mailer.delivery_method = :smtp
+    config.action_mailer.perform_deliveries = true
+
+    mail_metadatas = {
+      address: ENV['SMTP_ADDRESS'] || Rails.application.credentials.smtp_address,
+      port: ENV['SMTP_PORT'] || Rails.application.credentials.smtp_port,
+      user_name: ENV['SMTP_USER_NAME'] || Rails.application.credentials.smtp_user_name,
+      password: ENV['SMTP_PASSWORD'] || Rails.application.credentials.smtp_password,
+      domain: ENV['SMTP_DOMAIN'] || Rails.application.credentials.smtp_domain,
+      authentication: ENV['SMTP_AUTHENTICATION'] || Rails.application.credentials.smtp_authentication || 'login',
+      enable_starttls_auto: ENV['SMTP_ENABLE_STARTTLS_AUTO'] || Rails.application.credentials.smtp_enable_starttls_auto || true
+    }
+
+    config.action_mailer.smtp_settings = mail_metadatas
+  end
+
   # If we want to boot ngrok and we're running a server
   # We create a tunnel and update our postmark hooks with it
   if ENV['NGROK_TUNNEL'] == 'true' && Rails.const_defined?('Server')

config/environments/production.rb

@@ -1,4 +1,4 @@
-Rails.application.configure do
+Rails.application.configure do # rubocop:todo Metrics/BlockLength
   # Settings specified here will take precedence over those in config/application.rb.
 
   # Code is not reloaded between requests.
@@ -63,6 +63,21 @@
   config.action_mailer.perform_caching = false
   config.action_mailer.default_url_options = { host: 'localhost', port: 3000 }
 
+  config.action_mailer.default_url_options = { host: ENV['API_HOST'] || 'luua.io' }
+  config.action_mailer.delivery_method = :smtp
+
+  mail_metadatas = {
+    address: ENV['SMTP_ADDRESS'] || Rails.application.credentials.smtp_address,
+    port: ENV['SMTP_PORT'] || Rails.application.credentials.smtp_port,
+    user_name: ENV['SMTP_USER_NAME'] || Rails.application.credentials.smtp_user_name,
+    password: ENV['SMTP_PASSWORD'] || Rails.application.credentials.smtp_password,
+    domain: ENV['SMTP_DOMAIN'] || Rails.application.credentials.smtp_domain,
+    authentication: ENV['SMTP_AUTHENTICATION'] || Rails.application.credentials.smtp_authentication || 'login',
+    enable_starttls_auto: ENV['SMTP_ENABLE_STARTTLS_AUTO'] || Rails.application.credentials.smtp_enable_starttls_auto || true
+  }
+
+  config.action_mailer.smtp_settings = mail_metadatas
+
   # Ignore bad email addresses and do not raise email delivery errors.
   # Set this to true and configure the email server for immediate delivery to raise delivery errors.
   # config.action_mailer.raise_delivery_errors = false

config/initializers/devise.rb

@@ -28,7 +28,7 @@ def http_auth_body
   # Configure the e-mail address which will be shown in Devise::Mailer,
   # note that it will be overwritten if you use your own mailer class
   # with default "from" parameter.
-  config.mailer_sender = 'please-change-me-at-config-initializers-devise@example.com'
+  config.mailer_sender = ENV['MAIL_SENDER']
 
   # Configure the class responsible to send e-mails.
   # config.mailer = 'Devise::Mailer'

config/routes.rb

@@ -69,7 +69,6 @@
       patch :read_all, on: :collection
     end
 
-
     resources :mission_users do
       concerns :mission_users_actions
     end

frontend/components/LoginForm/LoginForm.tsx

@@ -13,9 +13,11 @@ import MessageBox from '../../elements/MessageBox/MessageBox';
 import ROUTES from '../../routes/manage';
 import Link from 'next/link';
 
-interface Props { }
+interface Props {
+  email?: string
+}
 
-const SignupForm = () => {
+const SignupForm = (props: Props) => {
 
   const { t } = useLocale()
   const Yup = YupWithLocale()
@@ -47,7 +49,7 @@ const SignupForm = () => {
   };
 
   const initialValues = {
-    email: '',
+    email: props.email || '',
     password: '',
   }
 

frontend/components/NetworkBoudary/NetworkBoudary.tsx

@@ -21,6 +21,7 @@ const NetworkBoundary = <T extends unknown>(
       return (<>
         <p>Network error !</p>
         <p>{error && error.message}</p>
+        {error?.response?.data && <pre>{JSON.stringify(error?.response?.data, null, 2)}</pre>}
       </>)  
     case 'loading':
       return (<>
@@ -32,7 +33,15 @@ const NetworkBoundary = <T extends unknown>(
         return <>{children}</>
       }
     default:
-      throw new Error("No status");
+      if (children && data) {
+        return <>{children}</>
+      } else {
+        console.error("No status");
+        return (<>
+          <p>Loading...</p>
+          {error && <p>{error.message}</p>}
+        </>)  
+      }
   }
 }
 

frontend/i18n/locales/fr/common.json

@@ -217,6 +217,9 @@
     "cancel": "Annuler",
     "back": "Retour",
     "user": {
+      "confirm": {
+        "title": "Votre adresse email a bien été confirmée !"
+      },
       "sign-up": {
         "submit": "Créer mon compte",
         "no-account": "Pas encore de compte ?"

frontend/pages/manage/[workspace_id]/candidates/[id]/index.tsx

@@ -15,7 +15,10 @@ import { useLocale } from '../../../../../hooks/useLocale'
 const { manage } = routes
 const { workspace } = manage
 
-const MissionUser = (
+/**
+ * Show the current mission status for a user
+ */
+const Candidate = (
   { initialData, token }:
   { initialData: MissionUser, token?: string }
 ) => {
@@ -41,8 +44,8 @@ const MissionUser = (
   )
 }
 
-MissionUser.getInitialProps = async (ctx: NextPageContext) => {
+Candidate.getInitialProps = async (ctx: NextPageContext) => {
   return await fetchInitialData<MissionUser>(ctx, `/api/mission_users/${ctx.query.id}`)
 }
 
-export default withAuthSync(MissionUser)
+export default withAuthSync(Candidate)

frontend/pages/manage/[workspace_id]/candidates/index.tsx

@@ -9,7 +9,6 @@ import NetworkBoundary from '../../../../components/NetworkBoudary/NetworkBoudar
 import MissionUserList from '../../../../components/MissionUserList/MissionList'
 
 import ContentLayout from '../../../../layouts/ContentLayout/ContentLayout'
-import ManageLeftMenu from '../../../../layouts/ManageLeftMenu/ManageLeftMenu'
 import PageTitle from '../../../../elements/PageTitle/PageTitle';
 import WorkspaceHeader from '../../../../components/WorkspaceHeader/WorkspaceHeader';
 import WorkspaceContext from '../../../../contexts/WorkspaceContext';

frontend/pages/manage/[workspace_id]/contributors/[id]/index.tsx

@@ -15,7 +15,10 @@ import { useLocale } from '../../../../../hooks/useLocale'
 const { manage } = routes
 const { workspace } = manage
 
-const MissionUser = (
+/**
+ * Show the current mission status for a user
+ */
+const Contributor = (
   { initialData, token }:
   { initialData: MissionUser, token?: string }
 ) => {
@@ -39,8 +42,8 @@ const MissionUser = (
   )
 }
 
-MissionUser.getInitialProps = async (ctx: NextPageContext) => {
+Contributor.getInitialProps = async (ctx: NextPageContext) => {
   return await fetchInitialData<MissionUser>(ctx, `/api/mission_users/${ctx.query.id}`)
 }
 
-export default withAuthSync(MissionUser)
+export default withAuthSync(Contributor)

frontend/pages/manage/[workspace_id]/contributors/index.tsx

@@ -10,7 +10,6 @@ import NetworkBoundary from '../../../../components/NetworkBoudary/NetworkBoudar
 import MissionUserList from '../../../../components/MissionUserList/MissionList'
 
 import ContentLayout from '../../../../layouts/ContentLayout/ContentLayout'
-import ManageLeftMenu from '../../../../layouts/ManageLeftMenu/ManageLeftMenu'
 import PageTitle from '../../../../elements/PageTitle/PageTitle';
 import { useContext } from 'react';
 import WorkspaceContext from '../../../../contexts/WorkspaceContext';
@@ -22,7 +21,7 @@ const { workspace } = manage
 /**
  * Will list all the contributors for our workspace's missions
  */
-const Candidates = (
+const Contributors = (
   { initialData, token }:
   { initialData: MissionUser[], token?: string }
 ) => {
@@ -47,10 +46,10 @@ const Candidates = (
       </NetworkBoundary>
   )
 }
-Candidates.getInitialProps = async (ctx: any) => {
+Contributors.getInitialProps = async (ctx: any) => {
   return await fetchInitialData<MissionUser[]>(
     ctx, `/api/workspaces/${ctx.query.workspace_id}/mission_users/contributors`
   )
 }
 
-export default withAuthSync(Candidates)
+export default withAuthSync(Contributors)