Feature/issue 626

.github/CONTRIBUTING.md

@@ -78,21 +78,13 @@ Together's progress and milestones are split into separate, distinct issues. You
 
 > 💡 Issues tagged with `Good 100Devs First Try` are beginner-level issues that are great for fellow 100Devs.
 
-There are two ways to discover issues.
 
+Currently we have the way to discover issues using Issue Tab.
 ### Issues Tab
 
 ![Screenshot of Issues tab on GitHub with example issues representing various stages of a project](assets/contributing-issues-tab.jpg)
 The [Issues tab](https://github.com/Together-100Devs/Together/issues) contains all of the issues that are currently in progress, planned to be worked on, or need further review.
 
-### Projects Tab
-
-## ![Screenshot of Projects tab on GitHub](assets/contributing-projects-tab.jpg)
-
-![Screenshot of Projects view on GitHub](assets/contributing-projects-view.jpg)
-A [project management board](https://github.com/users/Together-100Devs/projects/1) also exists for this project on GitHub. The project management board contains relevant issues to advance the project to the next milestone or release.
-
-> Issues will also be created for any bugs discovered in the project. (Minor fixes and typos do not typically require an issue and can be corrected directly in a pull request with a detailed description.)
 
 ## Editing code and submitting a pull request
 
@@ -137,8 +129,7 @@ Now that you have a personal fork of the project on GitHub, you will be able to
 Now that you have the copy, you will need access to the feature branch related to your issue to create a local working branch to write your code.
 
 1. Set upstream to track the remote repository containing the original repo. (Not just your fork.)  
-   `git remote add upstream https://github.com/Together-100Devs/Together.git`
-
+
 2. Use this command to fetch the list of remote branches.  
    `git fetch upstream`
 

client/src/features/form/FormCreateEvent.jsx

@@ -1,10 +1,12 @@
 import { useFormContext } from "../../contexts/FormContext";
 import { useAuthContext } from "../../contexts/AuthContext";
+import { useState } from "react";
 
 export default function FormCreateEvent() {
   const auth = useAuthContext();
   const { formData, setFormData, formCreateEventErrors } = useFormContext();
-
+  const [charCount, setCharCount] = useState("");
+  const MAX_LENGTH = 280;
   // This updates the form data's in the context
   const handleChange = (e) => {
     const { name, value } = e.target;
@@ -15,10 +17,24 @@ export default function FormCreateEvent() {
       discordName: auth.user?.displayName,
     }));
   };
+  const handleTextChange = (e) => {
+    const { name, value } = e.target;
+
+    setFormData((prevFormData) => ({
+      ...prevFormData,
+      [name]: value,
+      discordName: auth.user?.displayName,
+    }));
+
+    if (value.length <= MAX_LENGTH) {
+      setCharCount(value);
+    }
+  };
 
   return (
     <div className="flex flex-col">
       {formCreateEventErrors.map((error, index) => {
+        console.log(formCreateEventErrors);
         return (
           <div className="alert alert-error shadow-lg text-red-700" key={index}>
             <div>
@@ -64,14 +80,19 @@ export default function FormCreateEvent() {
         <div className="bg-white my-2 p-1 flex border border-gray-200 rounded-sm">
           <textarea
             type="text"
-            onChange={handleChange}
+            maxLength={MAX_LENGTH}
+            onChange={handleTextChange}
             value={formData["description"] || ""}
             name="description"
             placeholder="Description"
             className="p-1 px-2 appearance-none outline-non w-full text-gray-800"
             rows="8"
           ></textarea>
         </div>
+        <p>
+          {" "}
+          {MAX_LENGTH - charCount.length} of {MAX_LENGTH} characters left.
+        </p>
       </div>
 
       {/* LOCATION FIELD */}