From d70e33c1d2d0ca4abb1e8bec8f75f2d7a0d870da Mon Sep 17 00:00:00 2001
From: Shaun Hamilton <51722130+ShaunSHamilton@users.noreply.github.com>
Date: Sat, 20 Feb 2021 05:02:44 +0000
Subject: [PATCH] feat(i18n): url validation translations (#41190)

---
 client/i18n/locales/chinese/translations.json       |  5 ++++-
 client/i18n/locales/english/translations.json       |  5 ++++-
 client/i18n/locales/espanol/translations.json       |  5 ++++-
 client/src/components/formHelpers/FormValidators.js | 13 ++++++++-----
 4 files changed, 20 insertions(+), 8 deletions(-)

diff --git a/client/i18n/locales/chinese/translations.json b/client/i18n/locales/chinese/translations.json
index cffb6d3f77..61f71629a4 100644
--- a/client/i18n/locales/chinese/translations.json
+++ b/client/i18n/locales/chinese/translations.json
@@ -474,7 +474,10 @@
     "invalid-url": "我们无法验证你的 URL，请确保填写正确",
     "invalid-protocol": "URL 必须以 http 或 https 开头",
     "url-not-image": "URL 必须直接链接到图片文件",
-    "use-valid-url": "请使用有效的 URL"
+    "use-valid-url": "请使用有效的 URL",
+    "editor-url": "Remember to submit the Live App URL.",
+    "own-work-url": "Remember to submit your own work.",
+    "publicly-visible-url": "Remember to submit a publicly visible app URL."
   },
   "certification": {
     "executive": "执行董事，freeCodeCamp.org",
diff --git a/client/i18n/locales/english/translations.json b/client/i18n/locales/english/translations.json
index 6b8e797016..01cb3d247e 100644
--- a/client/i18n/locales/english/translations.json
+++ b/client/i18n/locales/english/translations.json
@@ -474,7 +474,10 @@
     "invalid-url": "We could not validate your URL correctly, please ensure it is correct",
     "invalid-protocol": "URL must start with http or https",
     "url-not-image": "URL must link directly to an image file",
-    "use-valid-url": "Please use a valid URL"
+    "use-valid-url": "Please use a valid URL",
+    "editor-url": "Remember to submit the Live App URL.",
+    "own-work-url": "Remember to submit your own work.",
+    "publicly-visible-url": "Remember to submit a publicly visible app URL."
   },
   "certification": {
     "executive": "Executive Director, freeCodeCamp.org",
diff --git a/client/i18n/locales/espanol/translations.json b/client/i18n/locales/espanol/translations.json
index 8d7e27b463..016498d868 100644
--- a/client/i18n/locales/espanol/translations.json
+++ b/client/i18n/locales/espanol/translations.json
@@ -474,7 +474,10 @@
     "invalid-url": "No hemos podido validar tu URL correctamente, por favor asegúrate de que sea correcta",
     "invalid-protocol": "La URL debe comenzar con http o https",
     "url-not-image": "La URL debe enlazar directamente hacia un archivo de imagen",
-    "use-valid-url": "Por favor, utiliza una URL válida"
+    "use-valid-url": "Por favor, utiliza una URL válida",
+    "editor-url": "Remember to submit the Live App URL.",
+    "own-work-url": "Remember to submit your own work.",
+    "publicly-visible-url": "Remember to submit a publicly visible app URL."
   },
   "certification": {
     "executive": "Director Ejecutivo, freeCodeCamp.org",
diff --git a/client/src/components/formHelpers/FormValidators.js b/client/src/components/formHelpers/FormValidators.js
index 58176cbb1b..13f4fd4045 100644
--- a/client/src/components/formHelpers/FormValidators.js
+++ b/client/src/components/formHelpers/FormValidators.js
@@ -1,18 +1,21 @@
+import React from 'react';
+import { Trans } from 'react-i18next';
+
 // Matches editor links for: Repl.it, Glitch, CodeSandbox, GitHub
 const editorRegex = /repl\.it\/(@|join\/)|glitch\.com\/edit\/#!|codesandbox\.io\/s\/|github\.com/;
 const fCCRegex = /codepen\.io\/freecodecamp|freecodecamp\.rocks|github\.com\/freecodecamp/i;
 const localhostRegex = /localhost:/;
 
 export const editorValidator = value =>
-  editorRegex.test(value) ? 'Remember to submit the Live App URL.' : null;
+  editorRegex.test(value) ? <Trans>validation.editor-url</Trans> : null;
 
 export const fCCValidator = value =>
-  fCCRegex.test(value) ? 'Remember to submit your own work.' : null;
+  fCCRegex.test(value) ? <Trans>validation.own-work-url</Trans> : null;
 
 export const localhostValidator = value =>
-  localhostRegex.test(value)
-    ? 'Remember to submit a publicly visible app URL.'
-    : null;
+  localhostRegex.test(value) ? (
+    <Trans>validation.publicly-visible-url</Trans>
+  ) : null;
 
 export const composeValidators = (...validators) => value =>
   validators.reduce((error, validator) => error ?? validator?.(value), null);