Merge pull request #796 from wickathou/fix/dashboard-performance-organizers

wickathou · web-flow · commit fdebfb5b75b1 · 2024-04-11T17:14:25.000+03:00
Fix - Fixes for the participant and projects view, plus improved performance Dashboard organizers
diff --git a/frontend/src/components/tables/ProjectsTable/index.js b/frontend/src/components/tables/ProjectsTable/index.js
@@ -14,13 +14,16 @@ const ProjectsTable = ({ projects }) => {
     const event = useSelector(OrganiserSelectors.event)
 
     const skipArray = ['_id', '__v', 'id', 'key', 'section']
-    function flattenObject(ob) {
+    const flattenObject = ob => {
         let toReturn = {}
         for (let i in ob) {
             if (!ob.hasOwnProperty(i) || skipArray.some(val => val === i))
                 continue
 
-            if (typeof ob[i] === 'object' && ob[i] !== null) {
+            if (i === 'description' || i === 'punchline') {
+                toReturn[i] = ob[i].replace(/"/g, '""')
+                continue
+            } else if (typeof ob[i] === 'object' && ob[i] !== null) {
                 let flatObject = flattenObject(ob[i])
                 for (let x in flatObject) {
                     if (!flatObject.hasOwnProperty(x)) continue
@@ -109,6 +112,18 @@ const ProjectsTable = ({ projects }) => {
         setSelected(selectedRows)
     }
 
+    // debugGroup(
+    //     'Projects to export',
+    //     selected.map(item => {
+    //         const returnObject = {
+    //             ...flattenObject(item.original),
+    //             projectId: item.original._id,
+    //             projectURL: projectURLgenerator(event.slug, item.original._id),
+    //         }
+    //         return returnObject
+    //     }),
+    // )
+
     return (
         <>
             <EditProjectModal
@@ -131,12 +146,12 @@ const ProjectsTable = ({ projects }) => {
                                 }}
                                 data={selected.map(item => {
                                     const returnObject = {
-                                        ...flattenObject(item.original),
                                         projectId: item.original._id,
                                         projectURL: projectURLgenerator(
                                             event.slug,
                                             item.original._id,
                                         ),
+                                        ...flattenObject(item.original),
                                     }
                                     return returnObject
                                 })}
diff --git a/frontend/src/pages/_dashboard/renderDashboard/organiser/edit/index.js b/frontend/src/pages/_dashboard/renderDashboard/organiser/edit/index.js
@@ -21,7 +21,7 @@ import ChallengesTab from './challenges'
 import ScheduleTab from './schedule'
 import QuestionsTab from './questions'
 import SubmissionFormTab from './submission'
-import TimelineTab from './timeline'
+// import TimelineTab from './timeline'
 import MeetingRoomsTab from './meetingRooms'
 import OtherTab from './other'
 import HackerpackTab from './hackerpack'
diff --git a/frontend/src/pages/_dashboard/renderDashboard/organiser/index.js b/frontend/src/pages/_dashboard/renderDashboard/organiser/index.js
@@ -49,22 +49,22 @@ export default () => {
 
     useEffect(() => {
         if (event) {
-            dispatch(
-                OrganiserActions.updateOrganisersForEvent(
-                    event.owner,
-                    event.organisers,
-                ),
-            )
+            // dispatch(
+            //     OrganiserActions.updateOrganisersForEvent(
+            //         event.owner,
+            //         event.organisers,
+            //     ),
+            // )
             dispatch(
                 OrganiserActions.updateRecruitersForEvent(event.recruiters),
             )
-            dispatch(OrganiserActions.updateRegistrationsForEvent(slug))
-            dispatch(OrganiserActions.updateTeamsForEvent(slug))
+            // dispatch(OrganiserActions.updateRegistrationsForEvent(slug))
+            // dispatch(OrganiserActions.updateTeamsForEvent(slug))
             dispatch(OrganiserActions.updateFilterGroups(slug))
-            dispatch(OrganiserActions.updateProjects(slug))
-            dispatch(OrganiserActions.updateGavelProjects(slug))
-            dispatch(OrganiserActions.updateRankings(slug))
-            dispatch(OrganiserActions.generateResults(slug)) // TODO do we need to get results always?
+            // dispatch(OrganiserActions.updateProjects(slug))
+            // dispatch(OrganiserActions.updateGavelProjects(slug))
+            // dispatch(OrganiserActions.updateRankings(slug))
+            // dispatch(OrganiserActions.generateResults(slug)) // TODO do we need to get results always?
         }
     }, [dispatch, slug, event])
     return (
diff --git a/frontend/src/pages/_dashboard/renderDashboard/organiser/participants/index.js b/frontend/src/pages/_dashboard/renderDashboard/organiser/participants/index.js
@@ -1,4 +1,4 @@
-import React from 'react'
+import React, { useEffect } from 'react'
 
 import { useRouteMatch, useLocation } from 'react-router'
 import PageWrapper from 'components/layouts/PageWrapper'
@@ -10,10 +10,22 @@ import TeamsTab from './teams'
 import AssignedTab from './assigned'
 // import TravelTab from './travel'
 import AdminTab from './admin'
+import * as OrganiserSelectors from 'redux/organiser/selectors'
+import * as OrganiserActions from 'redux/organiser/actions'
+import { useDispatch, useSelector } from 'react-redux'
 
 export default () => {
+    const event = useSelector(OrganiserSelectors.event)
+    const dispatch = useDispatch()
     const match = useRouteMatch()
     const location = useLocation()
+
+    useEffect(() => {
+        if (event) {
+            dispatch(OrganiserActions.updateRegistrationsForEvent(event.slug))
+            dispatch(OrganiserActions.updateTeamsForEvent(event.slug))
+        }
+    }, [event, location])
     return (
         <PageWrapper>
             <PageHeader
diff --git a/frontend/src/pages/_dashboard/renderDashboard/organiser/projects/by-challenge/index.js b/frontend/src/pages/_dashboard/renderDashboard/organiser/projects/by-challenge/index.js
@@ -3,9 +3,9 @@ import { useSelector } from 'react-redux'
 import { sortBy } from 'lodash-es'
 import {
     Box,
-    ExpansionPanel,
-    ExpansionPanelSummary,
-    ExpansionPanelDetails,
+    Accordion,
+    AccordionSummary,
+    AccordionDetails,
     ListItemText,
 } from '@material-ui/core'
 import ExpandMoreIcon from '@material-ui/icons/ExpandMore'
@@ -24,7 +24,6 @@ export default () => {
         const projectsWithTeam = projects
             .map(project => {
                 const teamFound = teams.find(team => {
-                    console.log(team._id, project.team)
                     return team._id === project.team
                 })
                 if (teamFound) {
@@ -48,8 +47,8 @@ export default () => {
             {challenges.map(challenge => {
                 const projects = getProjectsForChallenge(challenge.slug)
                 return (
-                    <ExpansionPanel key={challenge.slug}>
-                        <ExpansionPanelSummary
+                    <Accordion key={challenge.slug}>
+                        <AccordionSummary
                             expandIcon={<ExpandMoreIcon />}
                             aria-controls="panel1a-content"
                             id="panel1a-header"
@@ -58,8 +57,8 @@ export default () => {
                                 primary={challenge.name}
                                 secondary={`${challenge.partner} // ${projects.length} projects`}
                             ></ListItemText>
-                        </ExpansionPanelSummary>
-                        <ExpansionPanelDetails>
+                        </AccordionSummary>
+                        <AccordionDetails>
                             <Box
                                 display="flex"
                                 flexDirection="column"
@@ -68,13 +67,10 @@ export default () => {
                                 <Box p={1}>
                                     <ChallengeLink challenge={challenge.slug} />
                                 </Box>
-                                <ProjectsTable
-                                    baseURL={`/projects/${event.slug}/view/`}
-                                    projects={projects}
-                                />
+                                <ProjectsTable projects={projects} />
                             </Box>
-                        </ExpansionPanelDetails>
-                    </ExpansionPanel>
+                        </AccordionDetails>
+                    </Accordion>
                 )
             })}
         </Box>
diff --git a/frontend/src/pages/_dashboard/renderDashboard/organiser/projects/default/index.js b/frontend/src/pages/_dashboard/renderDashboard/organiser/projects/default/index.js
@@ -5,12 +5,6 @@ import ProjectsTable from 'components/tables/ProjectsTable'
 
 export default () => {
     const projects = useSelector(OrganiserSelectors.projects)
-    const event = useSelector(OrganiserSelectors.event)
 
-    return (
-        <ProjectsTable
-            baseURL={`/projects/${event.slug}/view/`}
-            projects={projects}
-        />
-    )
+    return <ProjectsTable projects={projects} />
 }
diff --git a/frontend/src/pages/_dashboard/renderDashboard/organiser/projects/index.js b/frontend/src/pages/_dashboard/renderDashboard/organiser/projects/index.js
@@ -1,6 +1,6 @@
-import React, { useMemo } from 'react'
+import React, { useEffect, useMemo } from 'react'
 
-import { useSelector } from 'react-redux'
+import { useDispatch, useSelector } from 'react-redux'
 import { useRouteMatch, useLocation } from 'react-router'
 import { OverallReviewingMethods } from '@hackjunction/shared'
 
@@ -17,12 +17,21 @@ import WinnersTab from './winners'
 import FinalistSelectionTab from './finalist-selection'
 import VotingTokensTab from './votingTokens'
 import * as OrganiserSelectors from 'redux/organiser/selectors'
+import * as OrganiserActions from 'redux/organiser/actions'
 
 export default () => {
+    const dispatch = useDispatch()
     const event = useSelector(OrganiserSelectors.event)
-    const projectsLoading = useSelector(OrganiserSelectors.projectsLoading)
     const match = useRouteMatch()
     const location = useLocation()
+    useEffect(() => {
+        if (event.slug) {
+            dispatch(OrganiserActions.updateTeamsForEvent(event.slug))
+            dispatch(OrganiserActions.updateProjects(event.slug))
+        }
+    }, [event, location])
+
+    const projectsLoading = useSelector(OrganiserSelectors.projectsLoading)
 
     const tabs = useMemo(() => {
         const data = [
diff --git a/frontend/src/pages/_dashboard/renderDashboard/organiser/router.js b/frontend/src/pages/_dashboard/renderDashboard/organiser/router.js
@@ -2,7 +2,7 @@ import React from 'react'
 import { useRouteMatch } from 'react-router'
 import { Route, Switch, Redirect } from 'react-router-dom'
 
-import DefaultPage from './default'
+// import DefaultPage from './default'
 import SlugPage from './index'
 
 export default () => {
diff --git a/frontend/src/styles/index.css b/frontend/src/styles/index.css
@@ -1,7 +1,6 @@
 @tailwind components;
 @tailwind utilities;
 /* CSS */
-@import url(https://cdn.jsdelivr.net/npm/firacode@6.2.0/distr/fira_code.css);
 
 /* Create below composite classes, after you finish, from the /frontend directory, you must run the command 'npm run build:tailwind' to build tailwind css to see the changes on the development enviroment
 
diff --git a/frontend/src/styles/tailwind.css b/frontend/src/styles/tailwind.css
