chore: Replace SVG image with lighter PNG version (#21044)

## Description

- Fixes memory consumption due to compression of SVG ( 513kb ) by
replacing with PNG (~64kb)
- Fixes CSS in integration tabs so that the active tab bottom bar width
is completely visible

## Type of change

chore

## How Has This Been Tested?

Manual

### Test Plan

### Issues raised during DP testing


## Checklist:
### Dev activity
- [ ] My code follows the style guidelines of this project
- [ ] I have performed a self-review of my own code
- [ ] I have commented my code, particularly in hard-to-understand areas
- [ ] I have made corresponding changes to the documentation
- [ ] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [ ] PR is being merged under a feature flag


### QA activity:
- [ ] Test plan has been approved by relevant developers
- [ ] Test plan has been peer reviewed by QA
- [ ] Cypress test cases have been added and approved by either SDET or
manual QA
- [ ] Organized project review call with relevant stakeholders after
Round 1/2 of QA
- [ ] Added Test Plan Approved label after reveiwing all Cypress test

app/client/src/pages/Editor/IntegrationEditor/AddDatasourceSecurely.tsx

@@ -1,19 +1,19 @@
 import React from "react";
 import styled from "styled-components";
 import Secure from "assets/images/secure.svg";
-import AppsmithDatasource from "assets/images/appsmith-datasource.svg";
+import AppsmithDatasource from "assets/images/appsmith-datasource.png";
 import { Colors } from "constants/Colors";
 
 const Wrapper = styled.div`
   border: 2px solid #d6d6d6;
-  padding: 23px;
+  padding: 16px 23px;
   flex-direction: row;
   display: flex;
   justify-content: space-between;
   align-items: center;
 
   .datasource-img {
-    height: 108px;
+    height: 128px;
   }
 `;
 

app/client/src/pages/Editor/IntegrationEditor/IntegrationsHomeScreen.tsx

@@ -68,6 +68,9 @@ const ApiHomePage = styled.div`
 const MainTabsContainer = styled.div`
   width: 100%;
   height: 100%;
+  .react-tabs__tab-list {
+    margin: 2px;
+  }
 `;
 
 const SectionGrid = styled.div<{ isActiveTab?: boolean }>`
@@ -154,19 +157,6 @@ const getSecondaryMenuIds = (hasActiveSources = false) => {
   };
 };
 
-// const TERTIARY_MENU: TabProp[] = [
-//   {
-//     key: "ACTIVE_CONNECTIONS",
-//     title: "Active Connections",
-//     panelComponent: <div />,
-//   },
-//   {
-//     key: "MOCK_DATABASE",
-//     title: "Mock Databases",
-//     panelComponent: <div />,
-//   },
-// ];
-
 const TERTIARY_MENU_IDS = {
   ACTIVE_CONNECTIONS: 0,
   MOCK_DATABASE: 1,