chore: use overflow: auto instead of scroll in widget explorer (#33342)

![image](https://github.com/appsmithorg/appsmith/assets/6636360/38ddf522-3ebe-4345-99a4-39608961091e)
This PR adds overflow: auto instead of overflow: scroll. because of
overflow:scroll, there is a reserve space at bottom for scrollbar even
when it is not required.

/ok-to-test tags="@tag.IDE"

<!-- This is an auto-generated comment: Cypress test results  -->
> [!TIP]
> 🟢 🟢 🟢 All cypress tests have passed! 🎉 🎉 🎉
> Workflow run:
<https://github.com/appsmithorg/appsmith/actions/runs/9074032519>
> Commit: f7f68e7
> Cypress dashboard url: <a
href="https://internal.appsmith.com/app/cypress-dashboard/rundetails-65890b3c81d7400d08fa9ee5?branch=master&workflowId=9074032519&attempt=1"
target="_blank">Click here!</a>

<!-- end of auto-generated comment: Cypress test results  -->

Co-authored-by: Pawan Kumar <[email protected]>

app/client/src/pages/Editor/IDE/EditorPane/UI/Add.tsx

@@ -22,7 +22,7 @@ const AddWidgets = (props: { focusSearchInput?: boolean }) => {
         onCloseClick={closeButtonClickHandler}
         titleMessage={EDITOR_PANE_TEXTS.widgets_create_tab_title}
       />
-      <Flex flexDirection="column" gap="spaces-3" overflowX="scroll">
+      <Flex flexDirection="column" gap="spaces-3" overflowX="auto">
         <UIEntitySidebar focusSearchInput={props.focusSearchInput} isActive />
       </Flex>
     </>

app/client/src/pages/Editor/widgetSidebar/UIEntitySidebar.tsx

@@ -9,7 +9,7 @@ import type {
   WidgetTags,
 } from "constants/WidgetConstants";
 import { WIDGET_TAGS } from "constants/WidgetConstants";
-import { SearchInput, Text } from "design-system";
+import { Flex, SearchInput, Text } from "design-system";
 import Fuse from "fuse.js";
 import { debounce } from "lodash";
 import React, { useEffect, useMemo, useRef, useState } from "react";
@@ -109,9 +109,10 @@ function UIEntitySidebar({
           type="text"
         />
       </div>
-      <div
-        className="flex-grow px-3 mt-2 overflow-y-scroll"
+      <Flex
+        className="flex-grow px-3 overflow-y-scroll"
         data-testid="t--widget-sidebar-scrollable-wrapper"
+        pt="spaces-2"
       >
         {isEmpty && (
           <Text
@@ -150,7 +151,7 @@ function UIEntitySidebar({
             );
           })}
         </div>
-      </div>
+      </Flex>
     </div>
   );
 }