АРХ - МЕЖПРОЕКТНАЯ КОММУНИКАЦИЯ: канонизация labels, editor и ui dropdown-оберток

plane-src/packages/ui/src/link/block.tsx

@@ -5,11 +5,12 @@
  */
 
 import React from "react";
+import { MoreVertical } from "lucide-react";
 // plane utils
 import { calculateTimeAgo, cn, getIconForLink } from "@plane/utils";
 // plane ui
 import type { TContextMenuItem } from "../dropdowns/context-menu/root";
-import { CustomMenu } from "../dropdowns/custom-menu";
+import { ActionDropdown } from "../dropdowns/action-dropdown";
 
 export type TLinkItemBlockProps = {
   title: string;
@@ -38,36 +39,17 @@ export function LinkItemBlock(props: TLinkItemBlockProps) {
       </div>
       {menuItems && (
         <div className="hidden group-hover:block">
-          <CustomMenu placement="bottom-end" menuItemsClassName="z-20" closeOnSelect verticalEllipsis>
-            {menuItems.map((item) => (
-              <CustomMenu.MenuItem
-                key={item.key}
-                onClick={(e) => {
-                  e.preventDefault();
-                  e.stopPropagation();
-                  item.action();
-                }}
-                className={cn("flex w-full items-center gap-2", {
-                  "text-placeholder": item.disabled,
-                })}
-                disabled={item.disabled}
-              >
-                {item.icon && <item.icon className={cn("h-3 w-3", item.iconClassName)} />}
-                <div>
-                  <h5>{item.title}</h5>
-                  {item.description && (
-                    <p
-                      className={cn("whitespace-pre-line text-tertiary", {
-                        "text-placeholder": item.disabled,
-                      })}
-                    >
-                      {item.description}
-                    </p>
-                  )}
-                </div>
-              </CustomMenu.MenuItem>
-            ))}
-          </CustomMenu>
+          <ActionDropdown
+            placement="bottom-end"
+            menuClassName="z-20"
+            button={
+              <span className="grid place-items-center rounded-sm p-1 text-secondary hover:bg-white/6">
+                <MoreVertical className="h-3.5 w-3.5" />
+              </span>
+            }
+            buttonClassName="grid place-items-center"
+            items={menuItems}
+          />
         </div>
       )}
     </div>