Merge pull request #86 from stevebrownlee/develop

Release for automating group projects
stevebrownlee · Oct 10, 2024 · 55e46e0 · 55e46e0
2 parents e9573a9 + 6dc6bd8
commit 55e46e0
Show file tree

Hide file tree

Showing 16 changed files with 355 additions and 11,924 deletions.
diff --git a/postcss.config.js b/postcss.config.js
diff --git a/src/components/cohorts/CohortProvider.js b/src/components/cohorts/CohortProvider.js
@@ -19,6 +19,12 @@ export const CohortProvider = (props) => {
     const { getCurrentUser } = simpleAuth()
     const user = getCurrentUser()
 
+    useEffect(() => {
+        if (activeCohort && !("id" in activeCohortDetails)) {
+            getCohort(activeCohort)
+        }
+    }, [activeCohort])
+
     const getCohorts = useCallback((options={}) => {
         const limit = options.limit ? `?limit=${options.limit}` : ""
         const active = options.active ? `?active=${options.active}` : ""
@@ -27,13 +33,13 @@ export const CohortProvider = (props) => {
             .then(data => setCohorts(data))
     }, [setCohorts])
 
-    const getCohort = useCallback((id) => {
+    const getCohort = (id) => {
         return fetchIt(`${Settings.apiHost}/cohorts/${id}`)
             .then((cohort) => {
                 setCohortDetails(cohort)
                 return cohort
             })
-    }, [user])
+    }
 
     const getCohortInfo = (id) => {
         return fetchIt(`${Settings.apiHost}/cohortinfo/${id}`)

diff --git a/src/components/course/CourseProvider.js b/src/components/course/CourseProvider.js
@@ -17,27 +17,23 @@ export const CourseProvider = (props) => {
         }
     }, [])
 
-
     useEffect(() => {
         if (activeCourse && "id" in activeCourse) {
             localStorage.setItem("activeCourse", activeCourse.id)
         }
     }, [activeCourse])
 
-    const getCourses = useCallback(
-        (cohortId = null) => fetchIt(`${Settings.apiHost}/courses${cohortId ? `?cohortId=${cohortId}` : ""}`)
-            .then((data) => {
-                setCourses(data)
+    const getCourses = (cohortId = null) => fetchIt(`${Settings.apiHost}/courses${cohortId ? `?cohortId=${cohortId}` : ""}`)
+        .then((data) => {
+            setCourses(data)
 
-                if (localStorage.getItem("activeCourse")) {
-                    const course = data.find(c => c.id === parseInt(localStorage.getItem("activeCourse")))
-                    setActiveCourse(course)
-                }
+            if (localStorage.getItem("activeCourse")) {
+                const course = data.find(c => c.id === parseInt(localStorage.getItem("activeCourse")))
+                setActiveCourse(course)
+            }
 
-                return data
-            }),
-        [setCourses, setActiveCourse]
-    )
+            return data
+        })
 
     const getActiveCourse = useCallback(
         (cohortId) => fetchIt(`${Settings.apiHost}/courses?cohortId=${cohortId}&active=true`)
@@ -51,87 +47,50 @@ export const CourseProvider = (props) => {
 
     const getCourse = id => fetchIt(`${Settings.apiHost}/courses/${id}`)
 
-    const createCourse = course => {
-        return fetchIt(`${Settings.apiHost}/courses`, { method: "POST", body: JSON.stringify(course) })
-    }
+    const createCourse = course => fetchIt(`${Settings.apiHost}/courses`, { method: "POST", body: JSON.stringify(course) })
 
-    const editCourse = useCallback(
-        course => fetchIt(`${Settings.apiHost}/courses/${course.id}`, {
-            method: "PUT",
-            body: JSON.stringify(course)
-        }), []
-    )
+    const deactivateCourse = courseId => fetchIt(`${Settings.apiHost}/courses/${courseId}`, { method: "DELETE" })
 
-    const deactivateCourse = useCallback(
-        courseId => fetchIt(`${Settings.apiHost}/courses/${courseId}`, { method: "DELETE" }),
-        []
+    const editCourse = course => fetchIt(`${Settings.apiHost}/courses/${course.id}`, {
+        method: "PUT",
+        body: JSON.stringify(course)
+    }
     )
 
-    const getBooks = useCallback((courseId = null) => {
+    const getBooks = (courseId = null) => {
         const ordering = "?orderBy=course&orderBy=index"
         return fetchIt(`${Settings.apiHost}/books${ordering}${courseId ? `&courseId=${courseId}` : ""}`)
-    }, [])
+    }
 
-    const getBook = useCallback((bookId) => fetchIt(`${Settings.apiHost}/books/${bookId}`), [])
+    const getBook = (bookId) => fetchIt(`${Settings.apiHost}/books/${bookId}`)
 
-    const deleteBook = useCallback(
-        id => fetchIt(`${Settings.apiHost}/books/${id}`, { method: "DELETE" }),
-        []
-    )
+    const deleteBook = id => fetchIt(`${Settings.apiHost}/books/${id}`, { method: "DELETE" })
 
-    const getProjects = useCallback(
-        () => fetchIt(`${Settings.apiHost}/projects?expand=course&expand=book`),
-        []
-    )
+    const getProjects = () => fetchIt(`${Settings.apiHost}/projects?expand=course&expand=book`)
 
-    const getBookProjects = useCallback(
-        (bookId) => fetchIt(`${Settings.apiHost}/projects?bookId=${bookId}`),
-        []
-    )
+    const getBookProjects = (bookId) => fetchIt(`${Settings.apiHost}/projects?bookId=${bookId}`)
 
-    const getProject = useCallback(
-        (id) => fetchIt(`${Settings.apiHost}/projects/${id}?&expand=book&expand=course`),
-        []
-    )
+    const getGroupProjects = () => fetchIt(`${Settings.apiHost}/projects?group=true`)
 
-    const deleteProject = useCallback(
-        id => fetchIt(`${Settings.apiHost}/projects/${id}`, { method: "DELETE" }),
-        []
-    )
+    const getProject = (id) => fetchIt(`${Settings.apiHost}/projects/${id}?&expand=book&expand=course`)
 
-    const editProject = useCallback(
-        project => fetchIt(`${Settings.apiHost}/projects/${project.id}`, {
-            method: "PUT",
-            body: JSON.stringify(project)
-        }), []
-    )
+    const deleteProject = id => fetchIt(`${Settings.apiHost}/projects/${id}`, { method: "DELETE" })
 
-    const editBook = useCallback(
-        book => fetchIt(`${Settings.apiHost}/books/${book.id}`, {
-            method: "PUT",
-            body: JSON.stringify(book)
-        }), []
-    )
+    const editBook = book => fetchIt(`${Settings.apiHost}/books/${book.id}`, { method: "PUT", body: JSON.stringify(book) })
 
-    const migrateCohortToServerSide = useCallback(
-        cohortId => fetchIt(`${Settings.apiHost}/cohorts/${cohortId}/migrate`, {
-            method: "PUT"
-        }), []
-    )
+    const migrateCohortToServerSide = cohortId => fetchIt(`${Settings.apiHost}/cohorts/${cohortId}/migrate`, { method: "PUT" })
 
-    const getLearningObjectives = useCallback(
-        (id) => fetchIt(`${Settings.apiHost}/weights`).then(setObjectives),
-        [setObjectives]
-    )
+    const getLearningObjectives = (id) => fetchIt(`${Settings.apiHost}/weights`).then(setObjectives)
 
     return (
         <CourseContext.Provider value={{
             getCourses, courses, activeCourse, setActiveCourse,
             getCourse, getLearningObjectives, objectives, getBooks,
             getProjects, deleteProject, getActiveCourse, getProject,
-            editProject, migrateCohortToServerSide, getBook, editBook,
+            migrateCohortToServerSide, getBook, editBook,
             deleteBook, createCourse, editCourse, getBookProjects,
-            deactivateCourse, capstoneSeason, setCapstoneSeason
+            deactivateCourse, capstoneSeason, setCapstoneSeason,
+            getGroupProjects
         }} >
             {props.children}
         </CourseContext.Provider>

diff --git a/src/components/course/ProjectDetails.js b/src/components/course/ProjectDetails.js
@@ -32,8 +32,27 @@ export const ProjectDetails = () => {
             {project.name}
         </h1>
         <div className="project__info">
-            <div>Name: {project.name}</div>
-            <div>Position: {project.index}</div>
+            <div><strong>Name:</strong> {project.name}</div>
+            <div><strong>Type:</strong> {project.is_group_project ? "Group project" : "Book project"}</div>
+            {
+                project.is_group_project ?
+                    <>
+                        <div>
+                            <strong>Client side template URL</strong>:
+                            <a href={project.client_template_url} target="_blank">{project.client_template_url}</a>
+                        </div>
+                        {
+                            project.api_template_url ?
+                                <div>
+                                    <strong>API template URL</strong>:
+                                    <a href={project.api_template_url} target="_blank">{project.api_template_url}</a>
+                                </div>
+                                : ""
+                        }
+                    </>
+                    : ""
+            }
+
         </div>
 
         <div className="project__footer">

diff --git a/src/components/course/ProjectForm.js b/src/components/course/ProjectForm.js
@@ -13,14 +13,17 @@ export const ProjectForm = () => {
     const [courses, setCourses] = useState([])
     const [title, setTitle] = useState("")
     const [mode, setMode] = useState("create")
-    const { getBooks, getCourses, getProject, editProject, getBook } = useContext(CourseContext)
+    const { getBooks, getCourses, getProject, getBook } = useContext(CourseContext)
     const [project, updateProject] = useState({
         name: "",
         book: 0,
         course: 0,
         index: 0,
         implementation_url: "",
+        api_template_url: "",
+        client_template_url: "",
         active: true,
+        is_full_stack: false,
         is_group_project: false
     })
     const history = useHistory()
@@ -60,6 +63,11 @@ export const ProjectForm = () => {
             .then(() => history.push(`/books/${project.book}`))
     }
 
+    const editProject = () => {
+        fetchIt(`${Settings.apiHost}/projects/${project.id}`, { method: "PUT", body: JSON.stringify(project) })
+            .then(() => history.push(`/books/${project.book}`))
+    }
+
     const updateState = (event) => {
         const copy = { ...project }
 
@@ -114,6 +122,54 @@ export const ProjectForm = () => {
                     <label htmlFor="is_group_project"> Group project </label>
                 </div>
 
+                {
+                    project.is_group_project
+                        ? <>
+                            <div className="form-group">
+                                <input onChange={updateState}
+                                    checked={project.is_full_stack}
+                                    type="checkbox" required
+                                    controltype="boolean"
+                                    id="is_full_stack"
+                                />
+                                <label htmlFor="is_full_stack"> Full stack project? </label>
+                            </div>
+
+                            <div className="form-group">
+                                <label htmlFor="name">
+                                    Client side template URL
+                                </label>
+                                <input onChange={updateState}
+                                    value={project.client_template_url}
+                                    type="text" required
+                                    controltype="string"
+                                    id="client_template_url"
+                                    className="form-control"
+                                />
+                            </div>
+
+                            {
+                                project.is_full_stack
+                                    ? <>
+                                        <div className="form-group">
+                                            <label htmlFor="name">
+                                                API template URL
+                                            </label>
+                                            <input onChange={updateState}
+                                                value={project.api_template_url}
+                                                type="text" required
+                                                controltype="string"
+                                                id="api_template_url"
+                                                className="form-control"
+                                            />
+                                        </div>
+                                    </>
+                                    : ""
+                            }
+                        </>
+                        : ""
+                }
+
                 <div className="form-group">
                     <input onChange={updateState}
                         checked={project.active}
@@ -132,7 +188,7 @@ export const ProjectForm = () => {
                             constructNewProject()
                         }
                         else {
-                            editProject(project).then(() => history.push(`/books/${project.book}`))
+                            editProject()
                         }
                     }}>Save</Button>
 

diff --git a/src/components/dashboard/Dashboard.css b/src/components/dashboard/Dashboard.css
@@ -168,17 +168,6 @@
     border-top: 1px dotted rgb(137, 188, 188);
 }
 
-.feedback {
-    border: 1px dotted cadetblue;
-    padding: 1rem;
-    background-color: rgb(218, 230, 247);
-}
-
-.feedback__author {
-    font-size: x-small;
-    padding-top: 0.5rem;
-}
-
 .slack {
     display: grid;
     grid-template-columns: 3fr 2fr;

diff --git a/src/components/nav/NavBar.js b/src/components/nav/NavBar.js
@@ -36,7 +36,7 @@ export const NavBar = () => {
                             {makeLink("/", "Students")}
                         </li>
                         <li className="navbar__item">
-                            {makeLink("/teams", "Weekly Teams")}
+                            {makeLink("/teams", "Team Builder")}
                         </li>
                         <li className="navbar__item">
                             {makeLink("/cohorts", "Cohorts")}

diff --git a/src/components/people/PeopleProvider.js b/src/components/people/PeopleProvider.js
@@ -24,7 +24,10 @@ export const PeopleProvider = (props) => {
 
     const getCohortStudents = useCallback((cohortId) => {
         return fetchIt(`${Settings.apiHost}/students?cohort=${cohortId}`)
-            .then(data => setCohortStudents(data))
+            .then(data => {
+                setCohortStudents(data)
+                return data
+            })
     }, [])
 
     const getStudentCoreSkills = useCallback((studentId) => {
@@ -59,7 +62,7 @@ export const PeopleProvider = (props) => {
     }, [])
 
     const tagStudentTeams = useCallback((combos) => {
-        return fetchIt(`${Settings.apiHost}/students/teams`, {
+        return fetchIt(`${Settings.apiHost}/students/cohortteams`, {
             method: "POST",
             body: JSON.stringify({ combos })
         })

diff --git a/src/components/people/TransferStudentDialog.js b/src/components/people/TransferStudentDialog.js
@@ -59,7 +59,6 @@ export const TransferStudentDialog = () => {
                             }
                         </Select.Content>
                     </Select.Root>
-
                 </Flex>
 
                 <Flex gap="3" mt="4" justify="end">

diff --git a/src/components/teams/Teams.css b/src/components/teams/Teams.css
@@ -4,6 +4,12 @@
     margin: 0 0 1rem 0;
 }
 
+.teamsconfig__option {
+    display: flex;
+    flex-direction: column;
+    margin: 0 2rem 0 0;
+}
+
 .teamsconfig__prefix {
     padding: 0.2rem 0.3rem;
     width: 8rem;

diff --git a/src/components/teams/TeamsRepository.js b/src/components/teams/TeamsRepository.js
-Original file line number
+Diff line change
@@ Expand Up / @@ -59,7 +59,6 @@ export const TransferStudentDialog = () => { @@
                                 }
                             </Select.Content>
                         </Select.Root>
                     </Flex>
                     <Flex gap="3" mt="4" justify="end">
@@ Expand Down @@