HCB Application Form: Deter use of shared email addresses

[garyhtou]

We already deter users from inviting shared email addresses on HCB.

We should do the same with the application form. This is because emails collected via the form are automatically invited to HCB.

[Chay2203]

Hey! I would love to work on this issue too @garyhtou.

[garyhtou]

Go for it! Here is the updated copy that we use on HCB

⚠️ For security, we discourage team emails on HCB. We recommend individual emails such as ben@hackclub.com!

[Chay2203]

Hey @garyhtou, can you comment on the links of the above page where the warning must be added and the source page where it is already being implemented?

[garyhtou]

Hi @Chay2203!

Warning should be implemented here

site/components/fiscal-sponsorship/apply/personal-form.js

Lines 26 to 33 in 905b846

	<Field name="userEmail" label="Email" requiredFields={requiredFields}>
	<Input
	name="userEmail"
	id="userEmail"
	type="email"
	placeholder="fiona@hackclub.com"
	/>
	</Field>

The existing implementation is unfortunately in a closed source codebase.

[Chay2203]

Sure, works!

[garyhtou]

Here's the closed-source implementation. You can use it as a guide, however, the implementation we want here will likely be different.

  <div x-data="{ email: '' }">
    <div class="field flex items-end">
      <div class="mr2 flex-auto">
        <%= form.label :email %>
        <%= form.email_field :email, "x-model": "email" %>
      </div>
      <%= form.submit "Send" %>
    </div>
    <template x-if="/^(team|webmaster|marketing|admin|info|about|support|sales|hq|hello)@/.test(email)">
      <div class="warning mt1">⚠️ For security, we discourage team emails on HCB. We recommend individual emails such as <em>ben@hackclub.com</em>!</div>
    </template>
  </div>

^ This implementation uses Alpine.js

[Chay2203]

Sure, will look at it