change collections menu tooltip placement to bottom (#30611)

* update upload button tooltip

* change collections menu tooltip placement to bottom

frontend/src/metabase/collections/components/CollectionHeader/CollectionBookmark.tsx

@@ -33,6 +33,7 @@ const CollectionBookmark = ({
   return (
     <BookmarkToggle
       isBookmarked={isBookmarked}
+      tooltipPlacement="bottom"
       onCreateBookmark={handleCreateBookmark}
       onDeleteBookmark={handleDeleteBookmark}
     />

frontend/src/metabase/collections/components/CollectionHeader/CollectionMenu.tsx

@@ -69,6 +69,7 @@ const CollectionMenu = ({
         items={items}
         triggerIcon="ellipsis"
         tooltip={t`Move, archive, and more...`}
+        tooltipPlacement="bottom"
       />
     );
   } else {

frontend/src/metabase/collections/components/CollectionHeader/CollectionTimeline.tsx

@@ -16,7 +16,7 @@ const CollectionTimeline = ({
   const url = Urls.timelinesInCollection(collection);
 
   return (
-    <Tooltip tooltip={t`Events`}>
+    <Tooltip tooltip={t`Events`} placement="bottom">
       <div>
         <CollectionHeaderButton as={Link} to={url} icon="calendar" />
       </div>

frontend/src/metabase/collections/components/CollectionHeader/CollectionUpload.tsx

@@ -40,6 +40,7 @@ export default function ColllectionUpload({
           )} (${MAX_UPLOAD_STRING} max)`}</TooltipSubtitle>
         </TooltipContainer>
       }
+      placement="bottom"
     >
       <label htmlFor="upload-csv">
         <CollectionHeaderButton as="span" to="" icon="arrow_up" />

frontend/src/metabase/components/EntityMenu/EntityMenu.jsx

@@ -56,6 +56,7 @@ class EntityMenu extends Component {
       renderTrigger,
       targetOffsetY,
       triggerAriaLabel,
+      tooltipPlacement,
     } = this.props;
     const { open, menuItemContent } = this.state;
     return (
@@ -70,6 +71,7 @@ class EntityMenu extends Component {
             onClick={this.toggleMenu}
             open={open}
             tooltip={tooltip}
+            tooltipPlacement={tooltipPlacement}
             triggerProps={triggerProps}
           />
         )}

frontend/src/metabase/components/EntityMenuTrigger/EntityMenuTrigger.tsx

@@ -11,6 +11,7 @@ type EntityMenuTriggerProps = {
   onClick: () => void;
   open?: boolean;
   tooltip?: string;
+  tooltipPlacement?: "top" | "bottom";
   triggerProps?: EntityMenuIconButtonProps;
   trigger?: React.ReactElement;
   ariaLabel?: string;
@@ -21,6 +22,7 @@ const EntityMenuTrigger = ({
   onClick,
   open,
   tooltip,
+  tooltipPlacement,
   triggerProps,
   trigger,
   ariaLabel,
@@ -38,7 +40,7 @@ const EntityMenuTrigger = ({
     />
   );
   return tooltip ? (
-    <Tooltip tooltip={tooltip} isEnabled={!open}>
+    <Tooltip tooltip={tooltip} isEnabled={!open} placement={tooltipPlacement}>
       {triggerContent}
     </Tooltip>
   ) : (

frontend/src/metabase/core/components/BookmarkToggle/BookmarkToggle.tsx

@@ -11,6 +11,7 @@ import { BookmarkIcon, BookmarkButton } from "./BookmarkToggle.styled";
 
 export interface BookmarkToggleProps extends HTMLAttributes<HTMLButtonElement> {
   isBookmarked: boolean;
+  tooltipPlacement?: "top" | "bottom";
   onCreateBookmark: () => void;
   onDeleteBookmark: () => void;
 }
@@ -20,6 +21,7 @@ const BookmarkToggle = forwardRef(function BookmarkToggle(
     isBookmarked,
     onCreateBookmark,
     onDeleteBookmark,
+    tooltipPlacement,
     ...props
   }: BookmarkToggleProps,
   ref: Ref<HTMLButtonElement>,
@@ -41,7 +43,10 @@ const BookmarkToggle = forwardRef(function BookmarkToggle(
   }, []);
 
   return (
-    <Tooltip tooltip={isBookmarked ? t`Remove from bookmarks` : t`Bookmark`}>
+    <Tooltip
+      tooltip={isBookmarked ? t`Remove from bookmarks` : t`Bookmark`}
+      placement={tooltipPlacement}
+    >
       <BookmarkButton
         {...props}
         ref={ref}