Merge pull request #2742 from objectcomputing/develop

mkimberlin · web-flow · commit c3f4c731dc68 · 2024-11-07T10:13:54.000-06:00
Update 0.8.x from develop
diff --git a/web-ui/package.json b/web-ui/package.json
@@ -89,7 +89,7 @@
     "eslint-plugin-react-hooks": "^4.6.0",
     "eslint-plugin-vitest": "^0.5.4",
     "globals": "^15.0.0",
-    "happy-dom": "^15.10.1",
+    "happy-dom": "^15.10.2",
     "jest-fetch-mock": "^3.0.3",
     "jsdom": "^24.0.0",
     "msw": "^2.2.13",
diff --git a/web-ui/src/components/guild-results/EditGuildModal.jsx b/web-ui/src/components/guild-results/EditGuildModal.jsx
@@ -11,7 +11,8 @@ import {
   FormControlLabel,
   Modal,
   Switch,
-  TextField
+  TextField,
+  Checkbox,
 } from '@mui/material';
 import Autocomplete from '@mui/material/Autocomplete';
 import './EditGuildModal.css';
@@ -166,18 +167,19 @@ const EditGuildModal = ({ guild = {}, open, onSave, onClose, headerText }) => {
             value={editedGuild.name ? editedGuild.name : ''}
             onChange={e => setGuild({ ...editedGuild, name: e.target.value })}
           />
-          {guild.id && <FormControlLabel
-            control={
-              <Switch
-                checked={editedGuild.active}
-                onChange={event => {
-                  const { checked } = event.target;
-                  setGuild({ ...editedGuild, active: checked });
-                }}
-              />
-            }
+          {guild.id && (<>
+          <Checkbox
+            id="guild-active-input"
             label="Active"
-          />}
+            variant="outlined"
+            className="halfWidth"
+            checked={editedGuild.active ? editedGuild.active : false}
+            onChange={event => {
+              const { checked } = event.target;
+              setGuild({ ...editedGuild, active: checked });
+            }}
+          /> Active
+          </>)}
         </div>
         <div>
           <FormControlLabel
diff --git a/web-ui/src/components/team-results/TeamResults.jsx b/web-ui/src/components/team-results/TeamResults.jsx
@@ -8,7 +8,7 @@ import {
 } from '../../context/selectors';
 import TeamsActions from './TeamsActions';
 import PropTypes from 'prop-types';
-import { TextField } from '@mui/material';
+import { FormControlLabel, Switch, TextField } from '@mui/material';
 import './TeamResults.css';
 import SkeletonLoader from '../skeleton_loader/SkeletonLoader';
 import { useQueryParameters } from '../../helpers/query-parameters';
@@ -40,22 +40,11 @@ const TeamResults = () => {
   const { state } = useContext(AppContext);
   const loading = selectTeamsLoading(state);
   const [addingTeam, setAddingTeam] = useState(false);
+  const [activeTeams, setActiveTeams] = useState(true);
   const [searchText, setSearchText] = useState('');
   const [selectedTeamId, setSelectedTeamId] = useState('');
   const teams = selectNormalizedTeams(state, searchText);
 
-  const teamCards = teams.map((team, index) => {
-    return (
-      <TeamSummaryCard
-        key={`team-summary-${team.id}`}
-        index={index}
-        team={team}
-        onTeamSelect={setSelectedTeamId}
-        selectedTeamId={selectedTeamId}
-      />
-    );
-  });
-
   useQueryParameters([
     {
       name: 'addNew',
@@ -89,16 +78,41 @@ const TeamResults = () => {
             setSearchText(e.target.value);
           }}
         />
-        <TeamsActions isOpen={addingTeam} onOpen={setAddingTeam} />
+        <div className="team-actions">
+          <TeamsActions isOpen={addingTeam} onOpen={setAddingTeam} />
+          <FormControlLabel
+            control={
+              <Switch
+                checked={activeTeams}
+                onChange={event => {
+                  const { checked } = event.target;
+                  setActiveTeams(checked);
+                }}
+             />
+            }
+            label="Active Teams Only"
+          />
+        </div>
       </div>
       <div className="teams">
         {loading
           ? Array.from({ length: 20 }).map((_, index) => (
               <SkeletonLoader key={index} type="team" />
             ))
-          : teams?.length && !loading
-            ? teamCards
-            : null}
+          : teams.filter((team) => !activeTeams ||
+                                   (activeTeams && team.active))
+                 .map((team, index) => {
+              return (
+                <TeamSummaryCard
+                  key={`team-summary-${team.id}`}
+                  index={index}
+                  team={team}
+                  onTeamSelect={setSelectedTeamId}
+                  selectedTeamId={selectedTeamId}
+                />
+              );
+            })
+        }
       </div>
     </Root>
   );
diff --git a/web-ui/src/components/team-results/TeamSummaryCard.jsx b/web-ui/src/components/team-results/TeamSummaryCard.jsx
@@ -19,7 +19,7 @@ import {
   Tooltip
 } from '@mui/material';
 import PropTypes from 'prop-types';
-import { deleteTeam, updateTeam } from '../../api/team.js';
+import { updateTeam } from '../../api/team.js';
 import SplitButton from '../split-button/SplitButton';
 
 const PREFIX = 'TeamSummaryCard';
@@ -59,7 +59,6 @@ const displayName = 'TeamSummaryCard';
 const TeamSummaryCard = ({ team, index, onTeamSelect, selectedTeamId }) => {
   const { state, dispatch } = useContext(AppContext);
   const { teams, userProfile, csrf } = state;
-  const [openDelete, setOpenDelete] = useState(false);
   const [openKudos, setOpenKudos] = useState(false);
   // const [selectedTeam, setSelectedTeam] = useState(null);
   const [tooltipIsOpen, setTooltipIsOpen] = useState(false);
@@ -81,45 +80,16 @@ const TeamSummaryCard = ({ team, index, onTeamSelect, selectedTeamId }) => {
       ? false
       : leads.some(lead => lead.memberId === userProfile.memberProfile.id);
 
-  const handleOpenDeleteConfirmation = () => setOpenDelete(true);
   const handleOpenKudos = () => setOpenKudos(true);
-
-  const handleCloseDeleteConfirmation = () => setOpenDelete(false);
   const handleCloseKudos = () => setOpenKudos(false);
 
-  const teamId = team?.id;
-  const deleteATeam = useCallback(async () => {
-    if (teamId && csrf) {
-      const result = await deleteTeam(teamId, csrf);
-      if (result && result.payload && result.payload.status === 200) {
-        window.snackDispatch({
-          type: UPDATE_TOAST,
-          payload: {
-            severity: 'success',
-            toast: 'Team deleted'
-          }
-        });
-        let newTeams = teams.filter(team => {
-          return team.id !== teamId;
-        });
-        dispatch({
-          type: UPDATE_TEAMS,
-          payload: newTeams
-        });
-      }
-    }
-  }, [teamId, csrf, dispatch, teams]);
-
-  const options =
-    isAdmin || isTeamLead ? ['Edit Team', 'Give Kudos', 'Delete Team'] : ['Edit Team', 'Give Kudos'];
+  const options = ['Edit Team', 'Give Kudos'];
 
   const handleAction = (e, index) => {
     if (index === 0) {
       onTeamSelect(team.id);
     } else if (index === 1) {
       handleOpenKudos();
-    } else if (index === 2) {
-      handleOpenDeleteConfirmation();
     }
   };
 
@@ -195,27 +165,6 @@ const TeamSummaryCard = ({ team, index, onTeamSelect, selectedTeamId }) => {
         {(isAdmin || isTeamLead) && (
           <>
             <SplitButton options={options} onClick={handleAction} />
-            <Dialog
-              open={openDelete}
-              onClose={handleCloseDeleteConfirmation}
-              aria-labelledby="alert-dialog-title"
-              aria-describedby="alert-dialog-description"
-            >
-              <DialogTitle id="alert-dialog-title">Delete team?</DialogTitle>
-              <DialogContent>
-                <DialogContentText id="alert-dialog-description">
-                  Are you sure you want to delete the team?
-                </DialogContentText>
-              </DialogContent>
-              <DialogActions>
-                <Button onClick={handleCloseDeleteConfirmation} color="primary">
-                  Cancel
-                </Button>
-                <Button onClick={deleteATeam} color="primary" autoFocus>
-                  Yes
-                </Button>
-              </DialogActions>
-            </Dialog>
             <KudosDialog
               open={openKudos}
               onClose={handleCloseKudos}
diff --git a/web-ui/src/components/team-results/__snapshots__/TeamResults.test.jsx.snap b/web-ui/src/components/team-results/__snapshots__/TeamResults.test.jsx.snap
@@ -47,31 +47,66 @@ exports[`renders correctly 1`] = `
       <div
         class="team-actions"
       >
-        <button
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary css-1e6y48t-MuiButtonBase-root-MuiButton-root"
-          tabindex="0"
-          type="button"
+        <div
+          class="team-actions"
+        >
+          <button
+            class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary css-1e6y48t-MuiButtonBase-root-MuiButton-root"
+            tabindex="0"
+            type="button"
+          >
+            <span
+              class="MuiButton-icon MuiButton-startIcon MuiButton-iconSizeMedium css-1d6wzja-MuiButton-startIcon"
+            >
+              <svg
+                aria-hidden="true"
+                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                data-testid="GroupIcon"
+                focusable="false"
+                viewBox="0 0 24 24"
+              >
+                <path
+                  d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3m-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3m0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5m8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5"
+                />
+              </svg>
+            </span>
+            Add Team
+            <span
+              class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+            />
+          </button>
+        </div>
+        <label
+          class="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd css-j204z7-MuiFormControlLabel-root"
         >
           <span
-            class="MuiButton-icon MuiButton-startIcon MuiButton-iconSizeMedium css-1d6wzja-MuiButton-startIcon"
+            class="MuiSwitch-root MuiSwitch-sizeMedium css-julti5-MuiSwitch-root"
           >
-            <svg
-              aria-hidden="true"
-              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-              data-testid="GroupIcon"
-              focusable="false"
-              viewBox="0 0 24 24"
+            <span
+              class="MuiButtonBase-root MuiSwitch-switchBase MuiSwitch-colorPrimary Mui-checked PrivateSwitchBase-root MuiSwitch-switchBase MuiSwitch-colorPrimary Mui-checked Mui-checked css-byenzh-MuiButtonBase-root-MuiSwitch-switchBase"
             >
-              <path
-                d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3m-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3m0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5m8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5"
+              <input
+                checked=""
+                class="PrivateSwitchBase-input MuiSwitch-input css-1m9pwf3"
+                type="checkbox"
               />
-            </svg>
+              <span
+                class="MuiSwitch-thumb css-jsexje-MuiSwitch-thumb"
+              />
+              <span
+                class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+              />
+            </span>
+            <span
+              class="MuiSwitch-track css-1yjjitx-MuiSwitch-track"
+            />
           </span>
-          Add Team
           <span
-            class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-          />
-        </button>
+            class="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label css-ahj2mt-MuiTypography-root"
+          >
+            Active Teams Only
+          </span>
+        </label>
       </div>
     </div>
     <div
@@ -128,31 +163,66 @@ exports[`renders correctly when no teams are loaded 1`] = `
       <div
         class="team-actions"
       >
-        <button
-          class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary css-1e6y48t-MuiButtonBase-root-MuiButton-root"
-          tabindex="0"
-          type="button"
+        <div
+          class="team-actions"
+        >
+          <button
+            class="MuiButtonBase-root MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary MuiButton-root MuiButton-text MuiButton-textPrimary MuiButton-sizeMedium MuiButton-textSizeMedium MuiButton-colorPrimary css-1e6y48t-MuiButtonBase-root-MuiButton-root"
+            tabindex="0"
+            type="button"
+          >
+            <span
+              class="MuiButton-icon MuiButton-startIcon MuiButton-iconSizeMedium css-1d6wzja-MuiButton-startIcon"
+            >
+              <svg
+                aria-hidden="true"
+                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
+                data-testid="GroupIcon"
+                focusable="false"
+                viewBox="0 0 24 24"
+              >
+                <path
+                  d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3m-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3m0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5m8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5"
+                />
+              </svg>
+            </span>
+            Add Team
+            <span
+              class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+            />
+          </button>
+        </div>
+        <label
+          class="MuiFormControlLabel-root MuiFormControlLabel-labelPlacementEnd css-j204z7-MuiFormControlLabel-root"
         >
           <span
-            class="MuiButton-icon MuiButton-startIcon MuiButton-iconSizeMedium css-1d6wzja-MuiButton-startIcon"
+            class="MuiSwitch-root MuiSwitch-sizeMedium css-julti5-MuiSwitch-root"
           >
-            <svg
-              aria-hidden="true"
-              class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-              data-testid="GroupIcon"
-              focusable="false"
-              viewBox="0 0 24 24"
+            <span
+              class="MuiButtonBase-root MuiSwitch-switchBase MuiSwitch-colorPrimary Mui-checked PrivateSwitchBase-root MuiSwitch-switchBase MuiSwitch-colorPrimary Mui-checked Mui-checked css-byenzh-MuiButtonBase-root-MuiSwitch-switchBase"
             >
-              <path
-                d="M16 11c1.66 0 2.99-1.34 2.99-3S17.66 5 16 5c-1.66 0-3 1.34-3 3s1.34 3 3 3m-8 0c1.66 0 2.99-1.34 2.99-3S9.66 5 8 5C6.34 5 5 6.34 5 8s1.34 3 3 3m0 2c-2.33 0-7 1.17-7 3.5V19h14v-2.5c0-2.33-4.67-3.5-7-3.5m8 0c-.29 0-.62.02-.97.05 1.16.84 1.97 1.97 1.97 3.45V19h6v-2.5c0-2.33-4.67-3.5-7-3.5"
+              <input
+                checked=""
+                class="PrivateSwitchBase-input MuiSwitch-input css-1m9pwf3"
+                type="checkbox"
               />
-            </svg>
+              <span
+                class="MuiSwitch-thumb css-jsexje-MuiSwitch-thumb"
+              />
+              <span
+                class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
+              />
+            </span>
+            <span
+              class="MuiSwitch-track css-1yjjitx-MuiSwitch-track"
+            />
           </span>
-          Add Team
           <span
-            class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-          />
-        </button>
+            class="MuiTypography-root MuiTypography-body1 MuiFormControlLabel-label css-ahj2mt-MuiTypography-root"
+          >
+            Active Teams Only
+          </span>
+        </label>
       </div>
     </div>
     <div
diff --git a/web-ui/yarn.lock b/web-ui/yarn.lock
