nitro-web 0.1.4 → 0.2.1

package/components/auth/inviteConfirm.tsx

@@ -1,25 +1,29 @@
-import { Topbar, Field, FormError, Button, request, onChange, getResponseErrors, showError } from 'nitro-web'
-import { Errors } from 'nitro-web/types'
+import { Topbar, Field, FormError, Button, request, onChange, getResponseErrors, getSignoutStore, getInitialStore } from 'nitro-web'
+import { Config, Errors } from 'nitro-web/types'
+import { twMerge } from 'nitro-web/util'
 import { Fragment, useEffect } from 'react'
 
 type InviteConfirmProps = {
   className?: string,
   elements?: { Button?: typeof Button, Header?: React.ReactNode },
   redirectTo?: string,
+  config: Pick<Config, 'getSignoutStore'>
 }
 
-export function InviteConfirm({ className, elements, redirectTo }: InviteConfirmProps) {
+export function InviteConfirm({ className, elements, redirectTo, config }: InviteConfirmProps) {
   const navigate = useNavigate()
   const params = useParams()
-  const [store, setStore] = useTracked()
+  const [, setStore] = useTracked()
+  const getSignoutStoreFn = config.getSignoutStore || getSignoutStore
   const [isLoading, setIsLoading] = useState(false)
-  const [accepted, setAccepted] = useState(false)
+  const [isExistingUser, setIsExistingUser] = useState<boolean | 'pending'>('pending')
+  const [isAccepted, setIsAccepted] = useState(false)
   const [state, setState] = useState(() => ({
     firstName: '',
     lastName: '',
     password: '',
     password2: '',
-    token: params.token,
+    email: '',
     errors: [] as Errors,
   }))
 
@@ -28,45 +32,56 @@ export function InviteConfirm({ className, elements, redirectTo }: InviteConfirm
     Header: elements?.Header || null,
   }
 
-  // Auto-confirm on mount for already signed-in users
+  // Get invite details on mount
   useEffect(() => {
-    if (store.user) submit({ token: params.token })
+    preSubmit()
   }, [])
 
+  async function preSubmit() {
+    try {
+      const result = await request(`get /api/invite-pre-confirm/${params.token}`)
+      setIsExistingUser(result.isExistingUser)
+      setState((s) => ({ ...s, email: result.email }))
+      if (result.isExistingUser) submit({ token: params.token })
+    } catch (e) {
+      setState((s) => ({ ...s, errors: getResponseErrors(e) }))
+    }
+  }
+
   async function submit(data: object, event?: React.FormEvent<HTMLFormElement>) {
     try {
       if (isLoading) return
-      const result = await request('post /api/invite-confirm', data, event, setIsLoading, setState)
-      setStore((s) => ({ ...s, ...result }))
-      setAccepted(true)
+      const result = await request(`post /api/invite-confirm/${params.token}`, data, event, setIsLoading, setState)
+      // Only update the store if the user was created AND refreshly signed in
+      if (result?.jwt) setStore((s) => ({ ...getSignoutStoreFn(s, getInitialStore()), ...result }))
+      setIsAccepted(true)
       setTimeout(() => navigate(redirectTo || '/'), 5000)
     } catch (e) {
-      showError(setStore, e)
       setState((s) => ({ ...s, errors: getResponseErrors(e) }))
     }
   }
 
-  if (store.user) {
+  if (isExistingUser || isAccepted) {
     return (
-      <div className={className}>
-        <div class="py-12 text-center">
-          {accepted ? (
-            <Fragment>
-              <p class="text-lg font-semibold">Your invite has been accepted.</p>
-              <p class="text-sm text-gray-500 mt-1">You&apos;ll be redirected back to the <Link to="/">home page</Link> shortly...</p>
-            </Fragment>
-          ) : isLoading ? (
-            <Fragment>
-              <p class="text-lg font-semibold">Accepting your invite...</p>
-              <p class="text-sm text-gray-500 mt-1">Please wait while we confirm your invite.</p>
-            </Fragment>
-          ) : (
-            <Fragment>
-              <p class="text-lg font-semibold mb-2">Oops! Something went wrong.</p>
-              <span class="text-sm text-red-500 bg-red-50 p-1 rounded-md mt-1">{state.errors.map((error) => error.detail).join(', ')}</span>
-            </Fragment>
-          )}
-        </div>
+      <div className={twMerge('min-h-[250px]', className)}>
+        {isAccepted ? (
+          <Fragment>
+            <div class="text-2xl font-bold mb-4">Your invite has been accepted.</div>
+            <p class="">You&apos;ll be redirected back to the <Link to="/">home page</Link> shortly...</p>
+          </Fragment>
+        ) : isExistingUser === 'pending' && !state.errors.length ? (
+          <Fragment>
+            <div class="text-2xl font-bold mb-4">One moment please...</div>
+            <p class="">Verifying your token.</p>
+          </Fragment>
+        ) : (
+          <Fragment>
+            <div class="text-2xl font-bold mb-4">Something went wrong.</div>
+            {state.errors.map((error, i) => {
+              return (<span key={i} class="text-red-500 bg-red-50 p-1 rounded-md">{error.detail} <br /></span>)
+            })}
+          </Fragment>
+        )}
       </div>
     )
   }
@@ -74,19 +89,25 @@ export function InviteConfirm({ className, elements, redirectTo }: InviteConfirm
   return (
     <div className={className}>
       {!!Elements.Header && Elements.Header}
-      <Topbar title={<Fragment>Accept Your Invite</Fragment>} />
+      <Topbar title={<Fragment>Accept Invitation</Fragment>} />
 
       <form onSubmit={(e) => submit(state, e)} class="mb-0">
         <div class="grid grid-cols-2 gap-6">  
           <div>
             <label for="firstName">First Name</label>
-            <Field name="firstName" type="text" state={state} onChange={(e) => onChange(e, setState)} placeholder="Your first name..." />
+            <Field name="firstName" type="text" state={state} onChange={(e) => onChange(e, setState)} placeholder="Your first name..." 
+              autoComplete="given-name" />
           </div>
           <div>
             <label for="lastName">Last Name</label>
-            <Field name="lastName" type="text" state={state} onChange={(e) => onChange(e, setState)} placeholder="Your last name..." />
+            <Field name="lastName" type="text" state={state} onChange={(e) => onChange(e, setState)} placeholder="Your last name..." 
+              autoComplete="off" />
           </div>
         </div>
+        <div>
+          <label for="email">Email Address</label>
+          <Field name="email" type="email" state={state} placeholder="Your email address..." disabled={true} />
+        </div>
         <div>
           <label for="password">Choose a Password</label>
           <Field name="password" type="password" state={state} onChange={(e) => onChange(e, setState)} />
@@ -97,8 +118,7 @@ export function InviteConfirm({ className, elements, redirectTo }: InviteConfirm
         </div>
 
         <div class="mb-14">
-          Already have an account? <Link to="/signin" class="underline2 is-active">Sign in here</Link> first then revisit this link.
-          <FormError state={state} className="pt-2" />
+          <FormError state={state} className="pt-2" fields={['firstName', 'lastName', 'password', 'password2']} />
         </div>
 
         <Elements.Button class="w-full" isLoading={isLoading} type="submit">Accept Invite & Create Account</Elements.Button>

package/components/auth/reset.tsx

@@ -1,5 +1,5 @@
-import { Topbar, Field, FormError, Button, request, onChange } from 'nitro-web'
-import { Errors } from 'nitro-web/types'
+import { Topbar, Field, FormError, Button, request, onChange, getSignoutStore, getInitialStore } from 'nitro-web'
+import { Config, Errors } from 'nitro-web/types'
 import { Fragment } from 'react'
 
 type resetInstructionsProps = {
@@ -8,6 +8,10 @@ type resetInstructionsProps = {
   redirectTo?: string,
 }
 
+type resetPasswordProps = resetInstructionsProps & {
+  config: Pick<Config, 'getSignoutStore'>
+}
+
 export function ResetInstructions({ className, elements, redirectTo }: resetInstructionsProps) {
   const navigate = useNavigate()
   const [isLoading, setIsLoading] = useState(false)
@@ -52,9 +56,10 @@ export function ResetInstructions({ className, elements, redirectTo }: resetInst
   )
 }
 
-export function ResetPassword({ className, elements, redirectTo }: resetInstructionsProps) {
+export function ResetPassword({ className, elements, redirectTo, config }: resetPasswordProps) {
   const navigate = useNavigate()
   const params = useParams()
+  const getSignoutStoreFn = config.getSignoutStore || getSignoutStore
   const [isLoading, setIsLoading] = useState(false)
   const [, setStore] = useTracked()
   const [state, setState] = useState(() => ({
@@ -73,7 +78,7 @@ export function ResetPassword({ className, elements, redirectTo }: resetInstruct
     try {
       if (isLoading) return
       const data = await request('post /api/reset-password', state, event, setIsLoading, setState)
-      setStore((s) => ({ ...s, ...data }))
+      setStore((s) => ({ ...getSignoutStoreFn(s, getInitialStore()), ...data }))
       setTimeout(() => navigate(redirectTo || '/'), 10) // wait for setStore
     } catch (e) {
       return setState({ ...state, errors: e as Errors })

package/components/auth/signin.tsx

@@ -1,5 +1,8 @@
-import { Topbar, Field, Button, FormError, request, queryObject, injectedConfig, updateJwt, onChange } from 'nitro-web'
-import { Errors } from 'nitro-web/types'
+import { 
+  Topbar, Field, Button, FormError, request, queryObject, injectedConfig, updateJwt, onChange, 
+  getSignoutStore, getInitialStore,
+} from 'nitro-web'
+import { Config, Errors } from 'nitro-web/types'
 import { Fragment } from 'react'
 
 type signinProps = {
@@ -7,12 +10,14 @@ type signinProps = {
   elements?: { Button?: typeof Button, Header?: React.ReactNode },
   redirectTo?: string,
   hideSignup?: boolean,
+  config: Pick<Config, 'getSignoutStore'>
 }
 
-export function Signin({ className, elements, redirectTo, hideSignup }: signinProps) {
+export function Signin({ className, elements, redirectTo, hideSignup, config }: signinProps) {
   const navigate = useNavigate()
   const location = useLocation()
   const isSignout = location.pathname == '/signout'
+  const getSignoutStoreFn = config.getSignoutStore || getSignoutStore
   const [isLoading, setIsLoading] = useState(isSignout)
   const [, setStore] = useTracked()
   const [state, setState] = useState({
@@ -32,9 +37,11 @@ export function Signin({ className, elements, redirectTo, hideSignup }: signinPr
     if (query.email) setState({ ...state, email: query.email as string })
   }, [location.search])
 
+
   useEffect(() => {
     if (isSignout) {
-      setStore((s) => ({ ...s, user: undefined }))
+      // Reset the user to the initialStoreData user
+      setStore((s) => getSignoutStoreFn(s, getInitialStore()))
       // util.axios().get('/api/signout')
       Promise.resolve()
         .then(() => setIsLoading(false))
@@ -50,7 +57,7 @@ export function Signin({ className, elements, redirectTo, hideSignup }: signinPr
       const data = await request('post /api/signin', state, e, setIsLoading, setState)
       // Keep it loading until we navigate
       setIsLoading(true)
-      setStore((s) => ({ ...s, ...data }))
+      setStore((s) => ({ ...getSignoutStoreFn(s, getInitialStore()), ...data }))
       setTimeout(() => { // wait for setStore
         if (location.search.includes('redirect')) navigate(location.search.replace('?redirect=', ''))
         else navigate(redirectTo || '/')

package/components/auth/signup.tsx

@@ -1,17 +1,19 @@
-import { Button, Field, FormError, Topbar, request, injectedConfig, onChange } from 'nitro-web'
-import { Errors } from 'nitro-web/types'
+import { Button, Field, FormError, Topbar, request, injectedConfig, onChange, getSignoutStore, getInitialStore } from 'nitro-web'
+import { Config, Errors } from 'nitro-web/types'
 import { Fragment } from 'react'
 
 type signupProps = {
   className?: string,
   elements?: { Button?: typeof Button, Header?: React.ReactNode },
   redirectTo?: string,
+  config: Pick<Config, 'getSignoutStore'>
 }
 
-export function Signup({ className, elements, redirectTo }: signupProps) {
+export function Signup({ className, elements, redirectTo, config }: signupProps) {
   const navigate = useNavigate()
   const [isLoading, setIsLoading] = useState(false)
   const [, setStore] = useTracked()
+  const getSignoutStoreFn = config.getSignoutStore || getSignoutStore
   const [state, setState] = useState({
     email: injectedConfig.env === 'development' ? (injectedConfig.placeholderEmail || '') : '',
     name: injectedConfig.env === 'development' ? 'Bruce Wayne' : '',
@@ -29,7 +31,7 @@ export function Signup({ className, elements, redirectTo }: signupProps) {
     try {
       if (isLoading) return
       const data = await request('post /api/signup', state, e, setIsLoading, setState)
-      setStore((prev) => ({ ...prev, ...data }))
+      setStore((s) => ({ ...getSignoutStoreFn(s, getInitialStore()), ...data }))
       setTimeout(() => navigate(redirectTo || '/'), 10) // wait for setStore
     } catch (e) {
       setState((prev) => ({ ...prev, errors: e as Errors }))

package/components/partials/element/dropdown.tsx

@@ -164,7 +164,7 @@ export const Dropdown = forwardRef(function Dropdown({
         ' nitro-dropdown' +
         (className ? ` ${className}` : '')
       }
-      onClick={(e) => e.stopPropagation()} // required for dropdowns inside row links
+      onClick={(e) => { e.stopPropagation(); e.preventDefault() }} // required for dropdowns inside row links
       ref={dropdownRef} 
       css={style}
     >

package/components/partials/element/table.tsx

@@ -1,7 +1,7 @@
 import { JSX, useState, useCallback, Fragment, useMemo, useEffect } from 'react'
 import { ChevronDownIcon, ChevronUpIcon } from 'lucide-react'
 import { Checkbox, queryObject, queryString, Spinner, twMerge, LoadingWithDots, LoadingOverlay } from 'nitro-web'
-import { useLocation, useNavigate } from 'react-router-dom'
+import { useLocation, useNavigate, Link } from 'react-router-dom'
 
 export type TableRowType = 'row' | 'loading' | 'empty' | 'thead'
 
@@ -36,6 +36,7 @@ export type TableProps<T> = {
   rowSideColor?: (row: T|undefined, type: TableRowType) => { className: string, width: number }
   rowGap?: number
   rowOnClick?: (row: T) => void
+  rowLink?: (row: T) => string
   columnGap?: number
   columnPaddingX?: number
   className?: string
@@ -67,6 +68,7 @@ export function Table<T extends TableRow>({
   rowSideColor,
   rowGap=0,
   rowOnClick,
+  rowLink,
   columnGap=11,
   columnPaddingX=11,
   // Class names
@@ -244,97 +246,97 @@ export function Table<T extends TableRow>({
         {
           rowsToRender.map((row: T, i: number) => {
             const isSelected = selectedRowIds.includes(row._id || '')
+            const Element = (rowLink ? Link : 'div') as React.ElementType
+            const extraProps = rowLink ? { to: rowLink(row) } : { onClick: rowOnClick ? () => rowOnClick(row) : undefined }
             return (
-              <div 
+              <Element
+                {...extraProps}
                 key={`${row._id}-${i}`}
                 id={`row-${row._id}-${i}`}
-                onClick={rowOnClick ? () => rowOnClick(row) : undefined}
                 className={twMerge(
-                  `table-row relative ${rowOnClick ? 'cursor-pointer' : ''} ${isSelected ? 'is-selected' : ''}`,
+                  `table-row relative ${(rowOnClick || rowLink) ? 'cursor-pointer' : ''} ${isSelected ? 'is-selected' : ''}`,
                   rowClassName,
                   rowClassNameFn ? rowClassNameFn(row, i) : ''
                 )}
               >
-                {
-                  columns.map((col, j) => {
-                    const rowType = row._id ? 'row' : isLoading ? 'loading' : 'empty'
-                    const { pl, pr, sideColor } = getColumnPadding(j, isLoading ? undefined : row, rowType)
-                    if (col.isHidden) return <Fragment key={j} />
-                    return (
-                      <div
-                        key={j}
-                        style={{ height: rowHeightMin, paddingLeft: pl, paddingRight: pr }}
+                {columns.map((col, j) => {
+                  const rowType = row._id ? 'row' : isLoading ? 'loading' : 'empty'
+                  const { pl, pr, sideColor } = getColumnPadding(j, isLoading ? undefined : row, rowType)
+                  if (col.isHidden) return <Fragment key={j} />
+                  return (
+                    <div
+                      key={j}
+                      style={{ height: rowHeightMin, paddingLeft: pl, paddingRight: pr }}
+                      className={twMerge(
+                        _columnClassName,
+                        getAlignClass(col.align),
+                        columnClassName,
+                        columnClassNameFn ? columnClassNameFn(col, row, i) : '',
+                        col.className,
+                        isSelected ? `bg-gray-50 ${columnSelectedClassName||''}` : ''
+                      )}
+                    >
+                      <div 
+                        // pl:sideColorPadding was originally here
+                        style={{ maxHeight: rowContentHeightMax }} 
                         className={twMerge(
-                          _columnClassName,
-                          getAlignClass(col.align),
-                          columnClassName,
-                          columnClassNameFn ? columnClassNameFn(col, row, i) : '',
-                          col.className,
-                          isSelected ? `bg-gray-50 ${columnSelectedClassName||''}` : ''
+                          rowContentHeightMax ? 'overflow-hidden' : '',
+                          getLineClampClassName(col.rowLinesMax),
+                          col.overflow ? 'overflow-visible' : '',
+                          col.innerClassName
                         )}
                       >
-                        <div 
-                          // pl:sideColorPadding was originally here
-                          style={{ maxHeight: rowContentHeightMax }} 
-                          className={twMerge(
-                            rowContentHeightMax ? 'overflow-hidden' : '',
-                            getLineClampClassName(col.rowLinesMax),
-                            col.overflow ? 'overflow-visible' : '',
-                            col.innerClassName
-                          )}
-                        >
-                          {
-                            // Side color
-                            sideColor && 
-                            <div 
-                              className={`absolute top-0 left-0 h-full ${sideColor?.className||''}`} 
-                              style={{ width: sideColor.width }}
-                            />
-                          }
-                          {
-                            // Rows (content hidden when loading inline)
-                            row._id &&
-                            <div className={isLoading && showLoadingInline ? 'opacity-0 pointer-events-none' : ''}>
-                              {
-                                col.value == 'checkbox'
-                                  ? <Checkbox 
-                                      size={checkboxSize} 
-                                      name={`checkbox-${row._id}`} 
-                                      onChange={(e) => onSelect(row?._id || '', e.target.checked)}
-                                      checked={selectedRowIds.includes(row?._id || '')}
-                                      onClick={(e) => e.stopPropagation()}
-                                      hitboxPadding={5}
-                                      className='!m-0 py-[5px]' // py-5 is required for hitbox (restricted to tabel cell height)
-                                      checkboxClassName={twMerge('border-foreground shadow-[0_1px_2px_0px_#0000001c]', checkboxClassName)}
-                                    />
-                                  : generateTd(col, row, i, i == rows.length - 1)
-                              }
-                            </div>
-                          }
-                          {
-                            // Show "no records" or "loading" text in the first column
-                            j == 0 && (!row._id || isLoading) &&
-                            <div className={'absolute top-0 h-full flex items-center justify-center gap-3 text-sm text-gray-500'}>
-                              {
-                                (!row._id && !isLoading) ? (
-                                  'No records found.' 
-                                ) : (!row._id && isLoading && showLoadingInline === true) ? (
-                                  <Fragment>
-                                    <Spinner className="border-gray-500" />
-                                    <LoadingWithDots message={loadingMessage} />
-                                  </Fragment>
-                                ) : (!row._id && isLoading && showLoadingInline) ? (
-                                  showLoadingInline
-                                ) : null
-                              }
-                            </div>
-                          }
-                        </div>
+                        {
+                          // Side color
+                          sideColor && 
+                          <div 
+                            className={`absolute top-0 left-0 h-full ${sideColor?.className||''}`} 
+                            style={{ width: sideColor.width }}
+                          />
+                        }
+                        {
+                          // Rows (content hidden when loading inline)
+                          row._id &&
+                          <div className={isLoading && showLoadingInline ? 'opacity-0 pointer-events-none' : ''}>
+                            {
+                              col.value == 'checkbox'
+                                ? <Checkbox 
+                                    size={checkboxSize} 
+                                    name={`checkbox-${row._id}`} 
+                                    onChange={(e) => onSelect(row?._id || '', e.target.checked)}
+                                    checked={selectedRowIds.includes(row?._id || '')}
+                                    onClick={(e) => e.stopPropagation()}
+                                    hitboxPadding={5}
+                                    className='!m-0 py-[5px]' // py-5 is required for hitbox (restricted to tabel cell height)
+                                    checkboxClassName={twMerge('border-foreground shadow-[0_1px_2px_0px_#0000001c]', checkboxClassName)}
+                                  />
+                                : generateTd(col, row, i, i == rows.length - 1)
+                            }
+                          </div>
+                        }
+                        {
+                          // Show "no records" or "loading" text in the first column
+                          j == 0 && (!row._id || isLoading) &&
+                          <div className={'absolute top-0 h-full flex items-center justify-center gap-3 text-sm text-gray-500'}>
+                            {
+                              (!row._id && !isLoading) ? (
+                                'No records found.' 
+                              ) : (!row._id && isLoading && showLoadingInline === true) ? (
+                                <Fragment>
+                                  <Spinner className="border-gray-500" />
+                                  <LoadingWithDots message={loadingMessage} />
+                                </Fragment>
+                              ) : (!row._id && isLoading && showLoadingInline) ? (
+                                showLoadingInline
+                              ) : null
+                            }
+                          </div>
+                        }
                       </div>
-                    )
-                  })
-                }
-              </div>
+                    </div>
+                  )
+                })}
+              </Element>
             )
           })
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nitro-web",
-  "version": "0.1.4",
+  "version": "0.2.1",
   "repository": "github:boycce/nitro-web",
   "homepage": "https://boycce.github.io/nitro-web/",
   "description": "Nitro is a battle-tested, modular base project to turbocharge your projects, styled using Tailwind 🚀",

package/server/email/index.js

@@ -13,6 +13,10 @@ let templates = {}
 let nodemailerMailgun = undefined
 const _dirname = dirname(fileURLToPath(import.meta.url)) + '/'
 
+export const requiredEmailConfigKeys = ['baseUrl', 'emailFrom', 'name', 'env']
+export const optionalEmailConfigKeys = ['emailReplyTo', 'emailTestMode', 'mailgunDomain', 'mailgunKey']
+
+
 /**
  * Sends an email using a predefined template, with optional data/or recipientVariables
  * @typedef {{ baseUrl?: string, emailFrom?: string, mailgunDomain?: string, mailgunKey?: string, name?: string }} Config
@@ -44,24 +48,19 @@ export async function sendEmail({
   skipCssInline,
   test,  
 }) {
-  if (!config) {
-    throw new Error('sendEmail: `config` missing')
-  } else if (!config.baseUrl) {
-    throw new Error('sendEmail: `config.baseUrl` is missing')
-  } else if (!config.emailFrom) {
-    throw new Error('sendEmail: `config.emailFrom` is missing')
-  } else if (!test && (!config.mailgunKey || !config.mailgunDomain)) {
-    throw new Error('sendEmail: `config.mailgunKey` or `config.mailgunDomain` is missing')
-  } else if (!config.name) {
-    throw new Error('sendEmail: `config.name` is missing')
-  } else if (!template) {
-    throw new Error('sendEmail: `template` missing')
-  } else if (!to) {
-    throw new Error('sendEmail: `to` missing')
+  const isTest = config.emailTestMode || test
+  if (!config) throw new Error('sendEmail: `config` missing')
+  for (const key of requiredEmailConfigKeys) {
+    if (!config[key]) throw new Error(`sendEmail: config.${key} is missing`)
+  }
+  if (!isTest && (!config.mailgunKey || !config.mailgunDomain)) {
+    throw new Error('sendEmail: config.mailgunKey and config.mailgunDomain are required')
   }
+  if (!template) throw new Error('sendEmail: `template` missing')
+  if (!to) throw new Error('sendEmail: `to` missing')
 
   // Setup nodemailer once
-  if (!nodemailerMailgun && !test) {
+  if (!nodemailerMailgun && !isTest) {
     nodemailerMailgun = nodemailer.createTransport(
       mailgun({ auth: { api_key: config.mailgunKey, domain: config.mailgunDomain }})
     )
@@ -95,13 +94,13 @@ export async function sendEmail({
     bcc: bcc,
     emailTemplateDir: getDirectories(path, config.pwd).emailTemplateDir,
     from: from,
-    isDev: config.baseUrl.match(/:/), // possibly use config.env here
+    isDev: config.env === 'development',
     recipientVariables: recipientVariables,
     replyTo: replyTo,
     skipCssInline: skipCssInline,
     subject: subject,
     template: template,
-    test: config.emailTestMode || test,
+    test: isTest,
     to: to,
     url: config.baseUrl,
   }
@@ -187,24 +186,27 @@ function processTemplate(settings, html) {
 async function sendWithMailgun(settings, html) {
   // Supports batch sending via recipientVariables, limit 1000 emails
   // https://documentation.mailgun.com/en/latest/user_manual.html?highlight=batch%20sending#batch-sending
-  let processedhtml = await processTemplate(settings, html)
-  // console.log(settings)
+  const processedhtml = await processTemplate(settings, html)
+  const mailgunOpts = {
+    ...(settings.bcc && !settings.isDev? { bcc: settings.bcc } : {}),
+    from: settings.from,
+    html: processedhtml,
+    'h:Reply-To': settings.replyTo,
+    subject: settings.subject,
+    to: settings.to,
+    ...(!settings.recipientVariables? {} : {
+      'recipient-variables': typeof settings.recipientVariables == 'string'
+        ? settings.recipientVariables
+        : JSON.stringify(settings.recipientVariables),
+    }),
+  }
+  if (settings.test && settings.isDev) {
+    console.info('Test mode: sendEmail mailgunOpts', { ...mailgunOpts, html: null, 'recipient-variables': settings.recipientVariables })
+  }
   if (settings.test) return processedhtml
 
   return new Promise((resolve, reject) => {
-    nodemailerMailgun.sendMail({
-      ...(settings.bcc && !settings.isDev? { bcc: settings.bcc } : {}),
-      from: settings.from,
-      html: processedhtml,
-      'h:Reply-To': settings.replyTo,
-      subject: settings.subject,
-      to: settings.to,
-      ...(!settings.recipientVariables? {} : {
-        'recipient-variables': typeof settings.recipientVariables == 'string'
-          ? settings.recipientVariables
-          : JSON.stringify(settings.recipientVariables),
-      }),
-    }, function(err, info) {
+    nodemailerMailgun.sendMail(mailgunOpts, function(err, info) {
       if (err) {
         console.error('SendEmail mailgun error')
         reject(err)

package/server/index.js

@@ -24,7 +24,7 @@ export { userModel, companyModel, setupDefaultModels }
 export { setupRouter, middleware, isValidUserOrRespond, isAdminUser } from './router.js'
 
 // Export email utility
-export { sendEmail } from './email/index.js'
+export { sendEmail, requiredEmailConfigKeys, optionalEmailConfigKeys } from './email/index.js'
 
 // Export API controllers
 export * from '../components/auth/auth.api.js'

package/server/models/company.js

@@ -21,6 +21,7 @@ export default {
     }],
     invites: [{
       email: { type: 'email', required: true },
+      firstName: { type: 'string', required: true },
       role: { type: 'string', enum: ['owner', 'manager'], required: true },
       inviteToken: { type: 'string', required: true },
     }],
@@ -57,8 +58,8 @@ export default {
     publicData: function(models) {
       return models
     },
-    loginPopulate: function() {
-      // return the company with expanded company.users
+    authPopulate: function() {
+      // Special method called by auth.api.js on authentication.
       return [
         {
           as: 'usersExpanded',