From eb5d689d3659ec8d7726a22d43536e9eefdbcdbf Mon Sep 17 00:00:00 2001
From: Mike Turley <mike.turley@alum.cs.umass.edu>
Date: Mon, 10 Jul 2023 15:34:35 -0400
Subject: [PATCH 1/2] :bug: Fix double tab pane in issue incidents detail modal
 from PF upgrade

Signed-off-by: Mike Turley <mike.turley@alum.cs.umass.edu>
---
 .../file-incidents-detail-modal.tsx           | 62 +++++++++----------
 1 file changed, 30 insertions(+), 32 deletions(-)

diff --git a/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx b/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx
index 257b49583..f4a9044fb 100644
--- a/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx
+++ b/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx
@@ -62,6 +62,8 @@ export const FileIncidentsDetailModal: React.FC<
   // TODO render incident facts?
   // TODO render documentation links? are those part of the markdown? where do we get them from the hub?
 
+  console.log({ activeTabIncidentId });
+
   return (
     <Modal
       title={fileReport.file}
@@ -85,14 +87,14 @@ export const FileIncidentsDetailModal: React.FC<
           })}
         />
       ) : (
-        <>
-          <Tabs
-            activeKey={activeTabIncidentId}
-            onSelect={(_event, tabKey) =>
-              setActiveTabIncidentId(tabKey as IncidentIdOrAll)
-            }
-          >
-            {firstFiveIncidents.map((incident, index) => (
+        <Tabs
+          activeKey={activeTabIncidentId}
+          onSelect={(_event, tabKey) =>
+            setActiveTabIncidentId(tabKey as IncidentIdOrAll)
+          }
+        >
+          {[
+            ...firstFiveIncidents.map((incident, index) => (
               <Tab
                 key={incident.id}
                 eventKey={incident.id}
@@ -121,30 +123,26 @@ export const FileIncidentsDetailModal: React.FC<
                   </Grid>
                 ) : null}
               </Tab>
-            ))}
-          </Tabs>
-          {totalNumIncidents > 5 ? (
-            <Tabs
-              activeKey="all"
-              onSelect={(_event, tabKey) =>
-                setActiveTabIncidentId(tabKey as IncidentIdOrAll)
-              }
-            >
-              <Tab
-                eventKey="all"
-                title={`All incidents (${totalNumIncidents})`} // TODO i18n
-              >
-                <Alert
-                  isInline
-                  variant="info"
-                  className={spacing.mtMd}
-                  title="TODO"
-                />
-                <FileAllIncidentsTable fileReport={fileReport} />
-              </Tab>
-            </Tabs>
-          ) : null}
-        </>
+            )),
+            ...(totalNumIncidents > 5
+              ? [
+                  <Tab
+                    key="all"
+                    eventKey="all"
+                    title={`All incidents (${totalNumIncidents})`} // TODO i18n
+                  >
+                    <Alert
+                      isInline
+                      variant="info"
+                      className={spacing.mtMd}
+                      title="TODO"
+                    />
+                    <FileAllIncidentsTable fileReport={fileReport} />
+                  </Tab>,
+                ]
+              : []),
+          ]}
+        </Tabs>
       )}
     </Modal>
   );

From 4856453f74c260103a1780c9a8edc5e1d6ceb4a2 Mon Sep 17 00:00:00 2001
From: Mike Turley <mike.turley@alum.cs.umass.edu>
Date: Tue, 11 Jul 2023 13:56:11 -0400
Subject: [PATCH 2/2] Simplify array expression with flat operation

Signed-off-by: Mike Turley <mike.turley@alum.cs.umass.edu>
---
 .../file-incidents-detail-modal.tsx           | 38 +++++++++----------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx b/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx
index f4a9044fb..377665e56 100644
--- a/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx
+++ b/client/src/app/pages/issues/issue-detail-drawer/file-incidents-detail-modal/file-incidents-detail-modal.tsx
@@ -94,7 +94,7 @@ export const FileIncidentsDetailModal: React.FC<
           }
         >
           {[
-            ...firstFiveIncidents.map((incident, index) => (
+            firstFiveIncidents.map((incident, index) => (
               <Tab
                 key={incident.id}
                 eventKey={incident.id}
@@ -124,24 +124,24 @@ export const FileIncidentsDetailModal: React.FC<
                 ) : null}
               </Tab>
             )),
-            ...(totalNumIncidents > 5
-              ? [
-                  <Tab
-                    key="all"
-                    eventKey="all"
-                    title={`All incidents (${totalNumIncidents})`} // TODO i18n
-                  >
-                    <Alert
-                      isInline
-                      variant="info"
-                      className={spacing.mtMd}
-                      title="TODO"
-                    />
-                    <FileAllIncidentsTable fileReport={fileReport} />
-                  </Tab>,
-                ]
-              : []),
-          ]}
+            totalNumIncidents > 5 && [
+              <Tab
+                key="all"
+                eventKey="all"
+                title={`All incidents (${totalNumIncidents})`} // TODO i18n
+              >
+                <Alert
+                  isInline
+                  variant="info"
+                  className={spacing.mtMd}
+                  title="TODO"
+                />
+                <FileAllIncidentsTable fileReport={fileReport} />
+              </Tab>,
+            ],
+          ]
+            .flat(1)
+            .filter(Boolean)}
         </Tabs>
       )}
     </Modal>