refactor: actions icon migration (#8219)

* chore: gitignore updated

* chore: check icon added to propel package

* feat: search icon migration

* chore: check icon migration

* chore: plus icon added to propel package

* chore: code refactor

* chore: plus icon migration and code refactor

* chore: trash icon added to propel package

* chore: code refactor

* chore: trash icon migration

* chore: edit icon added to propel package

* chore: new tab icon added to propel package

* chore: edit icon migration

* chore: newtab icon migration

* chore: lock icon added to propel package

* chore: lock icon migration

* chore: globe icon added to propel package

* chore: globe icon migration

* chore: copy icon added to propel package

* chore: copy icon migration

* chore: link icon added to propel package

* chore: link icon migration

* chore: link icon migration

* chore: info icon added to propel package

* chore: code refactor

* chore: code refactor

* chore: code refactor

* chore: code refactor
This commit is contained in:
Anmol Singh Bhatia 2025-12-26 17:19:15 +05:30 committed by GitHub
parent 92ac28fcb8
commit 2980c2d76b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
215 changed files with 932 additions and 729 deletions

View file

@ -32,7 +32,6 @@ import {
Camera,
CameraOff,
Cast,
Check,
CheckCircle,
CheckSquare,
Clipboard,
@ -50,7 +49,6 @@ import {
Columns,
Command,
Compass,
Copy,
CornerDownLeft,
CornerDownRight,
CornerLeftDown,
@ -77,7 +75,6 @@ import {
Edit,
Edit2,
Edit3,
ExternalLink,
Eye,
EyeOff,
Facebook,
@ -103,7 +100,6 @@ import {
GitPullRequest,
Github,
Gitlab,
Globe,
Grid,
HardDrive,
Hash,
@ -121,12 +117,9 @@ import {
Layers,
Layout,
LifeBuoy,
Link,
Link2,
Linkedin,
List,
Loader,
Lock,
LogIn,
LogOut,
Mail,
@ -148,10 +141,21 @@ import {
CircleChevronDown,
UsersRound,
ToggleLeft,
Search,
User,
} from "lucide-react";
import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ChevronUpIcon } from "@plane/propel/icons";
import {
LinkIcon,
CopyIcon,
GlobeIcon,
LockIcon,
NewTabIcon,
CheckIcon,
SearchIcon,
ChevronDownIcon,
ChevronLeftIcon,
ChevronRightIcon,
ChevronUpIcon,
} from "@plane/propel/icons";
export const MATERIAL_ICONS_LIST = [
{
@ -794,7 +798,7 @@ export const LUCIDE_ICONS_LIST = [
{ name: "CameraOff", element: CameraOff },
{ name: "Cast", element: Cast },
{ name: "CircleChevronDown", element: CircleChevronDown },
{ name: "Check", element: Check },
{ name: "Check", element: CheckIcon },
{ name: "CheckCircle", element: CheckCircle },
{ name: "CheckSquare", element: CheckSquare },
{ name: "ChevronDown", element: ChevronDownIcon },
@ -816,7 +820,7 @@ export const LUCIDE_ICONS_LIST = [
{ name: "Columns", element: Columns },
{ name: "Command", element: Command },
{ name: "Compass", element: Compass },
{ name: "Copy", element: Copy },
{ name: "Copy", element: CopyIcon },
{ name: "CornerDownLeft", element: CornerDownLeft },
{ name: "CornerDownRight", element: CornerDownRight },
{ name: "CornerLeftDown", element: CornerLeftDown },
@ -843,7 +847,7 @@ export const LUCIDE_ICONS_LIST = [
{ name: "Edit", element: Edit },
{ name: "Edit2", element: Edit2 },
{ name: "Edit3", element: Edit3 },
{ name: "ExternalLink", element: ExternalLink },
{ name: "ExternalLink", element: NewTabIcon },
{ name: "Eye", element: Eye },
{ name: "EyeOff", element: EyeOff },
{ name: "Facebook", element: Facebook },
@ -869,7 +873,7 @@ export const LUCIDE_ICONS_LIST = [
{ name: "GitPullRequest", element: GitPullRequest },
{ name: "Github", element: Github },
{ name: "Gitlab", element: Gitlab },
{ name: "Globe", element: Globe },
{ name: "Globe", element: GlobeIcon },
{ name: "Grid", element: Grid },
{ name: "HardDrive", element: HardDrive },
{ name: "Hash", element: Hash },
@ -887,12 +891,12 @@ export const LUCIDE_ICONS_LIST = [
{ name: "Layers", element: Layers },
{ name: "Layout", element: Layout },
{ name: "LifeBuoy", element: LifeBuoy },
{ name: "Link", element: Link },
{ name: "Link2", element: Link2 },
{ name: "Link", element: LinkIcon },
{ name: "Link2", element: LinkIcon },
{ name: "Linkedin", element: Linkedin },
{ name: "List", element: List },
{ name: "Loader", element: Loader },
{ name: "Lock", element: Lock },
{ name: "Lock", element: LockIcon },
{ name: "LogIn", element: LogIn },
{ name: "LogOut", element: LogOut },
{ name: "Mail", element: Mail },
@ -911,7 +915,7 @@ export const LUCIDE_ICONS_LIST = [
{ name: "Minus", element: Minus },
{ name: "MinusCircle", element: MinusCircle },
{ name: "MinusSquare", element: MinusSquare },
{ name: "Search", element: Search },
{ name: "Search", element: SearchIcon },
{ name: "ToggleLeft", element: ToggleLeft },
{ name: "User", element: User },
{ name: "UsersRound", element: UsersRound },

View file

@ -1,7 +1,6 @@
import { Combobox } from "@headlessui/react";
import { Search } from "lucide-react";
import type { FC } from "react";
import React, { useEffect, useRef } from "react";
import { SearchIcon } from "@plane/propel/icons";
// helpers
import { cn } from "../../utils";
@ -43,7 +42,7 @@ export function InputSearch(props: IInputSearch) {
inputContainerClassName
)}
>
{inputIcon ? <>{inputIcon}</> : <Search className="h-4 w-4 text-tertiary" aria-hidden="true" />}
{inputIcon ? <>{inputIcon}</> : <SearchIcon className="h-4 w-4 text-tertiary" aria-hidden="true" />}
<Combobox.Input
as="input"
ref={inputRef}

View file

@ -1,6 +1,7 @@
import { Combobox } from "@headlessui/react";
import { Check } from "lucide-react";
import React from "react";
import { CheckIcon } from "@plane/propel/icons";
// helpers
import { cn } from "../../utils";
// types
@ -69,7 +70,7 @@ export function DropdownOptions(props: IMultiSelectDropdownOptions | ISingleSele
) : (
<>
<span className="flex-grow truncate">{option.value}</span>
{selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
{selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
</>
)}
</>

View file

@ -1,10 +1,10 @@
import { Combobox } from "@headlessui/react";
import { Check, Info, Search } from "lucide-react";
import { Info } from "lucide-react";
import React, { useRef, useState } from "react";
import { createPortal } from "react-dom";
import { usePopper } from "react-popper";
import { useOutsideClickDetector } from "@plane/hooks";
import { ChevronDownIcon } from "@plane/propel/icons";
import { CheckIcon, SearchIcon, ChevronDownIcon } from "@plane/propel/icons";
// plane imports
// local imports
import { Tooltip } from "@plane/propel/tooltip";
@ -148,7 +148,7 @@ export function CustomSearchSelect(props: ICustomSearchSelectProps) {
{...attributes.popper}
>
<div className="flex items-center gap-1.5 rounded-sm border border-subtle px-2 mx-2">
<Search className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
<SearchIcon className="h-3.5 w-3.5 text-placeholder" strokeWidth={1.5} />
<Combobox.Input
className="w-full bg-transparent py-1 text-11 text-secondary placeholder:text-placeholder focus:outline-none"
value={query}
@ -190,7 +190,7 @@ export function CustomSearchSelect(props: ICustomSearchSelectProps) {
{({ selected }) => (
<>
<span className="flex-grow truncate">{option.content}</span>
{selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
{selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
{option.tooltip && (
<>
{typeof option.tooltip === "string" ? (

View file

@ -1,10 +1,10 @@
import { Combobox } from "@headlessui/react";
import { Check } from "lucide-react";
import React, { createContext, useCallback, useContext, useRef, useState } from "react";
import { createPortal } from "react-dom";
import { usePopper } from "react-popper";
import { useOutsideClickDetector } from "@plane/hooks";
import { ChevronDownIcon } from "@plane/propel/icons";
import { CheckIcon, ChevronDownIcon } from "@plane/propel/icons";
// plane helpers
// hooks
import { useDropdownKeyDown } from "../hooks/use-dropdown-key-down";
@ -172,7 +172,7 @@ function Option(props: ICustomSelectItemProps) {
{({ selected }) => (
<div className="flex items-center justify-between gap-2 w-full">
{children}
{selected && <Check className="h-3.5 w-3.5 flex-shrink-0" />}
{selected && <CheckIcon className="h-3.5 w-3.5 flex-shrink-0" />}
</div>
)}
</Combobox.Option>