Merge branch 'develop' into feature-2708/mark-guilds-inactive

Author: mkimberlin

server/src/main/resources/db/dev/R__Load_testing_data.sql

@@ -1291,12 +1291,12 @@ VALUES
 INSERT INTO review_periods
 (id, name, review_status, review_template_id, self_review_template_id, launch_date, self_review_close_date, close_date, period_start_date, period_end_date)
 VALUES
-    ('12345678-e29c-4cf4-9ea4-6baa09405c57', 'Review Period 1', 'PLANNING', 'd1e94b60-47c4-4945-87d1-4dc88f088e57', '926a37a4-4ded-4633-8900-715b0383aecc', '2024-09-01 06:00:00', '2024-09-02 06:00:00', '2024-09-03 06:00:00', '2024-01-01 06:00:00', '2024-08-31 06:00:00');
+    ('12345678-e29c-4cf4-9ea4-6baa09405c57', 'Review Period 1', 'PLANNING', 'd1e94b60-47c4-4945-87d1-4dc88f088e57', '926a37a4-4ded-4633-8900-715b0383aecc', CURRENT_DATE + TIME '06:00:00', CURRENT_DATE + INTERVAL '1' DAY + TIME '06:00:00', CURRENT_DATE + INTERVAL '2' DAY + TIME '06:00:00', date_trunc('year', CURRENT_DATE) + TIME '06:00:00', CURRENT_DATE + INTERVAL '-1' DAY + TIME '06:00:00');
 
 INSERT INTO review_periods
 (id, name, review_status, review_template_id, self_review_template_id, launch_date, self_review_close_date, close_date, period_start_date, period_end_date)
 VALUES
-    ('12345678-e29c-4cf4-9ea4-6baa09405c58', 'Review Period 2', 'PLANNING', 'd1e94b60-47c4-4945-87d1-4dc88f088e57', '926a37a4-4ded-4633-8900-715b0383aecc', '2024-09-10 06:00:00', '2024-09-11 06:00:00', '2024-09-12 06:00:00', '2024-01-01 06:00:00', '2024-08-31 06:00:00');
+    ('12345678-e29c-4cf4-9ea4-6baa09405c58', 'Review Period 2', 'PLANNING', 'd1e94b60-47c4-4945-87d1-4dc88f088e57', '926a37a4-4ded-4633-8900-715b0383aecc', CURRENT_DATE + TIME '06:00:00', CURRENT_DATE + INTERVAL '1' DAY + TIME '06:00:00', CURRENT_DATE + INTERVAL '2' DAY + TIME '06:00:00', date_trunc('year', CURRENT_DATE) + TIME '06:00:00', CURRENT_DATE + INTERVAL '-1' DAY + TIME '06:00:00');
 
 INSERT INTO review_periods
 (id, name, review_status, review_template_id, self_review_template_id, launch_date, self_review_close_date, close_date, period_start_date, period_end_date)

web-ui/src/components/feedback_submit_form/FeedbackSubmitForm.jsx

@@ -78,6 +78,7 @@ const FeedbackSubmitForm = ({
   const { state, dispatch } = useContext(AppContext);
   const csrf = selectCsrfToken(state);
   const [isLoading, setIsLoading] = useState(false);
+  const [isSubmitting, setIsSubmitting] = useState(false);
   const [isReviewing, setIsReviewing] = useState(reviewOnly);
   const history = useHistory();
   const [questionAnswerPairs, setQuestionAnswerPairs] = useState([]);
@@ -117,6 +118,7 @@ const FeedbackSubmitForm = ({
   }
 
   const onSubmitHandler = () => {
+    setIsSubmitting(true);
     updateAllAnswersSubmit()
       .then(res => {
         for (let i = 0; i < res.length; ++i) {
@@ -135,9 +137,11 @@ const FeedbackSubmitForm = ({
       })
       .then(resTwo => {
         if (resTwo === false) {
+          setIsSubmitting(false);
           return;
         }
         updateRequestSubmit().then(res => {
+          setIsSubmitting(false);
           if (res && res.payload && res.payload.data && !res.error) {
             history.push(`/feedback/submit/confirmation/?request=${requestId}`);
           } else {
@@ -225,7 +229,7 @@ const FeedbackSubmitForm = ({
             <React.Fragment>
               <Button
                 className={classes.coloredButton}
-                disabled={isLoading}
+                disabled={isLoading || isSubmitting}
                 onClick={() => setIsReviewing(false)}
                 variant="contained"
                 color="secondary"
@@ -234,7 +238,7 @@ const FeedbackSubmitForm = ({
               </Button>
               <Button
                 className={classes.button}
-                disabled={isLoading}
+                disabled={isLoading || isSubmitting}
                 onClick={onSubmitHandler}
                 variant="contained"
                 color="primary"

web-ui/src/components/reviews/periods/ReviewPeriods.jsx

@@ -389,11 +389,14 @@ const ReviewPeriods = ({ onPeriodSelected, mode }) => {
         ) : periods.length > 0 ? (
           periods
             .sort((a, b) => {
+              const aName = (a.name || '');
               return a.reviewStatus === b.reviewStatus
-                ? (a.name || '').localeCompare(b.name)
+                ? aName.localeCompare(b.name)
                 : a.reviewStatus === ReviewStatus.OPEN
                   ? -1
-                  : 1;
+                  : (b.reviewStatus === ReviewStatus.OPEN
+                    ? 1
+                    : aName.localeCompare(b.name));
             })
             .map((period) => (
               <div>

web-ui/src/context/AppContext.jsx

@@ -34,6 +34,17 @@ import {getCertifications} from "../api/certification.js";
 
 const AppContext = React.createContext();
 
+function getSessionCookieValue(name) {
+  const cookies = document?.cookie?.split(';');
+  for (let i = 0; i < cookies.length; i++) {
+    const cookie = cookies[i].trim();
+    if (cookie.startsWith(name + '=')) {
+      return decodeURIComponent(cookie.substring(name.length + 1));
+    }
+  }
+  return null;
+}
+
 const AppContextProvider = props => {
   const [state, dispatch] = useReducer(
     reducer,
@@ -64,12 +75,17 @@ const AppContextProvider = props => {
   useEffect(() => {
     const getCsrf = async () => {
       if (!csrf) {
-        const res = await fetch(url, {
-          responseType: 'text',
-          credentials: 'include'
-        });
-        if (res && res.ok) {
-          dispatch({ type: SET_CSRF, payload: await res.text() });
+        const payload = getSessionCookieValue('_csrf');
+        if (payload) {
+          dispatch({ type: SET_CSRF, payload });
+        } else {
+          const res = await fetch(url, {
+            responseType: 'text',
+            credentials: 'include'
+          });
+          if (res && res.ok) {
+            dispatch({ type: SET_CSRF, payload: await res.text() });
+          }
         }
       }
     };

web-ui/src/pages/AnniversaryReportPage.test.jsx

@@ -14,26 +14,28 @@ const userStateWithPermission = {
 
 it('renders correctly', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider value={userStateWithPermission}>
       <AnniversaryReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });
 
 it('renders an error if user does not have appropriate permission', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider>
       <AnniversaryReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });

web-ui/src/pages/BirthdayReportPage.test.jsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { vi } from 'vitest';
 import BirthdayReportPage from './BirthdayReportPage';
 import { AppContextProvider } from '../context/AppContext';
 
@@ -14,26 +15,28 @@ const userStateWithPermission = {
 
 it('renders correctly', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider value={userStateWithPermission}>
       <BirthdayReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });
 
 it('renders an error if user does not have appropriate permission', () => {
   const mockDate = new Date(2022, 1, 1);
-  const spy = vi.spyOn(global, 'Date').mockImplementation(() => mockDate);
+  vi.useFakeTimers();
+  vi.setSystemTime(mockDate);
 
   snapshot(
     <AppContextProvider>
       <BirthdayReportPage />
     </AppContextProvider>
   );
 
-  spy.mockRestore();
+  vi.useRealTimers();
 });

web-ui/src/pages/HomePage.jsx

@@ -9,7 +9,7 @@ import MyBirthday from '../components/celebrations/MyBirthday';
 import { AppContext } from '../context/AppContext';
 import { selectCsrfToken, selectCurrentUser } from '../context/selectors';
 import { sortAnniversaries, sortBirthdays } from '../context/util';
-import { Button } from '@mui/material';
+import { Button, Grid } from '@mui/material';
 
 import './HomePage.css';
 
@@ -76,6 +76,13 @@ export default function HomePage() {
     return document.cookie.indexOf("OJWT=") != -1;
   }
 
+  // This width matches the birthdays-card and anniversaries-card style.
+  // However, we do not want to set this width on the PublicKudos css as it is
+  // used elsewhere and does not need to have it's width restricted.  This only
+  // applies if if we have birthdays or anniversaries to display on this page.
+  const kudosStyle = birthdays.length == 0 &&
+                     anniversaries.length == 0 ? {} : { width: '450px' };
+
   return (
     <div className="home-page">
       <div className="celebrations">
@@ -87,11 +94,19 @@ export default function HomePage() {
             myAnniversary={myAnniversaryData}
           />
         ) : (
-          <>
-            { anniversaries.length > 0  && (<Anniversaries anniversaries={anniversaries} />) }
-            { birthdays.length > 0 && (<Birthdays birthdays={birthdays} />) }
-            <PublicKudos />
-          </>
+          <Grid container spacing={2} style={{ padding: '0 20px 0 20px' }}>
+            { anniversaries.length > 0  && (
+              <Grid item>
+                <Anniversaries anniversaries={anniversaries} />
+              </Grid>) }
+            { birthdays.length > 0 && (
+              <Grid item>
+                <Birthdays birthdays={birthdays} />
+              </Grid>) }
+            <Grid item style={kudosStyle}>
+              <PublicKudos />
+            </Grid>
+          </Grid>
         )}
       </div>
       {checkForImpersonation() &&

web-ui/src/pages/__snapshots__/HomePage.test.jsx.snap

@@ -9,49 +9,58 @@ exports[`renders correctly 1`] = `
       class="celebrations"
     >
       <div
-        class="public-kudos"
+        class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-2 css-mhc70k-MuiGrid-root"
+        style="padding: 0px 20px 0px 20px;"
       >
         <div
-          class="kudos-title"
+          class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
         >
-          <h1>
-            Kudos
-          </h1>
-          <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 kudos-dialog-open css-1e6y48t-MuiButtonBase-root-MuiButton-root"
-            tabindex="0"
-            type="button"
+          <div
+            class="public-kudos"
           >
-            <span
-              class="MuiButton-icon MuiButton-startIcon MuiButton-iconSizeMedium css-1d6wzja-MuiButton-startIcon"
+            <div
+              class="kudos-title"
             >
-              <svg
-                aria-hidden="true"
-                class="MuiSvgIcon-root MuiSvgIcon-fontSizeMedium css-i4bv87-MuiSvgIcon-root"
-                data-testid="StarIcon"
-                focusable="false"
-                viewBox="0 0 24 24"
+              <h1>
+                Kudos
+              </h1>
+              <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 kudos-dialog-open css-1e6y48t-MuiButtonBase-root-MuiButton-root"
+                tabindex="0"
+                type="button"
               >
-                <path
-                  d="M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"
+                <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="StarIcon"
+                    focusable="false"
+                    viewBox="0 0 24 24"
+                  >
+                    <path
+                      d="M12 17.27 18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z"
+                    />
+                  </svg>
+                </span>
+                Give Kudos
+                <span
+                  class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
                 />
-              </svg>
-            </span>
-            Give Kudos
-            <span
-              class="MuiTouchRipple-root css-8je8zh-MuiTouchRipple-root"
-            />
-          </button>
-        </div>
-        <div
-          class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-3 css-zow5z4-MuiGrid-root"
-        >
-          <div
-            class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
-          >
+              </button>
+            </div>
             <div
-              class="kudos-list"
-            />
+              class="MuiGrid-root MuiGrid-container MuiGrid-spacing-xs-3 css-zow5z4-MuiGrid-root"
+            >
+              <div
+                class="MuiGrid-root MuiGrid-item css-13i4rnv-MuiGrid-root"
+              >
+                <div
+                  class="kudos-list"
+                />
+              </div>
+            </div>
           </div>
         </div>
       </div>