Automatically add https protocol in dref form source information url

Author: frozenhelium

src/views/DrefApplicationForm/EventDetail/SourceInformationInput/i18n.json

@@ -1,8 +1,8 @@
 {
     "namespace": "drefApplicationForm",
     "strings": {
-        "sourceInformationNameLabel": "Sources of information (optional) name",
-        "sourceInformationLinkLabel": "Sources of information (optional) link",
+        "sourceInformationNameLabel": "Name",
+        "sourceInformationLinkLabel": "Link",
         "sourceInformationDeleteButton": "Delete Source Information"
     }
 }

src/views/DrefApplicationForm/EventDetail/SourceInformationInput/index.tsx

@@ -1,11 +1,12 @@
+import { useCallback } from 'react';
 import {
     type ArrayError,
     useFormObject,
     getErrorObject,
     type SetValueArg,
 } from '@togglecorp/toggle-form';
 import { DeleteBinTwoLineIcon } from '@ifrc-go/icons';
-import { randomString } from '@togglecorp/fujs';
+import { isNotDefined, randomString } from '@togglecorp/fujs';
 
 import Button from '#components/Button';
 import NonFieldError from '#components/NonFieldError';
@@ -51,6 +52,31 @@ function SourceInformationInput(props: Props) {
         ? getErrorObject(errorFromProps?.[value.client_id])
         : undefined;
 
+    const handleSourceFieldChange = useCallback(
+        (newValue: string | undefined) => {
+            if (
+                isNotDefined(newValue)
+                || newValue.startsWith('http://')
+                || newValue.startsWith('https://')
+                || newValue === 'h'
+                || newValue === 'ht'
+                || newValue === 'htt'
+                || newValue === 'http'
+                || newValue === 'http:'
+                || newValue === 'http:/'
+                || newValue === 'https'
+                || newValue === 'https:'
+                || newValue === 'https:/'
+            ) {
+                onFieldChange(newValue, 'source_link');
+                return;
+            }
+
+            onFieldChange(`https://${newValue}`, 'source_link');
+        },
+        [onFieldChange],
+    );
+
     return (
         <div className={styles.sourceInformationInput}>
             <NonFieldError error={error} />
@@ -69,7 +95,7 @@ function SourceInformationInput(props: Props) {
                 name="source_link"
                 value={value.source_link}
                 error={error?.source_link}
-                onChange={onFieldChange}
+                onChange={handleSourceFieldChange}
                 disabled={disabled}
             />
             <Button