Introduce PropertyFormat to avoid validation errors that can lead to internal exceptions

backend/src/Notifo.Domain.Integrations.Abstractions/IntegrationProperty.cs

@@ -39,6 +39,8 @@ public sealed record IntegrationProperty(string Name, PropertyType Type)
 
     public string? Pattern { get; init; }
 
+    public PropertyFormat Format { get; init; } = PropertyFormat.None;
+
     public bool IsValid(string? input, [MaybeNullWhen(true)] out string error)
     {
         switch (Type)
@@ -170,6 +172,29 @@ private bool TryGetString(string? input, [MaybeNullWhen(true)] out string error,
             }
         }
 
+        if (!string.IsNullOrWhiteSpace(input) && Format != PropertyFormat.None)
+        {
+            switch (Format)
+            {
+                case PropertyFormat.Email:
+                    if (!Regex.IsMatch(input, ValidationPatterns.Email))
+                    {
+                        error = Texts.IntegrationPropertyFormatEmail;
+                        return false;
+                    }
+
+                    break;
+                case PropertyFormat.Url:
+                    if (!Uri.TryCreate(input, UriKind.Absolute, out var uri) || !((string[])["http", "https"]).Contains(uri.Scheme, StringComparer.OrdinalIgnoreCase))
+                    {
+                        error = Texts.IntegrationPropertyFormatUrl;
+                        return false;
+                    }
+
+                    break;
+            }
+        }
+
         return true;
     }
 

backend/src/Notifo.Domain.Integrations.Abstractions/PropertyFormat.cs

@@ -0,0 +1,15 @@
+// ==========================================================================
+//  Notifo.io
+// ==========================================================================
+//  Copyright (c) Sebastian Stehle
+//  All rights reserved. Licensed under the MIT license.
+// ==========================================================================
+
+namespace Notifo.Domain.Integrations;
+
+public enum PropertyFormat
+{
+    None,
+    Email,
+    Url
+}

backend/src/Notifo.Domain.Integrations.Abstractions/Resources/Texts.resx

@@ -120,6 +120,12 @@
   <data name="IntegrationPropertyAllowedValue" xml:space="preserve">
     <value>Field is not an allowed value.</value>
   </data>
+  <data name="IntegrationPropertyFormatEmail" xml:space="preserve">
+    <value>Field is not a valid e-mail.</value>
+  </data>
+  <data name="IntegrationPropertyFormatUrl" xml:space="preserve">
+    <value>Field is not a valid URL (remember about the protocol).</value>
+  </data>
   <data name="IntegrationPropertyInvalidBoolean" xml:space="preserve">
     <value>Not a valid boolean value.</value>
   </data>

backend/src/Notifo.Domain.Integrations.Abstractions/ValidationPatterns.cs

@@ -0,0 +1,7 @@
+namespace Notifo.Domain.Integrations;
+
+public static class ValidationPatterns
+{
+    // Taken from Yup's source code (validation library used on the front-end side).
+    public const string Email = @"^[a-zA-Z0-9.!#$%&'*+\/=?^_`{|}~-]+@[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?(?:\.[a-zA-Z0-9](?:[a-zA-Z0-9-]{0,61}[a-zA-Z0-9])?)*$";
+}

backend/src/Notifo.Domain.Integrations/AmazonSES/IntegratedAmazonSESIntegration.cs

@@ -29,11 +29,11 @@ public sealed class IntegratedAmazonSESIntegration : IIntegration, IInitializabl
 
     public static readonly IntegrationProperty FromEmailProperty = new IntegrationProperty("fromEmail", PropertyType.Text)
     {
-        Pattern = Patterns.Email,
         EditorLabel = Texts.Email_FromEmailLabel,
         EditorDescription = Texts.Email_FromEmailDescription,
         IsRequired = true,
-        Summary = true
+        Summary = true,
+        Format = PropertyFormat.Email
     };
 
     public static readonly IntegrationProperty FromNameProperty = new IntegrationProperty("fromName", PropertyType.Text)

backend/src/Notifo.Domain.Integrations/Http/HttpIntegration.cs

@@ -18,7 +18,8 @@ public sealed partial class HttpIntegration : IIntegration
         EditorLabel = Texts.Webhook_URLLabel,
         EditorDescription = Texts.Webhook_URLHints,
         IsRequired = true,
-        Summary = true
+        Summary = true,
+        Format = PropertyFormat.Url,
     };
 
     private static readonly IntegrationProperty HttpMethodProperty = new IntegrationProperty("Method", PropertyType.Text)

backend/src/Notifo.Domain.Integrations/Mailchimp/MailchimpIntegration.cs

@@ -22,11 +22,11 @@ public sealed partial class MailchimpIntegration : IIntegration
 
     public static readonly IntegrationProperty FromEmailProperty = new IntegrationProperty("fromEmail", PropertyType.Text)
     {
-        Pattern = Patterns.Email,
         EditorLabel = Texts.Email_FromEmailLabel,
         EditorDescription = Texts.Email_FromEmailDescription,
         IsRequired = true,
-        Summary = true
+        Summary = true,
+        Format = PropertyFormat.Email
     };
 
     public static readonly IntegrationProperty FromNameProperty = new IntegrationProperty("fromName", PropertyType.Text)

backend/src/Notifo.Domain.Integrations/Mailjet/MailjetIntegration.cs

@@ -29,11 +29,11 @@ public sealed partial class MailjetIntegration : IIntegration
 
     public static readonly IntegrationProperty FromEmailProperty = new IntegrationProperty("fromEmail", PropertyType.Text)
     {
-        Pattern = Patterns.Email,
         EditorLabel = Texts.Email_FromEmailLabel,
         EditorDescription = Texts.Email_FromEmailDescription,
         IsRequired = true,
-        Summary = true
+        Summary = true,
+        Format = PropertyFormat.Email
     };
 
     public static readonly IntegrationProperty FromNameProperty = new IntegrationProperty("fromName", PropertyType.Text)

backend/src/Notifo.Domain.Integrations/Resources/Texts.resx

@@ -438,7 +438,7 @@ When you have done this send me an /update command.</value>
     <value>Send Always</value>
   </data>
   <data name="Webhook_URLHints" xml:space="preserve">
-    <value>The URL to your server endpoint.</value>
+    <value>The URL to your server endpoint. Remember about the protocol (http, https).</value>
   </data>
   <data name="Webhook_URLLabel" xml:space="preserve">
     <value>URL</value>

backend/src/Notifo.Domain.Integrations/Smtp/SmtpIntegration.cs

@@ -42,11 +42,11 @@ public sealed partial class SmtpIntegration : IIntegration
 
     public static readonly IntegrationProperty FromEmailProperty = new IntegrationProperty("fromEmail", PropertyType.Text)
     {
-        Pattern = Patterns.Email,
         EditorLabel = Texts.Email_FromEmailLabel,
         EditorDescription = Texts.Email_FromEmailDescription,
         IsRequired = true,
-        Summary = true
+        Summary = true,
+        Format = PropertyFormat.Email,
     };
 
     public static readonly IntegrationProperty FromNameProperty = new IntegrationProperty("fromName", PropertyType.Text)

backend/src/Notifo/Areas/Api/Controllers/Apps/Dtos/IntegrationPropertyDto.cs

@@ -72,6 +72,11 @@ public sealed class IntegrationPropertyDto
     /// </summary>
     public string? Pattern { get; set; }
 
+    /// <summary>
+    /// Format of the field, used to both validate the input and to provide hints to the user.
+    /// </summary>
+    public PropertyFormat Format { get; set; }
+
     /// <summary>
     /// The default value.
     /// </summary>

backend/tests/Notifo.Domain.Tests/Integrations/IntegrationPropertyTests.cs

@@ -158,6 +158,76 @@ public void Should_not_fail_if_undefined_value_is_not_an_allowed_value(string? i
             Assert.Equal("allowed", property.GetString(source));
         }
 
+        [Theory]
+        [InlineData("localhost.com/test")]
+        [InlineData("192.168.0.101")]
+        [InlineData("randomString")]
+        public void Should_fail_if_url_is_invalid(string? input)
+        {
+            var source = new Dictionary<string, string>
+            {
+                ["key"] = input!
+            };
+
+            var property = new IntegrationProperty("key", PropertyType.Text)
+            {
+                Format = PropertyFormat.Url
+            };
+
+            Assert.Throws<ValidationException>(() => property.GetString(source));
+        }
+
+        [Theory]
+        [InlineData("http://localhost/test")]
+        [InlineData("https://example.com/test?query=example")]
+        [InlineData("http://login:[email protected]/random")]
+        public void Should_get_url_if_value_is_valid(string? input)
+        {
+            var source = new Dictionary<string, string>
+            {
+                ["key"] = input!
+            };
+
+            var property = new IntegrationProperty("key", PropertyType.Text)
+            {
+                Format = PropertyFormat.Url
+            };
+
+            Assert.Equal(input, property.GetString(source));
+        }
+
+        [Fact]
+        public void Should_fail_if_email_is_invalid()
+        {
+            var source = new Dictionary<string, string>
+            {
+                ["key"] = "invalidEmail"
+            };
+
+            var property = new IntegrationProperty("key", PropertyType.Text)
+            {
+                Format = PropertyFormat.Email
+            };
+
+            Assert.Throws<ValidationException>(() => property.GetString(source));
+        }
+
+        [Fact]
+        public void Should_get_email_if_value_is_valid()
+        {
+            var source = new Dictionary<string, string>
+            {
+                ["key"] = "[email protected]"
+            };
+
+            var property = new IntegrationProperty("key", PropertyType.Text)
+            {
+                Format = PropertyFormat.Email
+            };
+
+            Assert.Equal(source["key"], property.GetString(source));
+        }
+
         [Fact]
         public void Should_get_value_if_all_requirements_are_met()
         {

frontend/src/app/pages/integrations/IntegrationDialog.tsx

@@ -124,6 +124,10 @@ export const IntegrationDialog = (props: IntegrationDialogProps) => {
                     propertyType = propertyType.max(property.maxLength, texts.validation.maxLengthFn);
                 }
 
+                if (property.format && property.format !== "None") {
+                    propertyType = propertyType.formatI18n(property.format);
+                }
+
                 if (property.pattern) {
                     propertyType = propertyType.matches(new RegExp(property.pattern), texts.validation.patternFn);
                 }
@@ -271,6 +275,20 @@ export const FormField = ({ property }: { property: IntegrationPropertyDto }) =>
                         label={label} hints={property.editorDescription} />
                 );
             } else {
+                if (property.format && property.format !== 'None') {
+                    switch (property.format) {
+                        case 'Email':
+                            return (
+                                <Forms.Email name={name}
+                                    label={label} hints={property.editorDescription} />
+                            );
+                        case 'Url':
+                            return (
+                                <Forms.Url name={name}
+                                    label={label} hints={property.editorDescription} />
+                            );
+                    }
+                }
                 return (
                     <Forms.Text name={name}
                         label={label} hints={property.editorDescription} />

frontend/src/app/pages/users/UserDialog.tsx

@@ -119,7 +119,7 @@ export const UserDialog = (props: UserDialogProps) => {
                                     <Forms.Text name='emailAddress'
                                         label={texts.common.emailAddress} />
 
-                                    <Forms.Text name='phoneNumber'
+                                    <Forms.Phone name='phoneNumber'
                                         label={texts.common.phoneNumber} />
 
                                     <Forms.Select name='preferredLanguage' options={coreLanguages}

frontend/src/app/service/service.ts

@@ -7430,11 +7430,14 @@ export interface IntegrationPropertyDto {
     maxLength?: number | undefined;
     /** The pattern (for strings). */
     pattern?: string | undefined;
+    /** Format of the field, used to both validate the input and to provide hints to the user. */
+    format: PropertyFormat;
     /** The default value. */
     defaultValue?: any | undefined;
 }
 
 export type PropertyType = "Text" | "Number" | "MultilineText" | "Password" | "Boolean";
+export type PropertyFormat = "None" | "Email" | "Url";
 
 export interface IntegrationCreatedDto {
     /** The ID of the integration. */

frontend/src/app/shared/components/Forms.tsx

@@ -177,6 +177,14 @@ export module Forms {
         );
     };
 
+    export const Phone = ({ placeholder, ...other }: FormEditorProps) => {
+        return (
+            <Forms.Row {...other}>
+                <InputSpecial type='tel' name={other.name} placeholder={placeholder} />
+            </Forms.Row>
+        );
+    }
+
     export const Url = ({ placeholder, ...other }: FormEditorProps) => {
         return (
             <Forms.Row {...other}>

frontend/src/app/shared/utils/model.ts

@@ -5,7 +5,7 @@
  * Copyright (c) Sebastian Stehle. All rights reserved.
  */
 
-import { ChannelCondition, ChannelRequired, ChannelSend, ConfirmMode, IsoDayOfWeek, SchedulingType, TopicChannel } from '@app/service';
+import { ChannelCondition, ChannelRequired, ChannelSend, ConfirmMode, IsoDayOfWeek, PropertyFormat, SchedulingType, TopicChannel } from '@app/service';
 import { texts } from '@app/texts';
 
 export const CHANNELS = [
@@ -106,4 +106,4 @@ export const WEEK_DAYS: ReadonlyArray<Mode<IsoDayOfWeek | undefined>> = [{
 }, {
     value: 'Saturday',
     label: texts.common.weekDays.saturday,
-}];
+}];