Made it dynamic

hack4impact-upenn · May 21, 2023 · 72d6e45 · 72d6e45
1 parent ab83f24
commit 72d6e45
Show file tree

Hide file tree

Showing 3 changed files with 13 additions and 11 deletions.
diff --git a/client/src/AdminDashboard/AdminCityDashboardPage.tsx b/client/src/AdminDashboard/AdminCityDashboardPage.tsx
@@ -26,9 +26,6 @@ function CityDashboardPage() {
   useEffect(() => {
     if (cityData?.data) {
       const newRows = cityData?.data.map((city: ICity) => {
-        if (city.isAccredited === true) {
-          return `${city.cityName} (Accredited)`;
-        }
         return city.cityName;
       });
       setCityList(cityData?.data);
@@ -59,16 +56,20 @@ function CityDashboardPage() {
                 </TableRow>
               </TableHead>
               <TableBody>
-                {rows.map((row) => (
+                {cityList.map((city) => (
                   <TableRow
-                    key={row}
+                    key={city.cityName}
                     sx={{ '&:last-child td, &:last-child th': { border: 0 } }}
                   >
                     <TableCell component="th" scope="row">
-                      {row.split(' city')[0]}
+                      {city.cityName +
+                        (city.isAccredited ? ' (Accredited)' : '')}
                     </TableCell>
                     <TableCell align="right">
-                      <Button variant="text" onClick={() => handleEdit(row)}>
+                      <Button
+                        variant="text"
+                        onClick={() => handleEdit(city.cityName)}
+                      >
                         <img
                           src={Edit}
                           alt="edit button"

diff --git a/client/src/AdminDashboard/CityDataGrid.tsx b/client/src/AdminDashboard/CityDataGrid.tsx
@@ -23,13 +23,14 @@ import useAlert from '../util/hooks/useAlert';
 import AlertType from '../util/types/alert';
 
 function CityDataGrid() {
+  const { cityName } = useParams();
   const [rows, setRows] = React.useState<any[]>([]); // Keep the rows in a state
   const [isAccredited, setIsAccredited] = React.useState<boolean>(false);
   const [originalIsAccredited, setOriginalIsAccredited] =
     React.useState<boolean>(false);
   const [originalRows, setOriginalRows] = React.useState<any[]>([]);
   const [selectedRows, setSelectedRows] = React.useState<any[]>([]);
-  const cityData = useData(`cities/Philadelphia%20city,%20Pennsylvania`);
+  const cityData = useData(`cities/${cityName}`);
 
   React.useEffect(() => {
     if (cityData) {
@@ -52,7 +53,7 @@ function CityDataGrid() {
     updatedCity.isAccredited = isAccredited;
     console.log('passing data should be new: ', updatedCity);
     console.log('Updating City');
-    await putData(`cities/Philadelphia%20city,%20Pennsylvania`, {
+    await putData(`cities/${cityName}`, {
       city: updatedCity,
     }).then((res) => {
       if (res.error) {
@@ -111,7 +112,7 @@ function CityDataGrid() {
       <Toolbar />
 
       <Box flexDirection="row" display="flex" width="100%" pb={2}>
-        <Typography variant="h3">Philadelphia City, Pennsylvania</Typography>
+        <Typography variant="h3">{cityData?.data.cityName}</Typography>
         <Button
           component="button"
           onClick={() => updateCityData(cityData?.data as unknown as ICity)}

diff --git a/client/src/App.tsx b/client/src/App.tsx
@@ -77,7 +77,7 @@ function App() {
                     />
                     <Route
                       path="/admin-stats/:cityName"
-                      element={<AdminStatsPage />}
+                      element={<CityDataGrid />}
                     />
                   </Route>
                   {/* Route which redirects to a different page depending on if the user is an authenticated or not by utilizing the DynamicRedirect component */}