Add "Where's my project?" link to FW Lite and corresponding page to Lexbox (#1650)

* Added a "Where's my project?" page to Lexbox which displays different
  content based on whether the user has FW Lite feature flag or not
* If user has feature flag, give instructions for how to get project
* If user doesn't have feature flag, a button allows user to send an email
  to Lexbox admins to ask for the feature flag to be added
* Added a link to FW Lite that will link to the Lexbox page

---------

Co-authored-by: Tim Haasdyk <[email protected]>

Author: rmunn

backend/LexBoxApi/GraphQL/UserMutations.cs

@@ -1,4 +1,4 @@
-using System.ComponentModel.DataAnnotations;
+using System.ComponentModel.DataAnnotations;
 using System.Security.Cryptography;
 using LexBoxApi.Auth;
 using LexBoxApi.Auth.Attributes;
@@ -36,6 +36,35 @@ public record CreateGuestUserByAdminInput(
         string PasswordHash,
         int PasswordStrength,
         Guid? OrgId);
+    public record SendFWLiteBetaRequestEmailInput(Guid UserId, string Name);
+    public enum SendFWLiteBetaRequestEmailResult
+    {
+        UserAlreadyInBeta,
+        BetaAccessRequestSent,
+    };
+
+    [Error<NotFoundException>]
+    [UseMutationConvention]
+    public async Task<SendFWLiteBetaRequestEmailResult> SendFWLiteBetaRequestEmail(
+        LoggedInContext loggedInContext,
+        SendFWLiteBetaRequestEmailInput input,
+        LexBoxDbContext dbContext,
+        LexAuthService lexAuthService,
+        IEmailService emailService
+    )
+    {
+        if (loggedInContext.User.Id != input.UserId) throw new UnauthorizedAccessException();
+        var user = await dbContext.Users.FindAsync(input.UserId);
+        NotFoundException.ThrowIfNull(user);
+        if (user.FeatureFlags.Contains(FeatureFlag.FwLiteBeta))
+        {
+            if (!loggedInContext.User.FeatureFlags.Contains(FeatureFlag.FwLiteBeta))
+                await lexAuthService.RefreshUser();
+            return SendFWLiteBetaRequestEmailResult.UserAlreadyInBeta;
+        }
+        await emailService.SendJoinFwLiteBetaEmail(user);
+        return SendFWLiteBetaRequestEmailResult.BetaAccessRequestSent;
+    }
 
     [Error<NotFoundException>]
     [Error<DbError>]

backend/LexBoxApi/Services/Email/EmailTemplates.cs

@@ -23,6 +23,7 @@ public enum EmailTemplate
     CreateProjectRequest,
     ApproveProjectRequest,
     UserAdded,
+    JoinFwLiteBetaRequest,
 }
 
 public record ForgotPasswordEmail(string Name, string ResetUrl, TimeSpan lifetime) : EmailTemplateBase(EmailTemplate.ForgotPassword);
@@ -41,3 +42,4 @@ public record CreateProjectRequestUser(string Name, string Email);
 public record CreateProjectRequestEmail(string Name, CreateProjectRequestUser User, CreateProjectInput Project) : EmailTemplateBase(EmailTemplate.CreateProjectRequest);
 public record ApproveProjectRequestEmail(string Name, CreateProjectRequestUser User, CreateProjectInput Project) : EmailTemplateBase(EmailTemplate.ApproveProjectRequest);
 public record UserAddedEmail(string Name, string Email, string ProjectName, string ProjectCode) : EmailTemplateBase(EmailTemplate.UserAdded);
+public record JoinFwLiteBetaEmail(string Name, string Email) : EmailTemplateBase(EmailTemplate.JoinFwLiteBetaRequest);

backend/LexBoxApi/Services/Email/IEmailService.cs

@@ -57,5 +57,6 @@ public Task SendCreateAccountWithProjectEmail(
     public Task SendCreateProjectRequestEmail(LexAuthUser user, CreateProjectInput projectInput);
     public Task SendApproveProjectRequestEmail(User user, CreateProjectInput projectInput);
     public Task SendUserAddedEmail(User user, string projectName, string projectCode);
+    public Task SendJoinFwLiteBetaEmail(User user);
     public Task SendEmailAsync(MimeMessage message);
 }

backend/LexBoxApi/Services/EmailService.cs

@@ -215,6 +215,14 @@ public async Task SendUserAddedEmail(User user, string projectName, string proje
         await RenderEmail(email, new UserAddedEmail(user.Name, user.Email!, projectName, projectCode), user.LocalizationCode);
         await SendEmailWithRetriesAsync(email);
     }
+
+    public async Task SendJoinFwLiteBetaEmail(User user)
+    {
+        var email = StartUserEmail("Lexbox Support", "[email protected]"); // TODO: Get from environment
+        await RenderEmail(email, new JoinFwLiteBetaEmail(user.Name, user.Email ?? ""), user.LocalizationCode);
+        await SendEmailWithRetriesAsync(email);
+    }
+
     public async Task SendEmailAsync(MimeMessage message)
     {
         message.From.Add(MailboxAddress.Parse(_emailConfig.From));

frontend/schema.graphql

@@ -275,6 +275,7 @@ type Mutation {
   removeProjectMember(input: RemoveProjectMemberInput!): RemoveProjectMemberPayload! @cost(weight: "10")
   deleteDraftProject(input: DeleteDraftProjectInput!): DeleteDraftProjectPayload! @authorize(policy: "AdminRequiredPolicy") @cost(weight: "10")
   softDeleteProject(input: SoftDeleteProjectInput!): SoftDeleteProjectPayload! @cost(weight: "10")
+  sendFWLiteBetaRequestEmail(input: SendFWLiteBetaRequestEmailInput!): SendFWLiteBetaRequestEmailPayload! @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")
@@ -493,6 +494,11 @@ type RequiredError implements Error {
   message: String!
 }
 
+type SendFWLiteBetaRequestEmailPayload {
+  sendFWLiteBetaRequestEmailResult: SendFWLiteBetaRequestEmailResult
+  errors: [SendFWLiteBetaRequestEmailError!]
+}
+
 type SendNewVerificationEmailByAdminPayload {
   user: User
   errors: [SendNewVerificationEmailByAdminError!]
@@ -645,6 +651,8 @@ union LeaveProjectError = NotFoundError | LastMemberCantLeaveError
 
 union RemoveProjectFromOrgError = DbError | NotFoundError
 
+union SendFWLiteBetaRequestEmailError = NotFoundError
+
 union SendNewVerificationEmailByAdminError = NotFoundError | DbError | InvalidOperationError
 
 union SetOrgMemberRoleError = DbError | NotFoundError | OrgMemberInvitedByEmail | OrgMembersMustBeVerified | OrgMembersMustBeVerifiedForRole
@@ -1094,6 +1102,11 @@ input RetentionPolicyOperationFilterInput {
   nin: [RetentionPolicy!] @cost(weight: "10")
 }
 
+input SendFWLiteBetaRequestEmailInput {
+  userId: UUID!
+  name: String!
+}
+
 input SendNewVerificationEmailByAdminInput {
   userId: UUID!
 }
@@ -1282,6 +1295,11 @@ enum RetentionPolicy {
   TRAINING
 }
 
+enum SendFWLiteBetaRequestEmailResult {
+  USER_ALREADY_IN_BETA
+  BETA_ACCESS_REQUEST_SENT
+}
+
 enum SortEnumType {
   ASC
   DESC

frontend/src/lib/email/Email.svelte

@@ -5,7 +5,7 @@
   const lexboxLogo = 'https://lexbox.org/images/logo-dark.png';
   interface Props {
     subject: string;
-    name: string;
+    name?: string;
     children?: Snippet;
   }
 

frontend/src/lib/email/JoinFwLiteBetaRequest.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+  import Email from '$lib/email/Email.svelte';
+  import t from '$lib/i18n';
+
+  export let name: string;
+  export let email: string;
+  export let baseUrl: string;
+  let approveUrl = new URL(`/admin/?userSearch=${encodeURIComponent(email)}`, baseUrl);
+</script>
+
+<Email subject={$t('emails.join_fw_lite_beta_request_email.subject', { name })}>
+  <mj-text>{$t('emails.join_fw_lite_beta_request_email.body', { name })}</mj-text>
+  <mj-button href={approveUrl}>{$t('emails.join_fw_lite_beta_request_email.approve_button')}</mj-button>
+</Email>

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

@@ -668,6 +668,18 @@ If you don't see a dialog or already closed it, click the button below:",
     "admin": "Admin",
     "user": "User"
   },
+  "where_is_my_project": {
+    "title": "FieldWorks Lite - Where's my project?",
+    "body": "If you don't see your project in FieldWorks Lite, navigate to the project here on Lexbox and look for the \"Try FieldWorks Lite?\" button\n\
+near the top of the page. Use that button to make your project available in FieldWorks Lite. This process may take a few minutes. When\n\
+it's done, you should see your project in FieldWorks Lite and be able to use it.",
+    "user_not_in_beta": "FieldWorks Lite is currently in a beta testing phase. \n\
+Only selected early access users can download Lexbox projects in FieldWorks Lite. \n\
+Click the button below to request to join the early access program. It may take a few days for us to respond.",
+    "request_beta_access": "Request early access to FieldWorks Lite",
+    "access_request_sent": "Your request to join the early access program has been submitted",
+    "already_in_beta": "You're already in the early access program",
+  },
   "errors": {
     "apology": "Woops, something went wrong on our end. Sorry!",
     "mail_us_at": "If you're stuck, let us know about this at",
@@ -736,6 +748,11 @@ If you don't see a dialog or already closed it, click the button below:",
       "heading": "The project you requested, {projectName}, has been approved and created.",
       "view_button": "View Project"
     },
+    "join_fw_lite_beta_request_email": {
+      "subject": "FW Lite Beta join request: {name}",
+      "body": "User {name} requested to join the FW Lite beta. Click below to approve this request.",
+      "approve_button": "Approve Request"
+    },
     "user_added": {
       "subject": "You joined project: {projectName}!",
       "body": "You have been added to the project: {projectName}.",

frontend/src/lib/layout/FeatureFlagAlternateContent.svelte

@@ -0,0 +1,22 @@
+<script lang="ts">
+  import type { Snippet } from 'svelte';
+  import { page } from '$app/state';
+  import type { FeatureFlag } from '$lib/gql/types';
+  import { hasFeatureFlag } from '$lib/user';
+
+  interface Props {
+    flag: FeatureFlag | keyof typeof FeatureFlag;
+    children?: Snippet;
+    hasFlagContent?: Snippet;
+    missingFlagContent?: Snippet;
+  }
+
+  let { flag, missingFlagContent, hasFlagContent, children }: Props = $props();
+</script>
+
+<!-- eslint-disable-next-line @typescript-eslint/no-unsafe-argument -->
+{#if hasFeatureFlag(page.data.user, flag)}
+  {@render (hasFlagContent ?? children)?.()}
+{:else}
+  {@render missingFlagContent?.()}
+{/if}

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

@@ -0,0 +1,53 @@
+<script lang="ts">
+  import { TitlePage } from '$lib/layout';
+  import t from '$lib/i18n';
+  import Markdown from 'svelte-exmarkdown';
+  import FeatureFlagAlternateContent from '$lib/layout/FeatureFlagAlternateContent.svelte';
+  import Button from '$lib/forms/Button.svelte';
+  import { page } from '$app/state';
+  import { _sendFWLiteBetaRequestEmail } from './+page';
+  import type { UUID } from 'crypto';
+  import { SendFwLiteBetaRequestEmailResult } from '$lib/gql/generated/graphql';
+  import { useNotifications } from '$lib/notify';
+
+  const { notifySuccess } = useNotifications();
+
+  let requesting = $state(false);
+
+  async function requestBetaAccess(): Promise<void> {
+    requesting = true;
+    try {
+      const gqlResult = await _sendFWLiteBetaRequestEmail(page.data.user.id as UUID, page.data.user.name);
+      if (gqlResult.error) {
+        if (gqlResult.error.byType('NotFoundError')) {
+          console.log('User not found, no dialog shown');
+        }
+      }
+      const result = gqlResult.data?.sendFWLiteBetaRequestEmail.sendFWLiteBetaRequestEmailResult;
+      if (result === SendFwLiteBetaRequestEmailResult.BetaAccessRequestSent) {
+        notifySuccess($t('where_is_my_project.access_request_sent'));
+      }
+      if (result === SendFwLiteBetaRequestEmailResult.UserAlreadyInBeta) {
+        notifySuccess($t('where_is_my_project.already_in_beta'));
+      }
+    } finally {
+      requesting = false;
+    }
+  }
+</script>
+
+<TitlePage title={$t('where_is_my_project.title')}>
+  <div class="prose text-lg">
+    <FeatureFlagAlternateContent flag="FwLiteBeta">
+      {#snippet hasFlagContent()}
+        <Markdown md={$t('where_is_my_project.body')} />
+      {/snippet}
+      {#snippet missingFlagContent()}
+        <Markdown md={$t('where_is_my_project.user_not_in_beta')} />
+        <div class="text-center">
+          <Button loading={requesting} variant="btn-primary" onclick={requestBetaAccess}>{$t('where_is_my_project.request_beta_access')}</Button>
+        </div>
+      {/snippet}
+    </FeatureFlagAlternateContent>
+  </div>
+</TitlePage>