Use new tooltip from macaw in filter presets (#3467)

package.json

@@ -33,7 +33,7 @@
     "@material-ui/lab": "^4.0.0-alpha.61",
     "@material-ui/styles": "^4.11.4",
     "@reach/auto-id": "^0.16.0",
-    "@saleor/macaw-ui": "^0.8.0-pre.64",
+    "@saleor/macaw-ui": "^0.8.0-pre.66",
     "@saleor/sdk": "^0.4.6",
     "@sentry/react": "^6.0.0",
     "@types/faker": "^5.1.6",

src/components/FilterPresetsSelect/FilterPresetsSelect.tsx

@@ -1,5 +1,4 @@
 import { commonMessages } from "@dashboard/intl";
-import { Tooltip } from "@saleor/macaw-ui";
 import {
   Box,
   Button,
@@ -9,6 +8,7 @@ import {
   PlusIcon,
   sprinkles,
   Text,
+  Tooltip,
   vars,
 } from "@saleor/macaw-ui/next";
 import React, { MouseEvent } from "react";
@@ -72,10 +72,16 @@ export const FilterPresetsSelect = ({
     if (!savedPresets?.length) {
       return (
         <Box display="flex" alignItems="center">
-          <Tooltip title={intl.formatMessage(messages.noPresets)}>
+          <Tooltip>
+            <Tooltip.Trigger>
               <Text variant="title" size="small">
                 {selectAllLabel}
               </Text>
+            </Tooltip.Trigger>
+            <Tooltip.Content>
+              <Tooltip.Arrow />
+              {intl.formatMessage(messages.noPresets)}
+            </Tooltip.Content>
           </Tooltip>
         </Box>
       );
@@ -179,7 +185,8 @@ export const FilterPresetsSelect = ({
         </Button>
       )}
       {showSaveButton && (
-        <Tooltip title={intl.formatMessage(messages.savePreset)}>
+        <Tooltip>
+          <Tooltip.Trigger>
             <Button
               className={sprinkles({
                 marginLeft: 6,
@@ -189,6 +196,11 @@ export const FilterPresetsSelect = ({
               variant="secondary"
               size="small"
             />
+          </Tooltip.Trigger>
+          <Tooltip.Content>
+            <Tooltip.Arrow />
+            {intl.formatMessage(messages.savePreset)}
+          </Tooltip.Content>
         </Tooltip>
       )}
     </Box>