fix(ui): resolve popper warnings

ui/src/Common/Popper.ts

@@ -6,4 +6,18 @@ export const CommonPopperModifiers = [
       gpuAcceleration: false,
     },
   },
+  {
+    name: "offset",
+    options: {
+      offset: [0, 5],
+    },
+  },
+  {
+    name: "computeStyles",
+    options: {
+      gpuAcceleration: false,
+      adaptive: false,
+      roundOffsets: true,
+    },
+  },
 ];

ui/src/Components/Grid/AlertGrid/AlertGroup/Alert/AlertMenu.tsx

@@ -85,7 +85,7 @@ const MenuContent: FC<{
   return (
     <FetchPauser alertStore={alertStore}>
       <div
-        className="dropdown-menu d-block shadow"
+        className="dropdown-menu d-block shadow m-0"
         ref={popperRef}
         style={popperStyle}
         data-placement={popperPlacement}

ui/src/Components/Grid/AlertGrid/AlertGroup/GroupHeader/GroupMenu.tsx

@@ -93,7 +93,7 @@ const MenuContent: FC<{
   return (
     <FetchPauser alertStore={alertStore}>
       <div
-        className="dropdown-menu d-block shadow"
+        className="dropdown-menu d-block shadow m-0"
         ref={popperRef}
         style={popperStyle}
         data-placement={popperPlacement}

ui/src/Components/Grid/AlertGrid/GridLabelSelect.tsx

@@ -127,7 +127,7 @@ const Dropdown: FC<{
 }) => {
   return (
     <div
-      className="dropdown-menu d-block shadow components-grid-label-select-menu border-0 p-0"
+      className="dropdown-menu d-block shadow components-grid-label-select-menu border-0 p-0 m-0"
       ref={popperRef}
       style={{
         fontSize: "1rem",

ui/src/Components/NavBar/FilterInput/History.tsx

@@ -90,7 +90,7 @@ const HistoryMenu: FC<{
 
   return (
     <div
-      className="dropdown-menu d-block shadow components-navbar-historymenu"
+      className="dropdown-menu d-block shadow components-navbar-historymenu m-0"
       ref={popperRef}
       style={popperStyle}
       data-placement={popperPlacement}

ui/src/Components/NavBar/FilterInput/index.tsx

@@ -172,7 +172,7 @@ const FilterInput: FC<{
           </div>
           <span className="dropdown" {...getMenuProps()}>
             {isOpen && inputValue && suggestions.length ? (
-              <div className="dropdown-menu show shadow">
+              <div className="dropdown-menu show shadow m-0">
                 {suggestions.slice(0, 10).map((item, index) => (
                   <li
                     className={`dropdown-item cursor-pointer ${