issue #3885 add checkbox per email for attester key submission

extension/chrome/settings/setup.htm

@@ -207,7 +207,7 @@ <h1>Set Up FlowCrypt</h1>
               Submit corresponding pubkey to FlowCrypt Attester
             </label>
           </div>
-          <div class="line left remove_if_pubkey_submitting_not_user_configurable" style="visibility: hidden;">
+          <div class="line left remove_if_pubkey_submitting_not_user_configurable container_for_import_key_email_alias" data-test="container-for-import-key-email-alias" style="visibility: hidden;">
             <label>
               <input type="checkbox" class="input_submit_all" disabled="disabled" />
               <span>

extension/chrome/settings/setup.ts

@@ -84,8 +84,8 @@ export class SetupView extends View {
     } else {
       window.location.href = 'index.htm';
     }
-    this.submitKeyForAddrs = [this.acctEmail];
-    this.keyImportUi.initPrvImportSrcForm(this.acctEmail, this.parentTabId); // for step_2b_manual_enter, if user chooses so
+    this.submitKeyForAddrs = [];
+    this.keyImportUi.initPrvImportSrcForm(this.acctEmail, this.parentTabId, this.submitKeyForAddrs); // for step_2b_manual_enter, if user chooses so
     this.keyImportUi.onBadPassphrase = () => $('#step_2b_manual_enter .input_passphrase').val('').focus();
     this.keyImportUi.renderPassPhraseStrengthValidationInput($('#step_2a_manual_create .input_password'), $('#step_2a_manual_create .action_proceed_private'));
     this.keyImportUi.renderPassPhraseStrengthValidationInput($('#step_2_ekm_choose_pass_phrase .input_password'), $('#step_2_ekm_choose_pass_phrase .action_proceed_private'));
@@ -201,10 +201,11 @@ export class SetupView extends View {
     const inputSubmitAll = $(target).closest('.manual').find('.input_submit_all').first();
     if ($(target).prop('checked')) {
       if (inputSubmitAll.closest('div.line').css('visibility') === 'visible') {
-        inputSubmitAll.prop({ checked: true, disabled: false });
+        $('.input_email_alias').prop({ disabled: false });
       }
     } else {
-      inputSubmitAll.prop({ checked: false, disabled: true });
+      $('.input_email_alias').prop({ checked: false });
+      $('.input_email_alias').prop({ disabled: true });
     }
   }
 
@@ -216,19 +217,23 @@ export class SetupView extends View {
     }
   }
 
-  public preFinalizeSetup = async (options: SetupOptions): Promise<void> => {
-    await AcctStore.set(this.acctEmail, { tmp_submit_main: options.submit_main, tmp_submit_all: options.submit_all });
-  }
-
-  public submitPublicKeysAndFinalizeSetup = async ({ submit_main, submit_all }: { submit_main: boolean, submit_all: boolean }): Promise<void> => {
+  public submitPublicKeys = async (
+    { submit_main, submit_all }: { submit_main: boolean, submit_all: boolean }
+  ): Promise<void> => {
     const primaryKi = await KeyStore.getFirstRequired(this.acctEmail);
     try {
       await this.submitPublicKeyIfNeeded(primaryKi.public, { submit_main, submit_all });
     } catch (e) {
-      return await Settings.promptToRetry(e, Lang.setup.failedToSubmitToAttester, () => this.submitPublicKeysAndFinalizeSetup({ submit_main, submit_all }));
+      return await Settings.promptToRetry(
+        e,
+        Lang.setup.failedToSubmitToAttester,
+        () => this.submitPublicKeys({ submit_main, submit_all })
+      );
     }
+  }
+
+  public finalizeSetup = async (): Promise<void> => {
     await AcctStore.set(this.acctEmail, { setup_date: Date.now(), setup_done: true, cryptup_enabled: true });
-    await AcctStore.remove(this.acctEmail, ['tmp_submit_main', 'tmp_submit_all']);
   }
 
   public saveKeysAndPassPhrase = async (prvs: Key[], options: SetupOptions) => {
@@ -237,9 +242,11 @@ export class SetupView extends View {
       await PassphraseStore.set((options.passphrase_save && !this.orgRules.forbidStoringPassPhrase()) ? 'local' : 'session',
         this.acctEmail, { longid: KeyUtil.getPrimaryLongid(prv) }, options.passphrase);
     }
+    const { sendAs } = await AcctStore.get(this.acctEmail, ['sendAs']);
+    const myOwnEmailsAddrs: string[] = [this.acctEmail].concat(Object.keys(sendAs!));
     const myOwnEmailAddrsAsContacts: Contact[] = [];
     const { full_name: name } = await AcctStore.get(this.acctEmail, ['full_name']);
-    for (const email of this.submitKeyForAddrs) {
+    for (const email of myOwnEmailsAddrs) {
       myOwnEmailAddrsAsContacts.push(await ContactStore.obj({ email, name, pubkey: KeyUtil.armor(await KeyUtil.asPublicKey(prvs[0])) }));
     }
     await ContactStore.save(undefined, myOwnEmailAddrsAsContacts);

extension/chrome/settings/setup/setup-create-key.ts

@@ -37,12 +37,13 @@ export class SetupCreateKeyModule {
       const keyIdentity = await this.createSaveKeyPair(opts, keyAlgo);
       if (keyIdentity) {
         if (this.view.orgRules.canBackupKeys()) {
-          await this.view.preFinalizeSetup(opts);
+          await this.view.submitPublicKeys(opts);
           const action = $('#step_2a_manual_create .input_backup_inbox').prop('checked') ? 'setup_automatic' : 'setup_manual';
           // only finalize after backup is done. backup.htm will redirect back to this page with ?action=finalize
           window.location.href = Url.create('modules/backup.htm', { action, acctEmail: this.view.acctEmail, idToken: this.view.idToken, id: keyIdentity.id, type: keyIdentity.type });
         } else {
-          await this.view.submitPublicKeysAndFinalizeSetup(opts);
+          await this.view.submitPublicKeys(opts);
+          await this.view.finalizeSetup();
           await this.view.setupRender.renderSetupDone();
         }
       }

extension/chrome/settings/setup/setup-import-key.ts

@@ -39,8 +39,8 @@ export class SetupImportKeyModule {
       }
       Xss.sanitizeRender('#step_2b_manual_enter .action_add_private_key', Ui.spinner('white'));
       await this.view.saveKeysAndPassPhrase([checked.encrypted], options);
-      await this.view.preFinalizeSetup(options);
-      await this.view.submitPublicKeysAndFinalizeSetup(options);
+      await this.view.submitPublicKeys(options);
+      await this.view.finalizeSetup();
       await this.view.setupRender.renderSetupDone();
     } catch (e) {
       if (e instanceof UserAlert) {
@@ -69,8 +69,8 @@ export class SetupImportKeyModule {
       return;
     }
     await this.view.saveKeysAndPassPhrase([fixedPrv], options);
-    await this.view.preFinalizeSetup(options);
-    await this.view.submitPublicKeysAndFinalizeSetup(options);
+    await this.view.submitPublicKeys(options);
+    await this.view.finalizeSetup();
     await this.view.setupRender.renderSetupDone();
   }
 }

extension/chrome/settings/setup/setup-key-manager-autogen.ts

@@ -46,7 +46,8 @@ export class SetupWithEmailKeyManagerModule {
         window.location.href = Url.create('index.htm', { acctEmail: this.view.acctEmail });
         return;
       }
-      await this.view.submitPublicKeysAndFinalizeSetup(setupOptions);
+      await this.view.submitPublicKeys(setupOptions);
+      await this.view.finalizeSetup();
       await this.view.setupRender.renderSetupDone();
     } catch (e) {
       if (ApiErr.isNetErr(e) && await Api.isInternetAccessible()) { // frendly message when key manager is down, helpful during initial infrastructure setup

extension/chrome/settings/setup/setup-recover-key.ts

@@ -66,8 +66,8 @@ export class SetupRecoverKeyModule {
       await this.view.saveKeysAndPassPhrase(newlyMatchingKeys, options);
       const { setup_done } = await AcctStore.get(this.view.acctEmail, ['setup_done']);
       if (!setup_done) { // normal situation - fresh setup
-        await this.view.preFinalizeSetup(options);
-        await this.view.submitPublicKeysAndFinalizeSetup(options);
+        await this.view.submitPublicKeys(options);
+        await this.view.finalizeSetup();
         await this.view.setupRender.renderSetupDone();
       } else { // setup was finished before, just added more keys now
         await this.view.setupRender.renderSetupDone();

extension/chrome/settings/setup/setup-render.ts

@@ -10,6 +10,8 @@ import { AcctStore } from '../../../js/common/platform/store/acct-store.js';
 import { KeyStore } from '../../../js/common/platform/store/key-store.js';
 import { Ui } from '../../../js/common/browser/ui.js';
 import { PgpPwd } from '../../../js/common/core/crypto/pgp/pgp-password.js';
+import { Xss } from '../../../js/common/platform/xss.js';
+import { KeyImportUi } from '../../../js/common/ui/key-import-ui.js';
 
 export class SetupRenderModule {
 
@@ -39,12 +41,7 @@ export class SetupRenderModule {
         await this.view.setupRecoverKey.renderAddKeyFromBackup();
       }
     } else if (this.view.action === 'finalize') {
-      const { tmp_submit_all, tmp_submit_main } = await AcctStore.get(this.view.acctEmail, ['tmp_submit_all', 'tmp_submit_main']);
-      if (typeof tmp_submit_all === 'undefined' || typeof tmp_submit_main === 'undefined') {
-        $('#content').text(`Setup session expired. To set up FlowCrypt, please click the FlowCrypt icon on top right.`);
-        return;
-      }
-      await this.view.submitPublicKeysAndFinalizeSetup({ submit_all: tmp_submit_all, submit_main: tmp_submit_main });
+      await this.view.finalizeSetup();
       await this.renderSetupDone();
     } else if (this.view.orgRules.mustAutoImportOrAutogenPrvWithKeyManager()) {
       if (this.view.orgRules.mustAutogenPassPhraseQuietly() && this.view.orgRules.forbidStoringPassPhrase()) {
@@ -137,11 +134,30 @@ export class SetupRenderModule {
   }
 
   private saveAndFillSubmitPubkeysOption = (addresses: string[]) => {
-    this.view.submitKeyForAddrs = this.filterAddressesForSubmittingKeys(addresses);
-    if (this.view.submitKeyForAddrs.length > 1) {
-      $('.addresses').text(Value.arr.withoutVal(this.view.submitKeyForAddrs, this.view.acctEmail).join(', '));
-      $('.manual .input_submit_all').prop({ checked: true, disabled: false }).closest('div.line').css('display', 'block');
+    this.renderEmailAddresses(this.filterAddressesForSubmittingKeys(addresses));
+  }
+
+  private renderEmailAddresses = (addresses: string[]) => {
+    $('.input_submit_all').hide();
+    const emailAliases = Value.arr.withoutVal(addresses, this.view.acctEmail);
+    for (const e of emailAliases) {
+      // eslint-disable-next-line max-len
+      $('.addresses').append(`<label><input type="checkbox" class="input_email_alias" data-email="${Xss.escape(e)}" data-test="input-email-alias-${e.replace(/[^a-z0-9]+/g, '')}" />${Xss.escape(e)}</label><br/>`); // xss-escaped
+    }
+    $('.input_email_alias').click((event) => {
+      const email = String($(event.target).data('email'));
+      if ($(event.target).prop('checked')) {
+        if (!this.view.submitKeyForAddrs.includes(email)) {
+          KeyImportUi.addAliasForSubmission(email, this.view.submitKeyForAddrs);
+        }
+      } else {
+        KeyImportUi.removeAliasFromSubmission(email, this.view.submitKeyForAddrs);
+      }
+    });
+    if (emailAliases.length > 0) {
+      $('.container_for_import_key_email_alias').css('visibility', 'visible');
     }
+    $('.manual .input_submit_all').prop({ checked: true, disabled: false }).closest('div.line').css('display', 'block');
   }
 
   private filterAddressesForSubmittingKeys = (addresses: string[]): string[] => {

extension/css/cryptup.css

@@ -61,6 +61,7 @@ td.green,
 b.green,
 span.green { color: #31a217; }
 
+button,
 .line.gray,
 td.gray,
 b.gray,
@@ -131,6 +132,7 @@ span.gray { color: #b7b7b7; }
   color: white;
 }
 
+button.btn_disabled,
 .swal2-popup .swal2-styled.swal2-confirm.ui-modal-warning-confirm,
 .swal2-popup .swal2-styled.swal2-cancel.ui-modal-confirm-cancel,
 .swal2-popup .swal2-styled.swal2-cancel.ui-modal-confirm-checkbox-cancel,

extension/js/common/core/types/openpgp.d.ts

@@ -193,6 +193,7 @@ declare namespace OpenPGP {
     export class Userid extends BasePacket {
       public tag: enums.packet.userid;
       public userid: string;
+      public email: string;
     }
 
     export class SecretSubkey extends BaseKeyPacket {

extension/js/common/platform/store/acct-store.ts

@@ -31,7 +31,7 @@ export type AccountIndex = 'keys' | 'notification_setup_needed_dismissed' | 'ema
   'google_token_refresh' | 'hide_message_password' | 'sendAs' |
   'pubkey_sent_to' | 'full_name' | 'cryptup_enabled' | 'setup_done' |
   'successfully_received_at_leat_one_message' | 'notification_setup_done_seen' | 'picture' |
-  'outgoing_language' | 'setup_date' | 'openid' | 'tmp_submit_main' | 'tmp_submit_all' | 'uuid' | 'use_rich_text' | 'rules' |
+  'outgoing_language' | 'setup_date' | 'openid' | 'uuid' | 'use_rich_text' | 'rules' |
   'fesUrl' | 'fesAccessToken';
 
 export type SendAsAlias = {
@@ -67,9 +67,6 @@ export type AcctStoreDict = {
   rules?: DomainRulesJson;
   fesUrl?: string; // url where FlowCrypt Enterprise Server is deployed
   fesAccessToken?: string;
-  // temporary
-  tmp_submit_main?: boolean;
-  tmp_submit_all?: boolean;
 };
 
 /**

extension/js/common/ui/key-import-ui.ts

@@ -52,14 +52,22 @@ export class KeyImportUi {
     return;
   }
 
+  public static addAliasForSubmission = (email: string, submitKeyForAddrs: string[]) => {
+    submitKeyForAddrs.push(email);
+  }
+
+  public static removeAliasFromSubmission = (email: string, submitKeyForAddrs: string[]) => {
+    submitKeyForAddrs.splice(submitKeyForAddrs.indexOf(email), 1);
+  }
+
   constructor(o: { rejectKnown?: boolean, checkEncryption?: boolean, checkSigning?: boolean }) {
     this.rejectKnown = o.rejectKnown === true;
     this.checkEncryption = o.checkEncryption === true;
     this.checkSigning = o.checkSigning === true;
   }
   public onBadPassphrase: VoidCallback = () => undefined;
 
-  public initPrvImportSrcForm = (acctEmail: string, parentTabId: string | undefined) => {
+  public initPrvImportSrcForm = (acctEmail: string, parentTabId: string | undefined, submitKeyForAddrs?: string[] | undefined) => {
     $('input[type=radio][name=source]').off().change(function () {
       if ((this as HTMLInputElement).value === 'file') {
         $('.input_private_key').val('').change().prop('disabled', true);
@@ -79,9 +87,28 @@ export class KeyImportUi {
       $('.input_passphrase').attr('type', 'text');
       $('#e_rememberPassphrase').prop('checked', true);
     }));
+    $('.input_private_key').on('keyup paste change', Ui.event.handle(async target => {
+      $('.action_add_private_key').addClass('btn_disabled').attr('disabled');
+      $('.input_email_alias').prop('checked', false);
+      const { keys: [prv] } = await opgp.key.readArmored(String($(target).val()));
+      if (prv !== undefined) {
+        $('.action_add_private_key').removeClass('btn_disabled').removeAttr('disabled');
+        if (submitKeyForAddrs !== undefined) {
+          const users = prv.users;
+          for (const user of users) {
+            const userId = user.userId;
+            for (const inputCheckboxesWithEmail of $('.input_email_alias')) {
+              if (String($(inputCheckboxesWithEmail).data('email')) === userId!.email) {
+                KeyImportUi.addAliasForSubmission(userId!.email, submitKeyForAddrs!);
+                $(inputCheckboxesWithEmail).prop('checked', true);
+              }
+            }
+          }
+        }
+      }
+    }));
     $('.input_private_key').change(Ui.event.handle(async target => {
       const { keys: [prv] } = await opgp.key.readArmored(String($(target).val()));
-      $('.input_passphrase').val('');
       if (!prv || !prv.isPrivate()) {
         $('.line.unprotected_key_create_pass_phrase').hide();
         return;

test/source/browser/controllable.ts

@@ -475,8 +475,8 @@ abstract class ControllableBase {
     } else if (m = customSelLanguageQuery.match(/@(ui-modal-[a-z\-]+)/)) { // tslint:disable-line:no-conditional-assignment
       return `.${m[1]}`; // represented as a class
       // eslint-disable-next-line no-cond-assign
-    } else if (m = customSelLanguageQuery.match(/^@([a-z0-9\-_]+)$/i)) { // tslint:disable-line:no-conditional-assignment
-      return `[data-test="${m[1]}"]`;
+    } else if (m = customSelLanguageQuery.match(/@([a-z0-9\-_]+)$/i)) { // tslint:disable-line:no-conditional-assignment
+      return customSelLanguageQuery.replace(/@([a-z0-9\-_]+)$/i, `[data-test="${m[1]}"]`);
       // eslint-disable-next-line no-cond-assign
     } else if (m = customSelLanguageQuery.match(/^@([a-z0-9\-_]+)\(([^()]*)\)$/i)) { // tslint:disable-line:no-conditional-assignment
       return `//*[@data-test='${m[1]}' and contains(text(),'${m[2]}')]`;

test/source/mock/attester/attester-endpoints.ts

@@ -22,6 +22,7 @@ const knownMockEmails = [
 ];
 
 let data: GoogleData;
+export const MOCK_ATTESTER_LAST_INSERTED_PUB: { [email: string]: string } = {};
 
 const getDC26454AFB71D18EABBAD73D1C7E6D3C5563A941 = async () => {
   if (!data) {
@@ -80,6 +81,7 @@ export const mockAttesterEndpoints: HandlersDefinition = {
     } else if (isPost(req)) {
       oauth.checkAuthorizationHeaderWithIdToken(req.headers.authorization);
       expect(body).to.contain('-----BEGIN PGP PUBLIC KEY BLOCK-----');
+      MOCK_ATTESTER_LAST_INSERTED_PUB[emailOrLongid] = body as string;
       return 'Saved'; // 200 OK
     } else {
       throw new HttpClientErr(`Not implemented: ${req.method}`);
@@ -95,6 +97,7 @@ export const mockAttesterEndpoints: HandlersDefinition = {
     if (email === 'no.pub@org-rules-test.flowcrypt.test') {
       throw new HttpClientErr(`Could not find LDAP pubkey on a LDAP-only domain for email ${email} on server keys.flowcrypt.test`);
     }
+    MOCK_ATTESTER_LAST_INSERTED_PUB[email] = pubkey;
     return { saved: true };
   },
   '/attester/test/welcome': async ({ body }, req) => {

test/source/mock/google/google-endpoints.ts

@@ -111,6 +111,28 @@ export const mockGoogleEndpoints: HandlersDefinition = {
           treatAsAlias: false,
           verificationStatus: 'accepted'
         });
+      } else if (acct === 'multi.aliased.user@example.com') {
+        const alias1 = 'alias1@example.com';
+        const alias2 = 'alias2@example.com';
+        sendAs.push({
+          sendAsEmail: alias1,
+          displayName: 'An Alias1',
+          replyToAddress: alias1,
+          signature: '',
+          isDefault: false,
+          isPrimary: false,
+          treatAsAlias: false,
+          verificationStatus: 'accepted'
+        }, {
+          sendAsEmail: alias2,
+          displayName: 'An Alias1',
+          replyToAddress: alias2,
+          signature: '',
+          isDefault: false,
+          isPrimary: false,
+          treatAsAlias: false,
+          verificationStatus: 'accepted'
+        });
       }
       return { sendAs };
     }