Merge branch 'GREG-60_mobile_phone_validation' into 'master'

GREG-60: Mobile phone validation

See merge request !81

frontend/package-lock.json

@@ -32,6 +32,7 @@
         "i18next": "^20.6.0",
         "i18next-browser-languagedetector": "^6.1.2",
         "i18next-http-backend": "^1.3.1",
+        "libphonenumber-js": "^1.9.35",
         "react": "^17.0.2",
         "react-datepicker": "^4.2.1",
         "react-dom": "^17.0.2",
@@ -13856,6 +13857,11 @@
         "node": ">= 0.8.0"
       }
     },
+    "node_modules/libphonenumber-js": {
+      "version": "1.9.35",
+      "resolved": "https://registry.npmjs.org/libphonenumber-js/-/libphonenumber-js-1.9.35.tgz",
+      "integrity": "sha512-6ok1JD4GcU7owpbp07WJZlxoGdlY538OCgN9fmOlWwCzqPNLzra7tvaFz7NJP8Hcmp1lkm97wNZ2hICN9uGylg=="
+    },
     "node_modules/lines-and-columns": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.1.6.tgz",
@@ -33040,6 +33046,11 @@
         "type-check": "~0.4.0"
       }
     },
+    "libphonenumber-js": {
+      "version": "1.9.35",
+      "resolved": "https://registry.npmjs.org/libphonenumber-js/-/libphonenumber-js-1.9.35.tgz",
+      "integrity": "sha512-6ok1JD4GcU7owpbp07WJZlxoGdlY538OCgN9fmOlWwCzqPNLzra7tvaFz7NJP8Hcmp1lkm97wNZ2hICN9uGylg=="
+    },
     "lines-and-columns": {
       "version": "1.1.6",
       "resolved": "https://registry.npmjs.org/lines-and-columns/-/lines-and-columns-1.1.6.tgz",

frontend/package.json

@@ -27,6 +27,7 @@
     "i18next": "^20.6.0",
     "i18next-browser-languagedetector": "^6.1.2",
     "i18next-http-backend": "^1.3.1",
+    "libphonenumber-js": "^1.9.35",
     "react": "^17.0.2",
     "react-datepicker": "^4.2.1",
     "react-dom": "^17.0.2",

frontend/public/locales/en/common.json

@@ -50,7 +50,8 @@
     "nationalIdNumberRequired": "National ID number required",
     "roleTypeRequired": "Role type is required",
     "roleEndRequired": "Role end date is required",
-    "emailRequired": "E-mail is required"
+    "emailRequired": "E-mail is required",
+    "invalidMobilePhoneNumber": "Invalid phone number"
   },
   "button": {
     "back": "Back",

frontend/public/locales/nb/common.json

@@ -50,7 +50,8 @@
     "nationalIdNumberRequired": "Fødselsnummer er påkrevd",
     "roleTypeRequired": "Rolletype er påkrevd",
     "roleEndRequired": "Sluttdato for rolle er påkrevd",
-    "emailRequired": "E-post er obligatorisk"
+    "emailRequired": "E-post er obligatorisk",
+    "invalidMobilePhoneNumber": "Ugyldig telefonnummer"
   },
   "button": {
     "back": "Tilbake",

frontend/public/locales/nn/common.json

@@ -52,6 +52,7 @@
     "roleTypeRequired": "Rolletype er påkrevd",
     "roleEndRequired": "Sluttdato for rolle er påkrevd",
     "emailRequired": "E-post er obligatorisk"
+    "invalidMobilePhoneNumber": "Ugyldig telefonnummer"
   },
   "button": {
     "back": "Tilbake",

frontend/src/utils/index.test.ts

+import { isValidMobilePhoneNumber } from './index'
+
+// Mock i18next module to return a translation that just returns the key
+jest.mock('i18next', () => ({
+  t: (value: string) => value,
+}))
+
+test('Invalid phone number', async () => {
+  expect(isValidMobilePhoneNumber('dafasfdsfasdf')).not.toEqual(true)
+})
+
+test('Valid phone number', async () => {
+  expect(isValidMobilePhoneNumber('+47 97510000')).toEqual(true)
+})

frontend/src/utils/index.ts

 import validator from '@navikt/fnrvalidator'
 import i18n from 'i18next'
+import {isValidPhoneNumber} from 'libphonenumber-js'
 
 export function getCookie(name: string) {
-  if (!document.cookie) {
-    return null
-  }
+    if (!document.cookie) {
+        return null
+    }
 
-  const cookies = document.cookie
-    .split(';')
-    .map((c) => c.trim())
-    .filter((c) => c.startsWith(`${name}=`))
+    const cookies = document.cookie
+        .split(';')
+        .map((c) => c.trim())
+        .filter((c) => c.startsWith(`${name}=`))
 
-  if (cookies.length === 0) {
-    return null
-  }
-  return decodeURIComponent(cookies[0].split('=')[1])
+    if (cookies.length === 0) {
+        return null
+    }
+    return decodeURIComponent(cookies[0].split('=')[1])
 }
 
 export function maybeCsrfToken() {
-  const csrfToken = getCookie('csrftoken')
-  if (!csrfToken) {
-    return null
-  }
-  return {
-    'X-CSRFToken': csrfToken,
-  }
+    const csrfToken = getCookie('csrftoken')
+    if (!csrfToken) {
+        return null
+    }
+    return {
+        'X-CSRFToken': csrfToken,
+    }
 }
 
 export function postJsonOpts(data: object): RequestInit {
-  return {
-    method: 'POST',
-    headers: {
-      'Content-Type': 'application/json',
-      ...maybeCsrfToken(),
-    },
-    body: JSON.stringify(data),
-    credentials: 'same-origin',
-  }
+    return {
+        method: 'POST',
+        headers: {
+            'Content-Type': 'application/json',
+            ...maybeCsrfToken(),
+        },
+        body: JSON.stringify(data),
+        credentials: 'same-origin',
+    }
 }
 
 export function isValidFnr(data: string | undefined): boolean | string {
-  if (data === null) {
+    if (data === null) {
+        return i18n.t('common:validation.invalidIdNumber').toString()
+    }
+    const valid = validator.idnr(data as string).status === 'valid'
+    if (valid) {
+        return true
+    }
+    // TypeScript complains if toString is not used on the function result
     return i18n.t('common:validation.invalidIdNumber').toString()
-  }
-  const valid = validator.idnr(data as string).status === 'valid'
-  if (valid) {
-    return true
-  }
-  // TypeScript complains if toString is not used on the function result
-  return i18n.t('common:validation.invalidIdNumber').toString()
 }
+
+export function isValidMobilePhoneNumber(data: string | undefined): boolean | string {
+    if (!data) {
+        return i18n.t<string>('common:validation.invalidMobilePhoneNumber')
+    }
+    const valid = isValidPhoneNumber(data)
+    if (valid) {
+        return true
+    }
+    return i18n.t<string>('common:validation.invalidMobilePhoneNumber')
+}
\ No newline at end of file