Changed validation when creating email

Makefile

@@ -62,4 +62,8 @@ format:
 	flake8 ./app ./tests
 	isort --check-only ./app ./tests
 	mypy ./
-	npx prettier --write app/assets/javascripts app/assets/stylesheets
+	npx prettier --write app/assets/javascripts app/assets/stylesheets
+
+.PHONY: tailwind
+tailwind:
+	npm run tailwind

app/main/validators.py

@@ -149,7 +149,6 @@ def validate_email_from(form, field):
     if email_safe(field.data) != field.data.lower():
         # fix their data instead of only warning them
         field.data = email_safe(field.data)
-        raise ValidationError(_l("Make sure we formatted your email address correctly."))
     if len(field.data) > 64:
         raise ValidationError(_l("This cannot exceed 64 characters in length"))
     # this filler is used because service id is not available when validating a new service to be created

app/templates/components/confirmation-preview.html

@@ -0,0 +1,5 @@
+{% macro confirmation_preview() %}
+<div class="bg-gray-100 border-l-2 border-gray-400 p-gutterHalf space-y-gutterHalf">
+  {{ caller() }}
+</div>
+{% endmacro %}

app/templates/partials/add-service/step-create-service.html

@@ -1,3 +1,5 @@
+{% from "components/confirmation-preview.html" import confirmation_preview %}
+
 <p>{{ _("You can change the name and email address later in Settings.") }}</p>
 <p>{{ _("When GC Notify sends your emails, the ‘From’ field shows the name followed by the email address.") }}</p>
 
@@ -26,10 +28,16 @@ <h2 class="heading-medium">{{ _("Email address") }}</h2>
 
       {{ textbox(form.email_from, hint=hint_txt, suffix=suffix_txt, width='1-2', maxlength=64) }}
 
-      <span id="preview" style="display: none">
-        {{ _("Your service’s email address will be:") }}
-        <b><span id="fixed-email-address"></span>@notification.canada.ca</b>
-      </span>
+      <div id="preview" class="focus:outline-yellow" style="display: none" tabindex="0" >
+        {% call confirmation_preview() %}
+          <p class="m-0">{{_("Make sure we have formatted your email address correctly.")}}</p>
+          <p class="m-0">
+            {{_("Your service’s email address will be: ")}}
+            <b><span id='fixed-email-address'></span>@notification.canada.ca</b>
+          </p>
+        {% endcall %}
+      </div>
+
   </p>
   <p>{{ _("This email address cannot receive replies. In Settings, you can enter a different email for replies. Currently your service is set to prevent replies.") }}</p>
 

app/translations/csv/fr.csv

@@ -1666,7 +1666,7 @@
 "Enter bilingual service name","Saisissez le nom bilingue du service"
 "Maximum 64 characters with no spaces. Characters can include letters, numbers, dots, dashes, and underscores.","64 caractères au maximum, sans espaces. Les caractères peuvent comprendre des lettres, des chiffres, des points, des tirets et des traits de soulignement."
 "This email address cannot receive replies. In Settings, you can enter a different email for replies. Currently your service is set to prevent replies.","Cette adresse courriel ne peut pas recevoir de réponses. Vous pouvez saisir une adresse courriel différente pour les réponses via les paramètres. Votre service est actuellement configuré pour empêcher les réponses."
-"Your service’s email address will be:","L’adresse courriel de votre service sera :"
+"Your service’s email address will be: ","L’adresse courriel de votre service sera : "
 "You can change the order later in Settings.","Vous pourrez changer l’ordre ultérieurement via les paramètres."
 "The email address always ends with ‘@notification.canada.ca’.","L’adresse courriel se termine toujours par « @notification.canada.ca »."
 "Enter the part before ‘@notification.canada.ca’","Saisissez la partie précédant « @notification.canada.ca »."
@@ -1858,3 +1858,4 @@
 "Select a priority queue","Sélectionnez une file de sécurité"
 "Select a folder","Sélectionnez un dossier"
 "Select template","Sélectionner un gabarit"
+"Make sure we have formatted your email address correctly.","Assurez-vous que nous avons correctement formaté votre courriel."

tests/app/main/views/test_add_service.py

@@ -129,15 +129,29 @@ def test_wizard_flow_with_step_2_should_correct_invalid_email_from(
 ):
     with client_request.session_transaction() as session:
         session["add_service_form"] = dict(default_branding=FieldWithLanguageOptions.ENGLISH_OPTION_VALUE)
-    page = client_request.post(
+    client_request.post(
         "main.add_service",
         _data={"name": "testing the post", "email_from": "[Health Canada! - Sante&&Canada]"},
         current_step="choose_service_name",
-        _expected_status=200,
+        _expected_status=302,
+        _expected_redirect=url_for(
+            "main.service_dashboard",
+            service_id=101,
+        ),
     )
 
-    # ensure email has spaces and special characters removed
-    assert page.find(id="email_from")["value"] == "health.canada-santecanada"
+    assert mock_create_service.called is True
+    mock_create_service.assert_called_once_with(
+        service_name="testing the post",
+        organisation_type="central",
+        message_limit=50,
+        sms_daily_limit=50,
+        restricted=True,
+        user_id="6ce466d0-fd6a-11e5-82f5-e0accb9d11a6",
+        email_from="health.canada-santecanada",
+        default_branding_is_french=False,
+        organisation_notes=None,
+    )
 
 
 # TODO: remove this test after the CRM integration is released