From b40855bf5998386f6f25ff25a44731fb7873b044 Mon Sep 17 00:00:00 2001
From: Evan Yang <evanjyang4@gmail.com>
Date: Sat, 15 Jul 2023 15:58:56 -0700
Subject: [PATCH 1/4] add validation to editableField

---
 .../manageProjects/editableField.js           | 31 +++++++++++++++++--
 1 file changed, 29 insertions(+), 2 deletions(-)

diff --git a/client/src/components/manageProjects/editableField.js b/client/src/components/manageProjects/editableField.js
index bcf1066e0..f9c9d9d88 100644
--- a/client/src/components/manageProjects/editableField.js
+++ b/client/src/components/manageProjects/editableField.js
@@ -27,6 +27,11 @@ const EditableField = ({
     className: 'editable-field',
     onBlur: () => {
       setEditable(false);
+      if (!validateEditableField(fieldName, fieldValue)) {
+        alert(`Invalid field value for ${fieldName}`);
+        console.log(fieldValue);
+        return;
+      }
       updateProject(fieldName, fieldValue);
     },
     onChange: ({ target }) => {
@@ -47,7 +52,7 @@ const EditableField = ({
     <div className="editable-field-div">
       <div className="project-edit-title">
         {fieldTitle}
-        {notRestricted &&
+        {notRestricted && (
           <button
             type="button"
             className="project-edit-button"
@@ -57,7 +62,7 @@ const EditableField = ({
           >
             [edit]
           </button>
-        }
+        )}
       </div>
 
       {editable ? (
@@ -77,4 +82,26 @@ const EditableField = ({
   );
 };
 
+const validateEditableField = (fieldName, fieldValue) => {
+  switch (fieldName) {
+    case 'hflaWebsiteUrl':
+      return doesLinkContainFlex(fieldValue, 'hackforla.org');
+    case 'slackUrl':
+      return doesLinkContainFlex(fieldValue, 'slack.com');
+    case 'googleDriveUrl':
+      return doesLinkContainFlex(fieldValue, 'drive.google.com');
+    case 'githubUrl':
+      return doesLinkContainFlex(fieldValue, 'github.com');
+    default:
+      break;
+  }
+};
+
+const doesLinkContainFlex = (link, key) => {
+  if (link.startsWith(`https://${key}`)) return true;
+  if (link.startsWith(`https://www.${key}`)) return true;
+  if (link.startsWith(key)) return true;
+  return false;
+}
+
 export default EditableField;

From 63bbff42ee68120c2769ee044114dbc93e79b877 Mon Sep 17 00:00:00 2001
From: Evan Yang <evanjyang4@gmail.com>
Date: Tue, 18 Jul 2023 10:13:32 -0700
Subject: [PATCH 2/4] validation for description

---
 .../manageProjects/editableField.js           | 30 +++------------
 .../utilities/validateEditableField.js        | 37 +++++++++++++++++++
 2 files changed, 42 insertions(+), 25 deletions(-)
 create mode 100644 client/src/components/manageProjects/utilities/validateEditableField.js

diff --git a/client/src/components/manageProjects/editableField.js b/client/src/components/manageProjects/editableField.js
index f9c9d9d88..732cc15df 100644
--- a/client/src/components/manageProjects/editableField.js
+++ b/client/src/components/manageProjects/editableField.js
@@ -1,4 +1,8 @@
 import React, { useState, useRef, useEffect } from 'react';
+import {
+  validateEditableField,
+  generateErrorEditableField,
+} from './utilities/validateEditableField';
 import '../../sass/ManageProjects.scss';
 
 const EditableField = ({
@@ -28,8 +32,7 @@ const EditableField = ({
     onBlur: () => {
       setEditable(false);
       if (!validateEditableField(fieldName, fieldValue)) {
-        alert(`Invalid field value for ${fieldName}`);
-        console.log(fieldValue);
+        alert(generateErrorEditableField(fieldName));
         return;
       }
       updateProject(fieldName, fieldValue);
@@ -64,7 +67,6 @@ const EditableField = ({
           </button>
         )}
       </div>
-
       {editable ? (
         <>
           {fieldType === 'textarea' ? (
@@ -82,26 +84,4 @@ const EditableField = ({
   );
 };
 
-const validateEditableField = (fieldName, fieldValue) => {
-  switch (fieldName) {
-    case 'hflaWebsiteUrl':
-      return doesLinkContainFlex(fieldValue, 'hackforla.org');
-    case 'slackUrl':
-      return doesLinkContainFlex(fieldValue, 'slack.com');
-    case 'googleDriveUrl':
-      return doesLinkContainFlex(fieldValue, 'drive.google.com');
-    case 'githubUrl':
-      return doesLinkContainFlex(fieldValue, 'github.com');
-    default:
-      break;
-  }
-};
-
-const doesLinkContainFlex = (link, key) => {
-  if (link.startsWith(`https://${key}`)) return true;
-  if (link.startsWith(`https://www.${key}`)) return true;
-  if (link.startsWith(key)) return true;
-  return false;
-}
-
 export default EditableField;
diff --git a/client/src/components/manageProjects/utilities/validateEditableField.js b/client/src/components/manageProjects/utilities/validateEditableField.js
new file mode 100644
index 000000000..cbd463fe7
--- /dev/null
+++ b/client/src/components/manageProjects/utilities/validateEditableField.js
@@ -0,0 +1,37 @@
+export const validateEditableField = (fieldName, fieldValue) => {
+  switch (fieldName) {
+    case 'hflaWebsiteUrl':
+      return doesLinkContainFlex(fieldValue, 'hackforla.org');
+    case 'slackUrl':
+      return doesLinkContainFlex(fieldValue, 'slack.com');
+    case 'googleDriveUrl':
+      return doesLinkContainFlex(fieldValue, 'drive.google.com');
+    case 'githubUrl':
+      return doesLinkContainFlex(fieldValue, 'github.com');
+    case 'description':
+      return typeof fieldValue === 'string' && fieldValue.length <= 250;
+    default:
+      break;
+  }
+};
+
+export const generateErrorEditableField = (fieldName) => {
+  switch (fieldName) {
+    case 'hflaWebsiteUrl':
+    case 'slackUrl':
+    case 'googleDriveUrl':
+    case 'githubUrl':
+      return `Invalid field value for ${fieldName}`;
+    case 'description':
+      return 'Description is too long, max 250 characters allowed';
+    default:
+      break;
+  }
+};
+
+const doesLinkContainFlex = (link, key) => {
+  if (link.startsWith(`https://${key}`)) return true;
+  if (link.startsWith(`https://www.${key}`)) return true;
+  if (link.startsWith(key)) return true;
+  return false;
+};

From 8c7e76077efb2b59b135c22aff7c7fb3bc684441 Mon Sep 17 00:00:00 2001
From: Evan Yang <evanjyang4@gmail.com>
Date: Sat, 22 Jul 2023 08:55:49 -0700
Subject: [PATCH 3/4] trim whitespace for editable field + fix bug with switch
 statement

---
 client/src/components/manageProjects/editableField.js           | 2 ++
 .../manageProjects/utilities/validateEditableField.js           | 1 +
 2 files changed, 3 insertions(+)

diff --git a/client/src/components/manageProjects/editableField.js b/client/src/components/manageProjects/editableField.js
index 732cc15df..6901f5cf2 100644
--- a/client/src/components/manageProjects/editableField.js
+++ b/client/src/components/manageProjects/editableField.js
@@ -35,6 +35,8 @@ const EditableField = ({
         alert(generateErrorEditableField(fieldName));
         return;
       }
+      let trimmedFieldValue = fieldValue.trim();
+      setFieldValue(trimmedFieldValue);
       updateProject(fieldName, fieldValue);
     },
     onChange: ({ target }) => {
diff --git a/client/src/components/manageProjects/utilities/validateEditableField.js b/client/src/components/manageProjects/utilities/validateEditableField.js
index cbd463fe7..b4a68a4dd 100644
--- a/client/src/components/manageProjects/utilities/validateEditableField.js
+++ b/client/src/components/manageProjects/utilities/validateEditableField.js
@@ -13,6 +13,7 @@ export const validateEditableField = (fieldName, fieldValue) => {
     default:
       break;
   }
+  return true;
 };
 
 export const generateErrorEditableField = (fieldName) => {

From 526393f4562ef05e838940d317ad4e9b305aac53 Mon Sep 17 00:00:00 2001
From: Trillium S <Spiteless@gmail.com>
Date: Wed, 6 Sep 2023 18:22:02 -0700
Subject: [PATCH 4/4] feat: Drop changes to EditableField.js

---
 .../components/manageProjects/editableField.js    | 15 +++------------
 1 file changed, 3 insertions(+), 12 deletions(-)

diff --git a/client/src/components/manageProjects/editableField.js b/client/src/components/manageProjects/editableField.js
index 6901f5cf2..bcf1066e0 100644
--- a/client/src/components/manageProjects/editableField.js
+++ b/client/src/components/manageProjects/editableField.js
@@ -1,8 +1,4 @@
 import React, { useState, useRef, useEffect } from 'react';
-import {
-  validateEditableField,
-  generateErrorEditableField,
-} from './utilities/validateEditableField';
 import '../../sass/ManageProjects.scss';
 
 const EditableField = ({
@@ -31,12 +27,6 @@ const EditableField = ({
     className: 'editable-field',
     onBlur: () => {
       setEditable(false);
-      if (!validateEditableField(fieldName, fieldValue)) {
-        alert(generateErrorEditableField(fieldName));
-        return;
-      }
-      let trimmedFieldValue = fieldValue.trim();
-      setFieldValue(trimmedFieldValue);
       updateProject(fieldName, fieldValue);
     },
     onChange: ({ target }) => {
@@ -57,7 +47,7 @@ const EditableField = ({
     <div className="editable-field-div">
       <div className="project-edit-title">
         {fieldTitle}
-        {notRestricted && (
+        {notRestricted &&
           <button
             type="button"
             className="project-edit-button"
@@ -67,8 +57,9 @@ const EditableField = ({
           >
             [edit]
           </button>
-        )}
+        }
       </div>
+
       {editable ? (
         <>
           {fieldType === 'textarea' ? (