Merge pull request #2587 from objectcomputing/feature-2226/display-re…

…view-period-status Added ReviewPeriodStepper to be displayed with each ReviewPeriodCard
objectcomputing · Sep 17, 2024 · efa56f2 · efa56f2
2 parents b346ccf + 28b0625
commit efa56f2
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 8 deletions.
diff --git a/server/src/main/resources/db/dev/R__Load_testing_data.sql b/server/src/main/resources/db/dev/R__Load_testing_data.sql
@@ -1715,3 +1715,15 @@ INSERT INTO role_documentation
 (role_id, document_id, display_order)
 VALUES
     ('d03f5f0b-e29c-4cf4-9ea4-6baa09405c56', 'b553d4c0-9b7a-4691-8fe0-e3bdda4f67ae', 3);
+
+-- CAE - Review Periods
+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', 'CLOSED', 'd1e94b60-47c4-4945-87d1-4dc88f088e57', '926a37a4-4ded-4633-8900-715b0383aecc', '2024-09-01', '2024-09-02', '2024-09-03', '2024-01-01', '2024-12-31');
+
+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', '2024-09-11', '2024-09-12', '2024-01-01', '2024-12-31');
+
diff --git a/web-ui/src/components/reviews/periods/ReviewPeriods.jsx b/web-ui/src/components/reviews/periods/ReviewPeriods.jsx
@@ -37,6 +37,7 @@ import {
 } from '../../../context/selectors';
 
 import ReviewPeriodCard from './ReviewPeriodCard.jsx';
+import ReviewPeriodStepper from './ReviewPeriodStepper.jsx';
 
 const propTypes = {
   message: PropTypes.string,
@@ -377,14 +378,19 @@ const ReviewPeriods = ({ onPeriodSelected, mode }) => {
                   ? -1
                   : 1;
             })
-            .map(({ name, reviewStatus, id }, i) => (
-              <ReviewPeriodCard
-                key={`review-period-card-${id}`}
-                mode={mode}
-                onSelect={onPeriodClick}
-                periodId={id}
-                selfReviews={selfReviews}
-              />
+            .map((period) => (
+              <div>
+                <ReviewPeriodStepper
+                  reviewPeriod={period}
+                />
+                <ReviewPeriodCard
+                  key={`review-period-card-${period.id}`}
+                  mode={mode}
+                  onSelect={onPeriodClick}
+                  periodId={period.id}
+                  selfReviews={selfReviews}
+                />
+              </div>
             ))
         ) : (
           <Typography variant="body1">