diff --git a/apps/web/components/ui/TableActions.tsx b/apps/web/components/ui/TableActions.tsx
index 242b0c0dac..982e87c312 100644
--- a/apps/web/components/ui/TableActions.tsx
+++ b/apps/web/components/ui/TableActions.tsx
@@ -1,6 +1,11 @@
import React, { FC } from "react";
-import Dropdown, { DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@calcom/ui/Dropdown";
+import Dropdown, {
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuTrigger,
+ DropdownMenuPortal,
+} from "@calcom/ui/Dropdown";
import { Icon } from "@calcom/ui/Icon";
import Button from "@calcom/ui/v2/core/Button";
@@ -43,22 +48,24 @@ const DropdownActions = ({
) : (
{actionTrigger}
)}
-
- {actions.map((action) => (
-
-
-
- ))}
-
+
+
+ {actions.map((action) => (
+
+
+
+ ))}
+
+
);
};
diff --git a/apps/web/pages/event-types/index.tsx b/apps/web/pages/event-types/index.tsx
index 12d1566c56..cc9c2e4535 100644
--- a/apps/web/pages/event-types/index.tsx
+++ b/apps/web/pages/event-types/index.tsx
@@ -24,6 +24,7 @@ import Dropdown, {
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
+ DropdownMenuPortal,
} from "@calcom/ui/Dropdown";
import EmptyScreen from "@calcom/ui/EmptyScreen";
import { Icon } from "@calcom/ui/Icon";
@@ -345,36 +346,70 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
-
-
-
+
+
+
+
+
+
+
+
-
-
-
-
-
- {isNativeShare ? (
+
+ {isNativeShare ? (
+
+
+
+ ) : null}
+
+
+
- ) : null}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
diff --git a/apps/web/pages/v2/event-types/index.tsx b/apps/web/pages/v2/event-types/index.tsx
index a174ba1209..1405a378ea 100644
--- a/apps/web/pages/v2/event-types/index.tsx
+++ b/apps/web/pages/v2/event-types/index.tsx
@@ -18,6 +18,7 @@ import Dropdown, {
DropdownMenuItem,
DropdownMenuSeparator,
DropdownMenuTrigger,
+ DropdownMenuPortal,
} from "@calcom/ui/v2/core/Dropdown";
import Shell from "@calcom/ui/v2/core/Shell";
import CreateEventTypeButton from "@calcom/ui/v2/modules/event-types/CreateEventType";
@@ -343,90 +344,92 @@ export const EventTypeList = ({ group, groupIndex, readOnly, types }: EventTypeL
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+ {isNativeShare ? (
+
-
-
-
-
-
-
- {isNativeShare ? (
+
+ ) : null}
+
+
+
- ) : null}
-
-
-
-
-
-
-
-
-
-
-
+
+
+
+
+
+
diff --git a/packages/ui/Dropdown.tsx b/packages/ui/Dropdown.tsx
index 202580ed14..40c2615c59 100644
--- a/packages/ui/Dropdown.tsx
+++ b/packages/ui/Dropdown.tsx
@@ -22,14 +22,15 @@ export const DropdownMenuTrigger = forwardRef;
export const DropdownMenuContent = forwardRef(
({ children, ...props }, forwardedRef) => {
return (
;
export const DropdownMenuContent = forwardRef(
({ children, align = "end", ...props }, forwardedRef) => {
return (
- setMenuOpen(false)}>
- {helpOpen ? (
- onHelpItemSelect()} />
- ) : (
- <>
-
-
-
-
- {user.username && (
+
+ setMenuOpen(false)}>
+ {helpOpen ? (
+ onHelpItemSelect()} />
+ ) : (
+ <>
+
+
+
+
+ {user.username && (
+
+
+ {" "}
+ {t("view_public_page")}
+
+
+ )}
+
+
+
+ {" "}
+ {t("join_our_slack")}
+
+
- {" "}
- {t("view_public_page")}
+ {t("visit_roadmap")}
- )}
-
-
-
- {" "}
- {t("join_our_slack")}
-
-
-
-
- {t("visit_roadmap")}
-
-
-
-
-
-
- {" "}
- {t("download_desktop_app")}
-
-
-
-
-
- signOut({ callbackUrl: "/auth/logout" })}
- className="flex cursor-pointer items-center px-4 py-2 text-sm hover:bg-gray-100 hover:text-gray-900">
- setHelpOpen(true)}>
+
- {t("sign_out")}
-
-
- >
- )}
-
+
+ {t("help")}
+
+
+
+
+ {" "}
+ {t("download_desktop_app")}
+
+
+
+
+
+ signOut({ callbackUrl: "/auth/logout" })}
+ className="flex cursor-pointer items-center px-4 py-2 text-sm hover:bg-gray-100 hover:text-gray-900">
+
+ {t("sign_out")}
+
+
+ >
+ )}
+
+
);
}
diff --git a/packages/ui/v2/core/TableActions.tsx b/packages/ui/v2/core/TableActions.tsx
index f4b64dc1b7..4a95a4aa99 100644
--- a/packages/ui/v2/core/TableActions.tsx
+++ b/packages/ui/v2/core/TableActions.tsx
@@ -3,7 +3,12 @@ import React, { FC } from "react";
import { SVGComponent } from "@calcom/types/SVGComponent";
import { Icon } from "@calcom/ui/Icon";
import Button from "@calcom/ui/v2/core/Button";
-import { DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@calcom/ui/v2/core/Dropdown";
+import {
+ DropdownMenuContent,
+ DropdownMenuItem,
+ DropdownMenuTrigger,
+ DropdownMenuPortal,
+} from "@calcom/ui/v2/core/Dropdown";
import Dropdown from "@calcom/ui/v2/core/Dropdown";
export type ActionType = {
@@ -45,21 +50,23 @@ const DropdownActions = ({
{actionTrigger}
)}
-
- {actions.map((action) => (
-
-
-
- ))}
-
+
+
+ {actions.map((action) => (
+
+
+
+ ))}
+
+
);
};