Allow admins to resend email verification to users

backend/LexBoxApi/GraphQL/UserMutations.cs

@@ -75,6 +75,23 @@ IEmailService emailService
         return UpdateUser(loggedInContext, permissionService, input, dbContext, emailService);
     }
 
+    [Error<NotFoundException>]
+    [Error<DbError>]
+    [Error<InvalidOperationException>]
+    [AdminRequired]
+    public async Task<User> SendNewVerificationEmailByAdmin(
+        Guid userId,
+        LexBoxDbContext dbContext,
+        IEmailService emailService
+    )
+    {
+        var user = await dbContext.Users.FindAsync(userId);
+        NotFoundException.ThrowIfNull(user);
+        if (string.IsNullOrEmpty(user.Email)) throw new InvalidOperationException("User account does not have an email address");
+        await emailService.SendVerifyAddressEmail(user);
+        return user;
+    }
+
     [Error<NotFoundException>]
     [Error<DbError>]
     [Error<UniqueValueException>]

frontend/schema.graphql

@@ -266,6 +266,7 @@ type Mutation {
   softDeleteProject(input: SoftDeleteProjectInput!): SoftDeleteProjectPayload! @cost(weight: "10")
   changeUserAccountBySelf(input: ChangeUserAccountBySelfInput!): ChangeUserAccountBySelfPayload! @cost(weight: "10")
   changeUserAccountByAdmin(input: ChangeUserAccountByAdminInput!): ChangeUserAccountByAdminPayload! @authorize(policy: "AdminRequiredPolicy") @cost(weight: "10")
+  sendNewVerificationEmailByAdmin(input: SendNewVerificationEmailByAdminInput!): SendNewVerificationEmailByAdminPayload! @authorize(policy: "AdminRequiredPolicy") @cost(weight: "10")
   createGuestUserByAdmin(input: CreateGuestUserByAdminInput!): CreateGuestUserByAdminPayload! @authorize(policy: "AdminRequiredPolicy") @cost(weight: "10")
   deleteUserByAdminOrSelf(input: DeleteUserByAdminOrSelfInput!): DeleteUserByAdminOrSelfPayload! @cost(weight: "10")
   setUserLocked(input: SetUserLockedInput!): SetUserLockedPayload! @authorize(policy: "AdminRequiredPolicy") @cost(weight: "10")
@@ -459,6 +460,11 @@ type RequiredError implements Error {
   message: String!
 }
 
+type SendNewVerificationEmailByAdminPayload {
+  user: User
+  errors: [SendNewVerificationEmailByAdminError!]
+}
+
 type SetOrgMemberRolePayload {
   organization: Organization
   errors: [SetOrgMemberRoleError!]
@@ -601,6 +607,8 @@ union LeaveProjectError = NotFoundError | LastMemberCantLeaveError
 
 union RemoveProjectFromOrgError = DbError | NotFoundError
 
+union SendNewVerificationEmailByAdminError = NotFoundError | DbError | UniqueValueError
+
 union SetOrgMemberRoleError = DbError | NotFoundError | OrgMemberInvitedByEmail
 
 union SetProjectConfidentialityError = NotFoundError | DbError
@@ -1034,6 +1042,10 @@ input RetentionPolicyOperationFilterInput {
   nin: [RetentionPolicy!] @cost(weight: "10")
 }
 
+input SendNewVerificationEmailByAdminInput {
+  userId: UUID!
+}
+
 input SetOrgMemberRoleInput {
   orgId: UUID!
   role: OrgRole!

frontend/src/lib/components/IconButton.svelte

@@ -8,7 +8,7 @@
   export let loading = false;
   export let active = false;
   export let join = false;
-  export let variant: 'btn-success' | 'btn-ghost' | undefined = undefined;
+  export let variant: 'btn-success' | 'btn-ghost' | 'btn-primary' | undefined = undefined;
   export let size: 'btn-sm' | undefined = undefined;
   let loadingSize = size === 'btn-sm' ? 'loading-xs' as const : undefined;
   export let outline = variant !== 'btn-ghost';

frontend/src/lib/components/Users/UserModal.svelte

@@ -4,6 +4,11 @@
   import DevContent from '$lib/layout/DevContent.svelte';
   import UserLockedAlert from './UserLockedAlert.svelte';
   import { NULL_LABEL } from '$lib/i18n';
+  import IconButton from '$lib/components/IconButton.svelte';
+  import AdminContent from '$lib/layout/AdminContent.svelte';
+  import {_sendNewVerificationEmailByAdmin} from '../../../routes/(authenticated)/admin/+page';
+  import type {UUID} from 'crypto';
+  import {useNotifications} from '$lib/notify';
 
   type User = {
     id: string;
@@ -27,6 +32,16 @@
     user = _user;
     await userDetailsModal.openModal(true, true);
   }
+
+  const { notifySuccess } = useNotifications();
+
+  var sendingVerificationEmail = false;
+  async function sendVerificationEmail(user: User): Promise<void> {
+    sendingVerificationEmail = true;
+    await _sendNewVerificationEmailByAdmin(user.id as UUID);
+    sendingVerificationEmail = false;
+    notifySuccess($t('admin_dashboard.notifications.verification_email_sent', { email: user.email ?? '' }));
+  }
 </script>
 
 <Modal bind:this={userDetailsModal} bottom>
@@ -50,6 +65,18 @@
                 data-tip={$t('admin_dashboard.email_not_verified')}>
                 <span class="i-mdi-help-circle-outline" />
               </span>
+              <AdminContent>
+                <div class="tooltip" data-tip={$t('admin_dashboard.resend_verification_email')}>
+                  <IconButton
+                    size="btn-sm"
+                    icon="i-mdi-email-sync"
+                    outline={false}
+                    variant="btn-primary"
+                    loading={sendingVerificationEmail}
+                    on:click={() => sendVerificationEmail(user)}
+                  />
+                </div>
+              </AdminContent>
             {/if}
           {:else}
             –

frontend/src/lib/components/modals/Modal.svelte

@@ -7,6 +7,7 @@
 
 <script lang="ts">
   import t from '$lib/i18n';
+  import Notify from '$lib/notify/Notify.svelte';
   import { OverlayContainer } from '$lib/overlay';
   import { createEventDispatcher } from 'svelte';
   import { writable } from 'svelte/store';
@@ -129,5 +130,6 @@
         <button>invisible</button>
       </form>
     {/if}
+    <Notify />
   </dialog>
 {/if}

frontend/src/lib/i18n/locales/en.json

@@ -20,11 +20,13 @@
     "how_to_create_users": "How to Create Users",
     "is_draft": "Draft",
     "email_not_verified": "Not Verified",
+    "resend_verification_email": "Resend verification email",
     "notifications": {
       "user_deleted": "{name} has been deleted.",
       "user_updated": "{name} has been updated.",
       "user_created": "{name} has been created.",
-      "email_need_verification": "You've requested to change the e-mail address for {name} to {requestedEmail}. The change will only come into effect when the user verifies the new address. They can do so using the link in the e-mail we just sent them."
+      "email_need_verification": "You've requested to change the e-mail address for {name} to {requestedEmail}. The change will only come into effect when the user verifies the new address. They can do so using the link in the e-mail we just sent them.",
+      "verification_email_sent": "Verification email has been sent to {email}",
     },
     "user_is_locked": "This user is locked. They cannot log in or Send/Receive until an administrator unlocks them.",
     "form_modal": {

frontend/src/routes/(authenticated)/admin/+page.svelte

@@ -9,7 +9,7 @@
   import { DialogResponse } from '$lib/components/modals';
   import { Duration } from '$lib/util/time';
   import { RefineFilterMessage } from '$lib/components/Table';
-  import type { AdminSearchParams, User } from './+page';
+  import { type AdminSearchParams, type User } from './+page';
   import { getSearchParams, queryParam } from '$lib/util/query-params';
   import type { ProjectType } from '$lib/gql/types';
   import { derived } from 'svelte/store';

frontend/src/routes/(authenticated)/admin/+page.ts

@@ -13,6 +13,7 @@ import type {
   CreateGuestUserByAdminMutation,
   DraftProjectFilterInput,
   ProjectFilterInput,
+  SendNewVerificationEmailByAdminMutation,
   SetUserLockedInput,
   SetUserLockedMutation,
   UserFilterInput,
@@ -206,6 +207,32 @@ export async function _changeUserAccountByAdmin(input: ChangeUserAccountByAdminI
   return result;
 }
 
+export async function _sendNewVerificationEmailByAdmin(userId: UUID): $OpResult<SendNewVerificationEmailByAdminMutation> {
+  //language=GraphQL
+  const result = await getClient()
+    .mutation(
+      graphql(`
+        mutation SendNewVerificationEmailByAdmin($input: SendNewVerificationEmailByAdminInput!) {
+          sendNewVerificationEmailByAdmin(input: $input) {
+            user {
+              id
+              email
+              emailVerified
+            }
+            errors {
+                __typename
+              ... on Error {
+                message
+              }
+            }
+          }
+        }
+      `),
+      { input: { userId } }
+    )
+  return result;
+}
+
 export async function _createGuestUserByAdmin(input: CreateGuestUserByAdminInput): $OpResult<CreateGuestUserByAdminMutation> {
   //language=GraphQL
   const result = await getClient()

frontend/src/routes/(unauthenticated)/sandbox/+page.svelte

@@ -11,6 +11,8 @@
   import ConfirmModal from '$lib/components/modals/ConfirmModal.svelte';
   import {delay} from '$lib/util/time';
   import DeleteModal from '$lib/components/modals/DeleteModal.svelte';
+  import {Modal} from '$lib/components/modals';
+  import {useNotifications} from '$lib/notify';
 
   function uploadFinished(): void {
     alert('upload done!');
@@ -34,18 +36,22 @@
   let {form, enhance, errors} = lexSuperForm(formSchema, async () => {
       console.log('submit', $form);
   });
-function preFillForm(): void {
-  form.update(f => ({...f, name: 'John'}), {taint: false});
-}
+  function preFillForm(): void {
+    form.update(f => ({...f, name: 'John'}), {taint: false});
+  }
 
   let disableDropdown = false;
 
   async function gqlThrows500(): Promise<void> {
     await _gqlThrows500();
   }
 
-let modal: ConfirmModal;
-let deleteModal: DeleteModal;
+  const { notifySuccess } = useNotifications();
+
+  let modal: ConfirmModal;
+  let deleteModal: DeleteModal;
+  let notificationModal: Modal;
+  let notificationModalIsAtBottom = false;
 
 </script>
 <PageBreadcrumb>Hello from sandbox</PageBreadcrumb>
@@ -181,14 +187,9 @@ let deleteModal: DeleteModal;
       }}>
         Open Modal
       </Button>
-    </div>
-  </div>
 
-  <div class="card bg-base-200 shadow-lg">
-    <div class="card-body">
       <h2 class="card-title">Delete Modal</h2>
-      <DeleteModal bind:this={deleteModal}
-      entityName="Car">
+      <DeleteModal bind:this={deleteModal} entityName="Car">
         Would you like to delete this car?
       </DeleteModal>
       <Button variant="btn-primary" on:click={async () => {
@@ -197,6 +198,18 @@ let deleteModal: DeleteModal;
       }}>
         Delete Car
       </Button>
+
+      <h2 class="card-title">Notification modal</h2>
+      <Modal bind:this={notificationModal} bottom={notificationModalIsAtBottom}>
+        <h2 class="text-xl mb-2">Notification fun 🎉</h2>
+        <Button on:click={() => notifySuccess('Hurra you generated a notification! 😎')}>Generate notification</Button>
+        <Button on:click={() => notificationModalIsAtBottom = !notificationModalIsAtBottom}>Toggle position</Button>
+      </Modal>
+      <Button variant="btn-primary" on:click={() => {
+        notificationModal.openModal();
+      }}>
+        Play with notifications
+      </Button>
     </div>
   </div>
 </div>