chore: link icon migration

anmolsinghbhatia · anmolsinghbhatia · commit 15739fc2e34c · 2025-12-03T17:39:14.000+05:30
diff --git a/apps/space/core/components/issues/issue-layouts/properties/all-properties.tsx b/apps/space/core/components/issues/issue-layouts/properties/all-properties.tsx
@@ -1,6 +1,6 @@
 import { observer } from "mobx-react";
-import { Link, Paperclip } from "lucide-react";
-import { ViewsIcon } from "@plane/propel/icons";
+import { Paperclip } from "lucide-react";
+import { LinkIcon , ViewsIcon } from "@plane/propel/icons";
 // plane imports
 import { Tooltip } from "@plane/propel/tooltip";
 import type { IIssueDisplayProperties } from "@plane/types";
@@ -169,7 +169,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
       >
         <Tooltip tooltipHeading="Links" tooltipContent={`${issue.link_count}`}>
           <div className="flex h-5 flex-shrink-0 items-center justify-center gap-2 overflow-hidden rounded border-[0.5px] border-custom-border-300 px-2.5 py-1">
-            <Link className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
+            <LinkIcon className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.link_count}</div>
           </div>
         </Tooltip>
diff --git a/apps/web/ce/components/views/helper.tsx b/apps/web/ce/components/views/helper.tsx
@@ -1,6 +1,6 @@
-import { Link } from "lucide-react";
+
 import { useTranslation } from "@plane/i18n";
-import { NewTabIcon , EditIcon , TrashIcon } from "@plane/propel/icons";
+import { LinkIcon , NewTabIcon , EditIcon , TrashIcon } from "@plane/propel/icons";
 import type { EIssueLayoutTypes, IProjectView } from "@plane/types";
 import type { TContextMenuItem } from "@plane/ui";
 import type { TWorkspaceLayoutProps } from "@/components/views/helper";
@@ -56,7 +56,7 @@ export const useMenuItemsFactory = (props: TMenuItemsFactoryProps) => {
     key: "copy-link",
     action: handleCopyText,
     title: t("copy_link"),
-    icon: Link,
+    icon: LinkIcon,
   });
 
   const deleteMenuItem = () => ({
diff --git a/apps/web/core/components/comments/quick-actions.tsx b/apps/web/core/components/comments/quick-actions.tsx
@@ -1,11 +1,11 @@
 import type { FC } from "react";
 import { useMemo } from "react";
 import { observer } from "mobx-react";
-import { Link } from "lucide-react";
+
 // plane imports
 import { EIssueCommentAccessSpecifier } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { GlobeIcon, LockIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
+import { LinkIcon , GlobeIcon, LockIcon, EditIcon, TrashIcon } from "@plane/propel/icons";
 import type { TIssueComment, TCommentsOperations } from "@plane/types";
 import type { TContextMenuItem } from "@plane/ui";
 import { CustomMenu } from "@plane/ui";
@@ -45,7 +45,7 @@ export const CommentQuickActions = observer(function CommentQuickActions(props:
         key: "copy_link",
         action: () => activityOperations.copyCommentLink(comment.id),
         title: t("common.actions.copy_link"),
-        icon: Link,
+        icon: LinkIcon,
         shouldRender: showCopyLinkOption,
       },
       {
diff --git a/apps/web/core/components/common/activity/helper.tsx b/apps/web/core/components/common/activity/helper.tsx
@@ -2,7 +2,6 @@ import type { ReactNode } from "react";
 import {
   RotateCcw,
   Network,
-  Link as LinkIcon,
   Calendar,
   Inbox,
   AlignLeft,
@@ -21,6 +20,7 @@ import {
 // components
 
 import {
+  LinkIcon,
   ArchiveIcon,
   CycleIcon,
   GlobeIcon,
diff --git a/apps/web/core/components/cycles/quick-actions.tsx b/apps/web/core/components/cycles/quick-actions.tsx
@@ -2,7 +2,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 
 // icons
-import { ArchiveRestoreIcon, LinkIcon } from "lucide-react";
+import { ArchiveRestoreIcon } from "lucide-react";
 // ui
 import {
   CYCLE_TRACKER_EVENTS,
@@ -11,7 +11,7 @@ import {
   CYCLE_TRACKER_ELEMENTS,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { NewTabIcon , EditIcon , TrashIcon , ArchiveIcon } from "@plane/propel/icons";
+import { LinkIcon , NewTabIcon , EditIcon , TrashIcon , ArchiveIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TContextMenuItem } from "@plane/ui";
 import { ContextMenu, CustomMenu } from "@plane/ui";
diff --git a/apps/web/core/components/home/widgets/links/link-detail.tsx b/apps/web/core/components/home/widgets/links/link-detail.tsx
@@ -1,8 +1,8 @@
 import { useCallback, useMemo } from "react";
 import { observer } from "mobx-react";
-import { Link } from "lucide-react";
+
 import { useTranslation } from "@plane/i18n";
-import { NewTabIcon , EditIcon , TrashIcon } from "@plane/propel/icons";
+import { LinkIcon , NewTabIcon , EditIcon , TrashIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TContextMenuItem } from "@plane/ui";
 import { LinkItemBlock } from "@plane/ui";
@@ -77,7 +77,7 @@ export const ProjectLinkDetail = observer(function ProjectLinkDetail(props: TPro
         key: "copy-link",
         action: handleCopyText,
         title: t("copy_link"),
-        icon: Link,
+        icon: LinkIcon,
       },
       {
         key: "delete",
diff --git a/apps/web/core/components/inbox/content/inbox-issue-header.tsx b/apps/web/core/components/inbox/content/inbox-issue-header.tsx
@@ -1,12 +1,12 @@
 import type { FC } from "react";
 import { useCallback, useEffect, useState } from "react";
 import { observer } from "mobx-react";
-import { CircleCheck, CircleX, Clock, FileStack, Link, MoveRight } from "lucide-react";
+import { CircleCheck, CircleX, Clock, FileStack, MoveRight } from "lucide-react";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CopyIcon , NewTabIcon , TrashIcon , ChevronDownIcon, ChevronUpIcon } from "@plane/propel/icons";
+import { LinkIcon , CopyIcon , NewTabIcon , TrashIcon , ChevronDownIcon, ChevronUpIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TNameDescriptionLoader } from "@plane/types";
 import { EInboxIssueStatus } from "@plane/types";
@@ -352,7 +352,7 @@ export const InboxIssueActionsHeader = observer(function InboxIssueActionsHeader
               <div className="flex items-center gap-2">
                 <Button
                   variant="neutral-primary"
-                  prependIcon={<Link className="h-2.5 w-2.5" />}
+                  prependIcon={<LinkIcon className="h-2.5 w-2.5" />}
                   size="sm"
                   onClick={() => handleCopyIssueLink(workItemLink)}
                 >
diff --git a/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx b/apps/web/core/components/inbox/content/inbox-issue-mobile-header.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import { observer } from "mobx-react";
-import { CircleCheck, CircleX, Clock, FileStack, Link, PanelLeft, MoveRight } from "lucide-react";
-import { NewTabIcon , TrashIcon , ChevronDownIcon, ChevronUpIcon } from "@plane/propel/icons";
+import { CircleCheck, CircleX, Clock, FileStack, PanelLeft, MoveRight } from "lucide-react";
+import { LinkIcon , NewTabIcon , TrashIcon , ChevronDownIcon, ChevronUpIcon } from "@plane/propel/icons";
 import type { TNameDescriptionLoader } from "@plane/types";
 import { Header, CustomMenu, EHeaderVariant } from "@plane/ui";
 import { cn, findHowManyDaysLeft, generateWorkItemLink } from "@plane/utils";
@@ -125,7 +125,7 @@ export const InboxIssueActionsMobileHeader = observer(function InboxIssueActions
             {isAcceptedOrDeclined && (
               <CustomMenu.MenuItem onClick={handleCopyIssueLink}>
                 <div className="flex items-center gap-2">
-                  <Link size={14} strokeWidth={2} />
+                  <LinkIcon width={14} height={14} strokeWidth={2} />
                   Copy work item link
                 </div>
               </CustomMenu.MenuItem>
diff --git a/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx b/apps/web/core/components/issues/issue-detail-widgets/action-buttons.tsx
@@ -1,8 +1,8 @@
 import type { FC } from "react";
 import React from "react";
-import { Link, Paperclip } from "lucide-react";
+import { Paperclip } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
-import { ViewsIcon, RelationPropertyIcon } from "@plane/propel/icons";
+import { LinkIcon , ViewsIcon, RelationPropertyIcon } from "@plane/propel/icons";
 // plane imports
 import type { TIssueServiceType, TWorkItemWidgets } from "@plane/types";
 // plane web imports
@@ -63,7 +63,7 @@ export function IssueDetailWidgetActionButtons(props: Props) {
           customButton={
             <IssueDetailWidgetButton
               title={t("issue.add.link")}
-              icon={<Link className="h-3.5 w-3.5 flex-shrink-0" strokeWidth={2} />}
+              icon={<LinkIcon className="h-3.5 w-3.5 flex-shrink-0" strokeWidth={2} />}
               disabled={disabled}
             />
           }
diff --git a/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx b/apps/web/core/components/issues/issue-detail-widgets/sub-issues/issues-list/list-item.tsx
@@ -1,7 +1,7 @@
 import { observer } from "mobx-react";
-import { Link as LinkIcon, Loader } from "lucide-react";
+import { Link as Loader } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
-import { EditIcon , TrashIcon , CloseIcon, ChevronRightIcon } from "@plane/propel/icons";
+import { LinkIcon , EditIcon , TrashIcon , CloseIcon, ChevronRightIcon } from "@plane/propel/icons";
 // plane imports
 import { Tooltip } from "@plane/propel/tooltip";
 import type { TIssue, TIssueServiceType, TSubIssueOperations } from "@plane/types";
diff --git a/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx b/apps/web/core/components/issues/issue-detail/issue-detail-quick-actions.tsx
@@ -1,10 +1,11 @@
 import type { FC } from "react";
 import React, { useRef } from "react";
 import { observer } from "mobx-react";
-import { LinkIcon } from "lucide-react";
+
 // plane imports
 import { WORK_ITEM_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { LinkIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@plane/propel/tooltip";
 import { EIssuesStoreType } from "@plane/types";
diff --git a/apps/web/core/components/issues/issue-detail/links/link-item.tsx b/apps/web/core/components/issues/issue-detail/links/link-item.tsx
@@ -1,7 +1,7 @@
 import { observer } from "mobx-react";
-import { Link } from "lucide-react";
+
 import { useTranslation } from "@plane/i18n";
-import { CopyIcon , EditIcon , TrashIcon } from "@plane/propel/icons";
+import { LinkIcon , CopyIcon , EditIcon , TrashIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@plane/propel/tooltip";
 import type { TIssueServiceType } from "@plane/types";
@@ -54,7 +54,7 @@ export const IssueLinkItem = observer(function IssueLinkItem(props: TIssueLinkIt
           {faviconUrl ? (
             <img src={faviconUrl} alt="favicon" className="size-4" />
           ) : (
-            <Link className="size-4 text-custom-text-350 group-hover:text-custom-text-100" />
+            <LinkIcon className="size-4 text-custom-text-350 group-hover:text-custom-text-100" />
           )}
           <Tooltip tooltipContent={linkDetail.url} isMobile={isMobile}>
             <a
diff --git a/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx b/apps/web/core/components/issues/issue-layouts/properties/all-properties.tsx
@@ -4,12 +4,12 @@ import { xor } from "lodash-es";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // icons
-import { Link, Paperclip } from "lucide-react";
+import { Paperclip } from "lucide-react";
 // types
 import { WORK_ITEM_TRACKER_EVENTS } from "@plane/constants";
 // i18n
 import { useTranslation } from "@plane/i18n";
-import { StartDatePropertyIcon, ViewsIcon, DueDatePropertyIcon } from "@plane/propel/icons";
+import { LinkIcon , StartDatePropertyIcon, ViewsIcon, DueDatePropertyIcon } from "@plane/propel/icons";
 import { Tooltip } from "@plane/propel/tooltip";
 import type { TIssue, IIssueDisplayProperties, TIssuePriorities } from "@plane/types";
 // ui
@@ -512,7 +512,7 @@ export const IssueProperties = observer(function IssueProperties(props: IIssuePr
             onFocus={handleEventPropagation}
             onClick={handleEventPropagation}
           >
-            <Link className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
+            <LinkIcon className="h-3 w-3 flex-shrink-0" strokeWidth={2} />
             <div className="text-xs">{issue.link_count}</div>
           </div>
         </Tooltip>
diff --git a/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/helper.tsx b/apps/web/core/components/issues/issue-layouts/quick-action-dropdowns/helper.tsx
@@ -1,8 +1,8 @@
 import { useMemo } from "react";
-import { Link, XCircle, ArchiveRestoreIcon } from "lucide-react";
+import { XCircle, ArchiveRestoreIcon } from "lucide-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { CopyIcon , NewTabIcon, EditIcon, ArchiveIcon, TrashIcon } from "@plane/propel/icons";
+import { LinkIcon , CopyIcon , NewTabIcon, EditIcon, ArchiveIcon, TrashIcon } from "@plane/propel/icons";
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { EIssuesStoreType, TIssue } from "@plane/types";
 import type { TContextMenuItem } from "@plane/ui";
@@ -195,7 +195,7 @@ export const useMenuItemFactory = (props: MenuItemFactoryProps) => {
   const createCopyLinkMenuItem = (): TContextMenuItem => ({
     key: "copy-link",
     title: t("common.actions.copy_link"),
-    icon: Link,
+    icon: LinkIcon,
     action: actionHandlers.handleCopyIssueLink,
   });
 
diff --git a/apps/web/core/components/issues/relations/issue-list-item.tsx b/apps/web/core/components/issues/relations/issue-list-item.tsx
@@ -1,9 +1,8 @@
 import type { FC } from "react";
 import React from "react";
 import { observer } from "mobx-react";
-import { Link as LinkIcon } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
-import { EditIcon , TrashIcon , CloseIcon } from "@plane/propel/icons";
+import { LinkIcon , EditIcon , TrashIcon , CloseIcon } from "@plane/propel/icons";
 // plane imports
 import { Tooltip } from "@plane/propel/tooltip";
 import type { TIssue, TIssueServiceType } from "@plane/types";
diff --git a/apps/web/core/components/modules/quick-actions.tsx b/apps/web/core/components/modules/quick-actions.tsx
@@ -2,7 +2,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 
 // icons
-import { ArchiveRestoreIcon, LinkIcon } from "lucide-react";
+import { ArchiveRestoreIcon } from "lucide-react";
 // plane imports
 import {
   EUserPermissions,
@@ -11,7 +11,7 @@ import {
   MODULE_TRACKER_EVENTS,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { NewTabIcon , EditIcon , ArchiveIcon, TrashIcon } from "@plane/propel/icons";
+import { LinkIcon , NewTabIcon , EditIcon , ArchiveIcon, TrashIcon } from "@plane/propel/icons";
 // ui
 import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import type { TContextMenuItem } from "@plane/ui";
diff --git a/apps/web/core/components/navigation/project-actions-menu.tsx b/apps/web/core/components/navigation/project-actions-menu.tsx
@@ -3,10 +3,11 @@
 import type { FC } from "react";
 import { useState, useRef } from "react";
 import { useNavigate } from "react-router";
-import { LinkIcon, LogOut, MoreHorizontal, Settings, Share2, ArchiveIcon } from "lucide-react";
+import { LogOut, MoreHorizontal, Settings, Share2, ArchiveIcon } from "lucide-react";
 // plane imports
 import { MEMBER_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { LinkIcon } from "@plane/propel/icons";
 import { CustomMenu } from "@plane/ui";
 
 type Props = {
diff --git a/apps/web/core/components/pages/dropdowns/actions.tsx b/apps/web/core/components/pages/dropdowns/actions.tsx
@@ -4,15 +4,14 @@ import { useParams } from "next/navigation";
 import {
   ArchiveRestoreIcon,
   FileOutput,
-  Link,
   LockKeyhole,
   LockKeyholeOpen,
 } from "lucide-react";
 // constants
 import { EPageAccess, PROJECT_PAGE_TRACKER_ELEMENTS } from "@plane/constants";
 // plane editor
 import type { EditorRefApi } from "@plane/editor";
-import { CopyIcon , LockIcon , NewTabIcon , ArchiveIcon, TrashIcon, GlobeIcon } from "@plane/propel/icons";
+import { LinkIcon , CopyIcon , LockIcon , NewTabIcon , ArchiveIcon, TrashIcon, GlobeIcon } from "@plane/propel/icons";
 // plane ui
 import type { TContextMenuItem } from "@plane/ui";
 import { ContextMenu, CustomMenu } from "@plane/ui";
@@ -119,7 +118,7 @@ export const PageActions = observer(function PageActions(props: Props) {
         key: "copy-link",
         action: pageOperations.copyLink,
         title: "Copy link",
-        icon: Link,
+        icon: LinkIcon,
         shouldRender: true,
       },
       {
diff --git a/apps/web/core/components/pages/header/copy-link-control.tsx b/apps/web/core/components/pages/header/copy-link-control.tsx
@@ -1,5 +1,6 @@
 import { observer } from "mobx-react";
-import { Link } from "lucide-react";
+
+import { LinkIcon } from "@plane/propel/icons";
 // hooks
 import { usePageOperations } from "@/hooks/use-page-operations";
 // store
@@ -21,7 +22,7 @@ export const PageCopyLinkControl = observer(function PageCopyLinkControl({ page
       onClick={pageOperations.copyLink}
       className="flex-shrink-0 size-6 grid place-items-center rounded text-custom-text-200 hover:text-custom-text-100 hover:bg-custom-background-80 transition-colors"
     >
-      <Link className="size-3.5" />
+      <LinkIcon className="size-3.5" />
     </button>
   );
 });
diff --git a/apps/web/core/components/power-k/config/miscellaneous-commands.ts b/apps/web/core/components/power-k/config/miscellaneous-commands.ts
@@ -1,7 +1,7 @@
 import { useCallback } from "react";
-import { Link, PanelLeft } from "lucide-react";
+import { PanelLeft } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
-import { SearchIcon } from "@plane/propel/icons";
+import { LinkIcon , SearchIcon } from "@plane/propel/icons";
 // plane imports
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { copyTextToClipboard } from "@plane/utils";
@@ -63,7 +63,7 @@ export const usePowerKMiscellaneousCommands = (): TPowerKCommandConfig[] => {
       group: "miscellaneous",
       type: "action",
       i18n_title: "power_k.miscellaneous_actions.copy_current_page_url",
-      icon: Link,
+      icon: LinkIcon,
       action: copyCurrentPageUrlToClipboard,
       modifierShortcut: "cmd+shift+c",
       isEnabled: () => true,
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/cycle/commands.ts b/apps/web/core/components/power-k/ui/pages/context-based/cycle/commands.ts
@@ -1,9 +1,10 @@
 import { useCallback } from "react";
 import { useParams } from "next/navigation";
-import { LinkIcon, Star, StarOff } from "lucide-react";
+import { Star, StarOff } from "lucide-react";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { LinkIcon } from "@plane/propel/icons";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { copyTextToClipboard } from "@plane/utils";
 // components
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/module/commands.tsx b/apps/web/core/components/power-k/ui/pages/context-based/module/commands.tsx
@@ -1,10 +1,10 @@
 import { useCallback } from "react";
 import { useParams } from "next/navigation";
-import { LinkIcon, Star, StarOff, Users } from "lucide-react";
+import { Star, StarOff, Users } from "lucide-react";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ModuleStatusIcon } from "@plane/propel/icons";
+import { LinkIcon , ModuleStatusIcon } from "@plane/propel/icons";
 import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import type { IModule, TModuleStatus } from "@plane/types";
 import { EUserPermissions } from "@plane/types";
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/page/commands.ts b/apps/web/core/components/power-k/ui/pages/context-based/page/commands.ts
diff --git a/apps/web/core/components/power-k/ui/pages/context-based/work-item/commands.ts b/apps/web/core/components/power-k/ui/pages/context-based/work-item/commands.ts
diff --git a/apps/web/core/components/project/card.tsx b/apps/web/core/components/project/card.tsx
diff --git a/apps/web/core/components/workspace/settings/invitations-list-item.tsx b/apps/web/core/components/workspace/settings/invitations-list-item.tsx
diff --git a/apps/web/core/components/workspace/sidebar/projects-list-item.tsx b/apps/web/core/components/workspace/sidebar/projects-list-item.tsx
diff --git a/apps/web/core/components/workspace/views/default-view-quick-action.tsx b/apps/web/core/components/workspace/views/default-view-quick-action.tsx
diff --git a/packages/editor/src/core/components/menus/bubble-menu/link-selector.tsx b/packages/editor/src/core/components/menus/bubble-menu/link-selector.tsx
diff --git a/packages/editor/src/core/components/menus/menu-items.ts b/packages/editor/src/core/components/menus/menu-items.ts
diff --git a/packages/propel/src/emoji-icon-picker/lucide-icons.tsx b/packages/propel/src/emoji-icon-picker/lucide-icons.tsx
diff --git a/packages/propel/src/toolbar/toolbar.stories.tsx b/packages/propel/src/toolbar/toolbar.stories.tsx
diff --git a/packages/ui/src/constants/icons.ts b/packages/ui/src/constants/icons.ts
