Cleanup React Key error on Source and Destination Settings Pages (#23005

) * React was spitting out an error about a lack of keys * Cleaning react key error on destination settings page --------- Co-authored-by: Davin Chia <[email protected]>
airbytehq · Feb 15, 2023 · 420fdf5 · 420fdf5
1 parent d351970
commit 420fdf5
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 4 deletions.
diff --git a/airbyte-webapp/src/pages/SourcesPage/pages/SourceItemPage/components/SourceSettings.tsx b/airbyte-webapp/src/pages/SourcesPage/pages/SourceItemPage/components/SourceSettings.tsx
@@ -62,9 +62,9 @@ const SourceSettings: React.FC<SourceSettingsProps> = ({ currentSource, connecti
       <p>
         <FormattedMessage id="tables.affectedConnectionsOnDeletion" values={{ count: connectionsWithSource.length }} />
         {connectionsWithSource.map((connection) => (
-          <>
+          <React.Fragment key={connection.connectionId}>
             - <strong>{`${connection.name}\n`}</strong>
-          </>
+          </React.Fragment>
         ))}
       </p>
     );

diff --git a/airbyte-webapp/src/pages/destination/DestinationSettingsPage/DestinationSettingsPage.tsx b/airbyte-webapp/src/pages/destination/DestinationSettingsPage/DestinationSettingsPage.tsx
@@ -58,9 +58,9 @@ export const DestinationSettingsPage: React.FC = () => {
           values={{ count: connectionsWithDestination.length }}
         />
         {connectionsWithDestination.map((connection) => (
-          <>
+          <React.Fragment key={connection.connectionId}>
             - <strong>{`${connection.name}\n`}</strong>
-          </>
+          </React.Fragment>
         ))}
       </p>
     );