[WEB-4934] dev: propel button implementation (#7859)

* dev: button component code refactor

* dev: propel button component implementation

apps/admin/app/(all)/(dashboard)/ai/form.tsx

@@ -2,8 +2,9 @@
 import { FC } from "react";
 import { useForm } from "react-hook-form";
 import { Lightbulb } from "lucide-react";
+import { Button } from "@plane/propel/button";
 import { IFormattedInstanceConfiguration, TInstanceAIConfigurationKeys } from "@plane/types";
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { ControllerInput, TControllerInputFormField } from "@/components/common/controller-input";
 // hooks

apps/admin/app/(all)/(dashboard)/authentication/github/form.tsx

@@ -6,8 +6,9 @@ import Link from "next/link";
 import { useForm } from "react-hook-form";
 // plane internal packages
 import { API_BASE_URL } from "@plane/constants";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { IFormattedInstanceConfiguration, TInstanceGithubAuthenticationConfigurationKeys } from "@plane/types";
-import { Button, TOAST_TYPE, getButtonStyling, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { CodeBlock } from "@/components/common/code-block";

apps/admin/app/(all)/(dashboard)/authentication/gitlab/form.tsx

@@ -4,8 +4,9 @@ import Link from "next/link";
 import { useForm } from "react-hook-form";
 // plane internal packages
 import { API_BASE_URL } from "@plane/constants";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { IFormattedInstanceConfiguration, TInstanceGitlabAuthenticationConfigurationKeys } from "@plane/types";
-import { Button, TOAST_TYPE, getButtonStyling, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { CodeBlock } from "@/components/common/code-block";

apps/admin/app/(all)/(dashboard)/authentication/google/form.tsx

@@ -5,8 +5,9 @@ import Link from "next/link";
 import { useForm } from "react-hook-form";
 // plane internal packages
 import { API_BASE_URL } from "@plane/constants";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { IFormattedInstanceConfiguration, TInstanceGoogleAuthenticationConfigurationKeys } from "@plane/types";
-import { Button, TOAST_TYPE, getButtonStyling, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { CodeBlock } from "@/components/common/code-block";

apps/admin/app/(all)/(dashboard)/email/email-config-form.tsx

@@ -3,9 +3,10 @@
 import React, { FC, useMemo, useState } from "react";
 import { useForm } from "react-hook-form";
 // types
+import { Button } from "@plane/propel/button";
 import { IFormattedInstanceConfiguration, TInstanceEmailConfigurationKeys } from "@plane/types";
 // ui
-import { Button, CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
+import { CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { ControllerInput, TControllerInputFormField } from "@/components/common/controller-input";
 // hooks

apps/admin/app/(all)/(dashboard)/email/test-email-modal.tsx

@@ -1,9 +1,10 @@
 import React, { FC, useEffect, useState } from "react";
 import { Dialog, Transition } from "@headlessui/react";
 // plane imports
+import { Button } from "@plane/propel/button";
 import { InstanceService } from "@plane/services";
 // ui
-import { Button, Input } from "@plane/ui";
+import { Input } from "@plane/ui";
 
 type Props = {
   isOpen: boolean;

apps/admin/app/(all)/(dashboard)/general/form.tsx

@@ -4,9 +4,10 @@ import { observer } from "mobx-react";
 import { Controller, useForm } from "react-hook-form";
 import { Telescope } from "lucide-react";
 // types
+import { Button } from "@plane/propel/button";
 import { IInstance, IInstanceAdmin } from "@plane/types";
 // ui
-import { Button, Input, TOAST_TYPE, ToggleSwitch, setToast } from "@plane/ui";
+import { Input, TOAST_TYPE, ToggleSwitch, setToast } from "@plane/ui";
 // components
 import { ControllerInput } from "@/components/common/controller-input";
 import { useInstance } from "@/hooks/store";

apps/admin/app/(all)/(dashboard)/image/form.tsx

@@ -1,8 +1,9 @@
 "use client";
 import { FC } from "react";
 import { useForm } from "react-hook-form";
+import { Button } from "@plane/propel/button";
 import { IFormattedInstanceConfiguration, TInstanceImageConfigurationKeys } from "@plane/types";
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { ControllerInput } from "@/components/common/controller-input";
 // hooks

apps/admin/app/(all)/(dashboard)/workspace/create/form.tsx

@@ -4,10 +4,11 @@ import { useRouter } from "next/navigation";
 import { Controller, useForm } from "react-hook-form";
 // plane imports
 import { WEB_BASE_URL, ORGANIZATION_SIZE, RESTRICTED_URLS } from "@plane/constants";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { InstanceWorkspaceService } from "@plane/services";
 import { IWorkspace } from "@plane/types";
 // components
-import { Button, CustomSelect, getButtonStyling, Input, setToast, TOAST_TYPE } from "@plane/ui";
+import { CustomSelect, Input, setToast, TOAST_TYPE } from "@plane/ui";
 // hooks
 import { useWorkspace } from "@/hooks/store";
 

apps/admin/app/(all)/(dashboard)/workspace/page.tsx

@@ -6,8 +6,9 @@ import Link from "next/link";
 import useSWR from "swr";
 import { Loader as LoaderIcon } from "lucide-react";
 // types
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { TInstanceConfigurationKeys } from "@plane/types";
-import { Button, getButtonStyling, Loader, setPromiseToast, ToggleSwitch } from "@plane/ui";
+import { Loader, setPromiseToast, ToggleSwitch } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { WorkspaceListItem } from "@/components/workspace/list-item";

apps/admin/app/(all)/(home)/sign-in-form.tsx

@@ -5,8 +5,9 @@ import { useSearchParams } from "next/navigation";
 import { Eye, EyeOff } from "lucide-react";
 // plane internal packages
 import { API_BASE_URL, EAdminAuthErrorCodes, TAdminAuthErrorInfo } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { AuthService } from "@plane/services";
-import { Button, Input, Spinner } from "@plane/ui";
+import { Input, Spinner } from "@plane/ui";
 // components
 import { Banner } from "@/components/common/banner";
 // local components

apps/admin/ce/components/common/upgrade-button.tsx

@@ -4,7 +4,7 @@ import React from "react";
 // icons
 import { SquareArrowOutUpRight } from "lucide-react";
 // plane internal packages
-import { getButtonStyling } from "@plane/ui";
+import { getButtonStyling } from "@plane/propel/button";
 import { cn } from "@plane/utils";
 
 export const UpgradeButton: React.FC = () => (

apps/admin/core/components/authentication/github-config.tsx

@@ -6,8 +6,9 @@ import Link from "next/link";
 // icons
 import { Settings2 } from "lucide-react";
 // plane internal packages
+import { getButtonStyling } from "@plane/propel/button";
 import { TInstanceAuthenticationMethodKeys } from "@plane/types";
-import { ToggleSwitch, getButtonStyling } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 import { cn } from "@plane/utils";
 // hooks
 import { useInstance } from "@/hooks/store";

apps/admin/core/components/authentication/gitlab-config.tsx

@@ -6,8 +6,9 @@ import Link from "next/link";
 // icons
 import { Settings2 } from "lucide-react";
 // plane internal packages
+import { getButtonStyling } from "@plane/propel/button";
 import { TInstanceAuthenticationMethodKeys } from "@plane/types";
-import { ToggleSwitch, getButtonStyling } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 import { cn } from "@plane/utils";
 // hooks
 import { useInstance } from "@/hooks/store";

apps/admin/core/components/authentication/google-config.tsx

@@ -6,8 +6,9 @@ import Link from "next/link";
 // icons
 import { Settings2 } from "lucide-react";
 // plane internal packages
+import { getButtonStyling } from "@plane/propel/button";
 import { TInstanceAuthenticationMethodKeys } from "@plane/types";
-import { ToggleSwitch, getButtonStyling } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 import { cn } from "@plane/utils";
 // hooks
 import { useInstance } from "@/hooks/store";

apps/admin/core/components/common/confirm-discard-modal.tsx

@@ -5,7 +5,7 @@ import Link from "next/link";
 // headless ui
 import { Dialog, Transition } from "@headlessui/react";
 // ui
-import { Button, getButtonStyling } from "@plane/ui";
+import { Button, getButtonStyling } from "@plane/propel/button";
 
 type Props = {
   isOpen: boolean;

apps/admin/core/components/common/copy-field.tsx

@@ -3,7 +3,8 @@
 import React from "react";
 // ui
 import { Copy } from "lucide-react";
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 // icons
 
 type Props = {

apps/admin/core/components/common/empty-state.tsx

@@ -2,7 +2,7 @@
 
 import React from "react";
 import Image from "next/image";
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 
 type Props = {
   title: string;

apps/admin/core/components/instance/failure.tsx

@@ -3,7 +3,7 @@ import { FC } from "react";
 import { observer } from "mobx-react";
 import Image from "next/image";
 import { useTheme } from "next-themes";
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // assets
 import { AuthHeader } from "@/app/(all)/(home)/auth-header";
 import InstanceFailureDarkImage from "@/public/instance/instance-failure-dark.svg";

apps/admin/core/components/instance/instance-not-ready.tsx

@@ -3,7 +3,7 @@
 import { FC } from "react";
 import Image from "next/image";
 import Link from "next/link";
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // assets
 import PlaneTakeOffImage from "@/public/images/plane-takeoff.png";
 

apps/admin/core/components/instance/setup-form.tsx

@@ -6,8 +6,9 @@ import { useSearchParams } from "next/navigation";
 import { Eye, EyeOff } from "lucide-react";
 // plane internal packages
 import { API_BASE_URL, E_PASSWORD_STRENGTH } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { AuthService } from "@plane/services";
-import { Button, Checkbox, Input, PasswordStrengthIndicator, Spinner } from "@plane/ui";
+import { Checkbox, Input, PasswordStrengthIndicator, Spinner } from "@plane/ui";
 import { getPasswordStrength } from "@plane/utils";
 // components
 import { AuthHeader } from "@/app/(all)/(home)/auth-header";

apps/admin/core/components/new-user-popup.tsx

@@ -6,7 +6,7 @@ import Image from "next/image";
 import Link from "next/link";
 import { useTheme as nextUseTheme } from "next-themes";
 // ui
-import { Button, getButtonStyling } from "@plane/ui";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { resolveGeneralTheme } from "@plane/utils";
 // hooks
 import { useTheme } from "@/hooks/store";

apps/space/app/error.tsx

@@ -1,7 +1,7 @@
 "use client";
 
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 
 const ErrorPage = () => {
   const handleRetry = () => {

apps/space/core/components/account/auth-forms/email.tsx

@@ -5,9 +5,10 @@ import { observer } from "mobx-react";
 // icons
 import { CircleAlert, XCircle } from "lucide-react";
 // types
+import { Button } from "@plane/propel/button";
 import { IEmailCheckData } from "@plane/types";
 // ui
-import { Button, Input, Spinner } from "@plane/ui";
+import { Input, Spinner } from "@plane/ui";
 // helpers
 import { cn } from "@plane/utils";
 import { checkEmailValidity } from "@/helpers/string.helper";

apps/space/core/components/account/auth-forms/password.tsx

@@ -5,8 +5,9 @@ import { observer } from "mobx-react";
 import { Eye, EyeOff, XCircle } from "lucide-react";
 // plane imports
 import { API_BASE_URL, E_PASSWORD_STRENGTH } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { AuthService } from "@plane/services";
-import { Button, Input, Spinner, PasswordStrengthIndicator } from "@plane/ui";
+import { Input, Spinner, PasswordStrengthIndicator } from "@plane/ui";
 import { getPasswordStrength } from "@plane/utils";
 // types
 import { EAuthModes, EAuthSteps } from "@/types/auth";

apps/space/core/components/account/auth-forms/unique-code.tsx

@@ -4,8 +4,9 @@ import React, { useEffect, useState } from "react";
 import { CircleCheck, XCircle } from "lucide-react";
 // plane imports
 import { API_BASE_URL } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { AuthService } from "@plane/services";
-import { Button, Input, Spinner } from "@plane/ui";
+import { Input, Spinner } from "@plane/ui";
 // hooks
 import useTimer from "@/hooks/use-timer";
 // types

apps/space/core/components/editor/toolbar.tsx

@@ -3,8 +3,8 @@
 import React, { useEffect, useState, useCallback } from "react";
 // plane imports
 import { TOOLBAR_ITEMS, type ToolbarMenuItem, type EditorRefApi } from "@plane/editor";
+import { Button } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
-import { Button } from "@plane/ui";
 import { cn } from "@plane/utils";
 
 type Props = {

apps/space/core/components/instance/instance-failure-view.tsx

@@ -3,7 +3,7 @@
 import { FC } from "react";
 import Image from "next/image";
 import { useTheme } from "next-themes";
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // assets
 import InstanceFailureDarkImage from "public/instance/instance-failure-dark.svg";
 import InstanceFailureImage from "public/instance/instance-failure.svg";

apps/space/core/components/issues/filters/helpers/dropdown.tsx

@@ -5,7 +5,7 @@ import { Placement } from "@popperjs/core";
 import { usePopper } from "react-popper";
 import { Popover, Transition } from "@headlessui/react";
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 
 type Props = {
   children: React.ReactNode;

apps/space/core/components/issues/navbar/user-avatar.tsx

@@ -9,8 +9,9 @@ import { LogOut } from "lucide-react";
 import { Popover, Transition } from "@headlessui/react";
 // plane imports
 import { API_BASE_URL } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { AuthService } from "@plane/services";
-import { Avatar, Button } from "@plane/ui";
+import { Avatar } from "@plane/ui";
 import { getFileURL } from "@plane/utils";
 // helpers
 import { queryParamGenerator } from "@/helpers/query-param-generator";

apps/space/core/components/issues/peek-overview/issue-activity.tsx

@@ -5,7 +5,7 @@ import { observer } from "mobx-react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
 // plane imports
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // components
 import { AddComment } from "@/components/issues/peek-overview/comment/add-comment";
 import { CommentCard } from "@/components/issues/peek-overview/comment/comment-detail-card";

apps/web/app/(all)/[workspaceSlug]/(projects)/drafts/header.tsx

@@ -6,8 +6,9 @@ import { PenSquare } from "lucide-react";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
+import { Button } from "@plane/propel/button";
 import { EIssuesStoreType } from "@plane/types";
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 import { CountChip } from "@/components/common/count-chip";

apps/web/app/(all)/[workspaceSlug]/(projects)/header.tsx

@@ -4,7 +4,8 @@ import { observer } from "mobx-react";
 import { Home, Shapes } from "lucide-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 // hooks

apps/web/app/(all)/[workspaceSlug]/(projects)/profile/[userId]/activity/page.tsx

@@ -5,7 +5,7 @@ import { observer } from "mobx-react";
 // plane imports
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // components
 import { PageHead } from "@/components/core/page-title";
 import { DownloadActivityButton } from "@/components/profile/activity/download-button";

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(detail)/header.tsx

@@ -16,6 +16,7 @@ import {
 } from "@plane/constants";
 import { usePlatformOS } from "@plane/hooks";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { ContrastIcon } from "@plane/propel/icons";
 import { Tooltip } from "@plane/propel/tooltip";
 import {
@@ -25,7 +26,7 @@ import {
   IIssueDisplayProperties,
   EIssueLayoutTypes,
 } from "@plane/types";
-import { Breadcrumbs, Button, BreadcrumbNavigationSearchDropdown, Header } from "@plane/ui";
+import { Breadcrumbs, BreadcrumbNavigationSearchDropdown, Header } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { WorkItemsModal } from "@/components/analytics/work-items/modal";

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/cycles/(list)/header.tsx

@@ -6,7 +6,8 @@ import { useParams } from "next/navigation";
 // ui
 import { EProjectFeatureKey, EUserPermissions, EUserPermissionsLevel, CYCLE_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { CyclesViewHeader } from "@/components/cycles/cycles-view-header";
 // hooks

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(detail)/header.tsx

@@ -14,6 +14,7 @@ import {
   EProjectFeatureKey,
   WORK_ITEM_TRACKER_ELEMENTS,
 } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { DiceIcon } from "@plane/propel/icons";
 import { Tooltip } from "@plane/propel/tooltip";
 import {
@@ -23,7 +24,7 @@ import {
   IIssueDisplayProperties,
   EIssueLayoutTypes,
 } from "@plane/types";
-import { Breadcrumbs, Button, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
+import { Breadcrumbs, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { WorkItemsModal } from "@/components/analytics/work-items/modal";

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/modules/(list)/header.tsx

@@ -6,7 +6,8 @@ import { useParams } from "next/navigation";
 import { EProjectFeatureKey, EUserPermissions, EUserPermissionsLevel, MODULE_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { ModuleViewHeader } from "@/components/modules";
 // hooks

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(detail)/[pageId]/page.tsx

@@ -6,9 +6,9 @@ import Link from "next/link";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
 // plane types
+import { getButtonStyling } from "@plane/propel/button";
 import { EFileAssetType, TSearchEntityRequestPayload, TWebhookConnectionQueryParams } from "@plane/types";
 // plane ui
-import { getButtonStyling } from "@plane/ui";
 // plane utils
 import { cn } from "@plane/utils";
 // components

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/pages/(list)/header.tsx

@@ -11,9 +11,10 @@ import {
   PROJECT_TRACKER_ELEMENTS,
 } from "@plane/constants";
 // plane types
+import { Button } from "@plane/propel/button";
 import { TPage } from "@plane/types";
 // plane ui
-import { Breadcrumbs, Button, Header, setToast, TOAST_TYPE } from "@plane/ui";
+import { Breadcrumbs, Header, setToast, TOAST_TYPE } from "@plane/ui";
 // helpers
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 // hooks

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(detail)/[viewId]/header.tsx

@@ -14,6 +14,7 @@ import {
   WORK_ITEM_TRACKER_ELEMENTS,
 } from "@plane/constants";
 // types
+import { Button } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
 import {
   EIssuesStoreType,
@@ -24,7 +25,7 @@ import {
   EIssueLayoutTypes,
 } from "@plane/types";
 // ui
-import { Breadcrumbs, Button, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
+import { Breadcrumbs, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
 // components
 import { SwitcherIcon, SwitcherLabel } from "@/components/common/switcher-label";
 import { DisplayFiltersSelection, FiltersDropdown, LayoutSelection } from "@/components/issues/issue-layouts/filters";

apps/web/app/(all)/[workspaceSlug]/(projects)/projects/(detail)/[projectId]/views/(list)/header.tsx

@@ -4,7 +4,8 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // ui
 import { EProjectFeatureKey, PROJECT_VIEW_TRACKER_ELEMENTS } from "@plane/constants";
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { ViewListHeader } from "@/components/views/view-list-header";
 // hooks

apps/web/app/(all)/[workspaceSlug]/(projects)/stickies/header.tsx

@@ -3,8 +3,9 @@
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
+import { Button } from "@plane/propel/button";
 import { RecentStickyIcon } from "@plane/propel/icons";
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 import { StickySearch } from "@/components/stickies/modal/search";

apps/web/app/(all)/[workspaceSlug]/(projects)/workspace-views/header.tsx

@@ -12,6 +12,7 @@ import {
   DEFAULT_GLOBAL_VIEWS_LIST,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import {
   EIssuesStoreType,
   IIssueDisplayFilterOptions,
@@ -19,7 +20,7 @@ import {
   ICustomSearchSelectOption,
   EIssueLayoutTypes,
 } from "@plane/types";
-import { Breadcrumbs, Button, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
+import { Breadcrumbs, Header, BreadcrumbNavigationSearchDropdown } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 import { SwitcherLabel } from "@/components/common/switcher-label";

apps/web/app/(all)/[workspaceSlug]/(settings)/settings/(workspace)/members/page.tsx

@@ -12,9 +12,10 @@ import {
   MEMBER_TRACKER_EVENTS,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { IWorkspaceBulkInviteFormData } from "@plane/types";
 // ui
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";

apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/activity/page.tsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // components
 import { PageHead } from "@/components/core/page-title";
 import { DetailedEmptyState } from "@/components/empty-state/detailed-empty-state-root";

apps/web/app/(all)/[workspaceSlug]/(settings)/settings/account/security/page.tsx

@@ -7,7 +7,8 @@ import { Eye, EyeOff } from "lucide-react";
 // plane imports
 import { E_PASSWORD_STRENGTH } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, Input, PasswordStrengthIndicator, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Input, PasswordStrengthIndicator, TOAST_TYPE, setToast } from "@plane/ui";
 import { getPasswordStrength } from "@plane/utils";
 // components
 import { PageHead } from "@/components/core/page-title";

apps/web/app/(all)/[workspaceSlug]/(settings)/settings/projects/page.tsx

@@ -3,7 +3,7 @@ import Image from "next/image";
 import Link from "next/link";
 import { useTheme } from "next-themes";
 import { PROJECT_TRACKER_ELEMENTS } from "@plane/constants";
-import { Button, getButtonStyling } from "@plane/ui";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { cn } from "@plane/utils";
 import { useCommandPalette } from "@/hooks/store/use-command-palette";
 

apps/web/app/(all)/create-workspace/page.tsx

@@ -6,9 +6,9 @@ import Image from "next/image";
 import Link from "next/link";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { PlaneLogo } from "@plane/propel/icons";
 import { IWorkspace } from "@plane/types";
-import { Button, getButtonStyling } from "@plane/ui";
 // components
 import { CreateWorkspaceForm } from "@/components/workspace/create-workspace-form";
 // hooks

apps/web/app/(all)/invitations/page.tsx

@@ -10,10 +10,11 @@ import { CheckCircle2 } from "lucide-react";
 import { ROLE, MEMBER_TRACKER_EVENTS, MEMBER_TRACKER_ELEMENTS, GROUP_WORKSPACE_TRACKER_EVENT } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // types
+import { Button } from "@plane/propel/button";
 import { PlaneLogo } from "@plane/propel/icons";
 import type { IWorkspaceMemberInvitation } from "@plane/types";
 // ui
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { truncateText } from "@plane/utils";
 // components
 import { EmptyState } from "@/components/common/empty-state";

apps/web/app/(all)/profile/activity/page.tsx

@@ -4,7 +4,7 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // components
 import { PageHead } from "@/components/core/page-title";
 import { DetailedEmptyState } from "@/components/empty-state/detailed-empty-state-root";

apps/web/app/(all)/profile/security/page.tsx

@@ -7,7 +7,8 @@ import { Eye, EyeOff } from "lucide-react";
 // plane imports
 import { E_PASSWORD_STRENGTH } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, Input, PasswordStrengthIndicator, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Input, PasswordStrengthIndicator, TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { getPasswordStrength } from "@plane/utils";
 import { PageHead } from "@/components/core/page-title";

apps/web/app/error.tsx

@@ -3,7 +3,7 @@
 import Image from "next/image";
 import { useTheme } from "next-themes";
 // layouts
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 import { useAppRouter } from "@/hooks/use-app-router";
 import DefaultLayout from "@/layouts/default-layout";
 // images

apps/web/app/not-found.tsx

@@ -5,7 +5,7 @@ import { Metadata } from "next";
 import Image from "next/image";
 import Link from "next/link";
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // images
 import Image404 from "@/public/404.svg";
 

apps/web/ce/components/active-cycles/workspace-active-cycles-upgrade.tsx

@@ -7,7 +7,8 @@ import { AlertOctagon, BarChart4, CircleDashed, Folder, Microscope, Search } fro
 // plane imports
 import { MARKETING_PRICING_PAGE_LINK } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { ContentWrapper, getButtonStyling } from "@plane/ui";
+import { getButtonStyling } from "@plane/propel/button";
+import { ContentWrapper } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { ProIcon } from "@/components/common/pro-icon";

apps/web/ce/components/issues/header.tsx

@@ -14,9 +14,10 @@ import {
   EProjectFeatureKey,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
 import { EIssuesStoreType } from "@plane/types";
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { CountChip } from "@/components/common/count-chip";
 // constants

apps/web/ce/components/pages/editor/embed/issue-embed-upgrade-card.tsx

@@ -1,5 +1,5 @@
 // plane imports
-import { getButtonStyling } from "@plane/ui";
+import { getButtonStyling } from "@plane/propel/button";
 import { cn } from "@plane/utils";
 // components
 import { ProIcon } from "@/components/common/pro-icon";

apps/web/ce/components/projects/settings/intake/header.tsx

@@ -7,7 +7,8 @@ import { RefreshCcw } from "lucide-react";
 // ui
 import { EProjectFeatureKey, EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Breadcrumbs, Button, Header } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Breadcrumbs, Header } from "@plane/ui";
 // components
 import { InboxIssueCreateModalRoot } from "@/components/inbox/modals/create-modal";
 // hooks

apps/web/ce/components/workspace/billing/comparison/plan-detail.tsx

@@ -9,8 +9,9 @@ import {
   WORKSPACE_SETTINGS_TRACKER_EVENTS,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { getButtonStyling } from "@plane/propel/button";
 import { EProductSubscriptionEnum, TBillingFrequency } from "@plane/types";
-import { getButtonStyling, getUpgradeButtonStyle } from "@plane/ui";
+import { getUpgradeButtonStyle } from "@plane/ui";
 import { cn, getSubscriptionName } from "@plane/utils";
 // components
 import { DiscountInfo } from "@/components/license/modal/card/discount-info";

apps/web/ce/components/workspace/delete-workspace-section.tsx

@@ -4,9 +4,10 @@ import { ChevronDown, ChevronUp } from "lucide-react";
 // types
 import { WORKSPACE_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { IWorkspace } from "@plane/types";
 // ui
-import { Button, Collapsible } from "@plane/ui";
+import { Collapsible } from "@plane/ui";
 import { DeleteWorkspaceModal } from "./delete-workspace-modal";
 // components
 

apps/web/ce/components/workspace/edition-badge.tsx

@@ -2,8 +2,8 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 // ui
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
-import { Button } from "@plane/ui";
 // hooks
 import { usePlatformOS } from "@/hooks/use-platform-os";
 import packageJson from "package.json";

apps/web/core/components/account/auth-forms/email.tsx

@@ -6,8 +6,9 @@ import { observer } from "mobx-react";
 import { CircleAlert, XCircle } from "lucide-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { IEmailCheckData } from "@plane/types";
-import { Button, Input, Spinner } from "@plane/ui";
+import { Input, Spinner } from "@plane/ui";
 import { cn, checkEmailValidity } from "@plane/utils";
 // helpers
 type TAuthEmailForm = {

apps/web/core/components/account/auth-forms/forgot-password.tsx

@@ -9,7 +9,8 @@ import { CircleCheck } from "lucide-react";
 // plane imports
 import { AUTH_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, Input, TOAST_TYPE, getButtonStyling, setToast } from "@plane/ui";
+import { Button, getButtonStyling } from "@plane/propel/button";
+import { Input, TOAST_TYPE, setToast } from "@plane/ui";
 import { cn, checkEmailValidity } from "@plane/utils";
 // helpers
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";

apps/web/core/components/account/auth-forms/password.tsx

@@ -8,7 +8,8 @@ import { Eye, EyeOff, Info, X, XCircle } from "lucide-react";
 // plane imports
 import { API_BASE_URL, E_PASSWORD_STRENGTH, AUTH_TRACKER_EVENTS, AUTH_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, Input, PasswordStrengthIndicator, Spinner } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Input, PasswordStrengthIndicator, Spinner } from "@plane/ui";
 import { getPasswordStrength } from "@plane/utils";
 // components
 import { ForgotPasswordPopover } from "@/components/account/auth-forms/forgot-password-popover";

apps/web/core/components/account/auth-forms/reset-password.tsx

@@ -8,7 +8,8 @@ import { Eye, EyeOff } from "lucide-react";
 // ui
 import { API_BASE_URL, E_PASSWORD_STRENGTH } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, Input, PasswordStrengthIndicator } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Input, PasswordStrengthIndicator } from "@plane/ui";
 // components
 import { getPasswordStrength } from "@plane/utils";
 // helpers

apps/web/core/components/account/auth-forms/set-password.tsx

@@ -8,7 +8,8 @@ import { Eye, EyeOff } from "lucide-react";
 // plane imports
 import { AUTH_TRACKER_ELEMENTS, AUTH_TRACKER_EVENTS, E_PASSWORD_STRENGTH } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, Input, PasswordStrengthIndicator, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Input, PasswordStrengthIndicator, TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { getPasswordStrength } from "@plane/utils";
 // helpers

apps/web/core/components/account/auth-forms/unique-code.tsx

@@ -4,7 +4,8 @@ import React, { useEffect, useState } from "react";
 import { CircleCheck, XCircle } from "lucide-react";
 import { API_BASE_URL, AUTH_TRACKER_ELEMENTS, AUTH_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, Input, Spinner } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Input, Spinner } from "@plane/ui";
 // constants
 // helpers
 import { EAuthModes } from "@/helpers/authentication.helper";

apps/web/core/components/account/deactivate-account-modal.tsx

@@ -6,7 +6,8 @@ import { Dialog, Transition } from "@headlessui/react";
 import { PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useUser } from "@/hooks/store/user";

apps/web/core/components/analytics/insight-table/root.tsx

@@ -1,8 +1,8 @@
 import { ColumnDef, Row, Table } from "@tanstack/react-table";
 import { Download } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { AnalyticsTableDataMap, TAnalyticsTabsBase } from "@plane/types";
-import { Button } from "@plane/ui";
 import { DataTable } from "./data-table";
 import { TableLoader } from "./loader";
 interface InsightTableProps<T extends Exclude<TAnalyticsTabsBase, "overview">> {

apps/web/core/components/analytics/work-items/priority-chart.tsx

@@ -14,10 +14,10 @@ import {
   EChartModels,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { BarChart } from "@plane/propel/charts/bar-chart";
 import { TBarItem, TChart, TChartDatum, ChartXAxisProperty, ChartYAxisMetric } from "@plane/types";
 // plane web components
-import { Button } from "@plane/ui";
 import { generateExtendedColors, parseChartData } from "@/components/chart/utils";
 // hooks
 import { useAnalytics } from "@/hooks/store/use-analytics";

apps/web/core/components/api-token/empty-state.tsx

@@ -3,7 +3,7 @@
 import React from "react";
 import Image from "next/image";
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // assets
 import emptyApiTokens from "@/public/empty-state/api-token.svg";
 

apps/web/core/components/api-token/modal/form.tsx

@@ -6,9 +6,10 @@ import { Controller, useForm } from "react-hook-form";
 import { Calendar } from "lucide-react";
 // types
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { IApiToken } from "@plane/types";
 // ui
-import { Button, CustomSelect, Input, TextArea, ToggleSwitch, TOAST_TYPE, setToast } from "@plane/ui";
+import { CustomSelect, Input, TextArea, ToggleSwitch, TOAST_TYPE, setToast } from "@plane/ui";
 import { cn, renderFormattedDate, renderFormattedTime } from "@plane/utils";
 // components
 import { DateDropdown } from "@/components/dropdowns/date";

apps/web/core/components/api-token/modal/generated-token-details.tsx

@@ -2,10 +2,11 @@
 
 import { Copy } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
 import { IApiToken } from "@plane/types";
 // ui
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { renderFormattedDate, renderFormattedTime, copyTextToClipboard } from "@plane/utils";
 // helpers
 // types

apps/web/core/components/auth-screens/project/join-project.tsx

@@ -4,7 +4,7 @@ import Image from "next/image";
 import { useParams } from "next/navigation";
 import { ClipboardList } from "lucide-react";
 // plane imports
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // hooks
 import { useProject } from "@/hooks/store/use-project";
 import { useUserPermissions } from "@/hooks/store/user";

apps/web/core/components/auth-screens/workspace/not-a-member.tsx

@@ -2,7 +2,7 @@
 
 import Link from "next/link";
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 // layouts
 import DefaultLayout from "@/layouts/default-layout";
 

apps/web/core/components/automation/select-month-modal.tsx

@@ -6,9 +6,10 @@ import { useParams } from "next/navigation";
 import { Controller, useForm } from "react-hook-form";
 // headless ui
 import { Dialog, Transition } from "@headlessui/react";
+import { Button } from "@plane/propel/button";
 import type { IProject } from "@plane/types";
 // ui
-import { Button, Input } from "@plane/ui";
+import { Input } from "@plane/ui";
 // types
 
 // types

apps/web/core/components/common/empty-state.tsx

@@ -4,7 +4,7 @@ import React from "react";
 import Image from "next/image";
 
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 
 type Props = {
   title: string;

apps/web/core/components/common/new-empty-state.tsx

@@ -4,7 +4,7 @@ import React, { useState } from "react";
 import Image from "next/image";
 
 // ui
-import { Button } from "@plane/ui";
+import { Button } from "@plane/propel/button";
 
 type Props = {
   title: string;

apps/web/core/components/core/description-versions/modal.tsx

@@ -4,19 +4,10 @@ import { ChevronLeft, ChevronRight, Copy } from "lucide-react";
 // plane imports
 import type { EditorRefApi } from "@plane/editor";
 import { useTranslation } from "@plane/i18n";
+import { Button, getButtonStyling } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
 import { TDescriptionVersion } from "@plane/types";
-import {
+import { Avatar, EModalPosition, EModalWidth, Loader, ModalCore, setToast, TOAST_TYPE } from "@plane/ui";
-  Avatar,
-  Button,
-  EModalPosition,
-  EModalWidth,
-  getButtonStyling,
-  Loader,
-  ModalCore,
-  setToast,
-  TOAST_TYPE,
-} from "@plane/ui";
 import { calculateTimeAgo, cn, copyTextToClipboard, getFileURL } from "@plane/utils";
 // components
 import { RichTextEditor } from "@/components/editor/rich-text";

apps/web/core/components/core/filters/date-filter-modal.tsx

@@ -5,8 +5,8 @@ import { Controller, useForm } from "react-hook-form";
 import { X } from "lucide-react";
 import { Dialog, Transition } from "@headlessui/react";
 
+import { Button } from "@plane/propel/button";
 import { Calendar } from "@plane/propel/calendar";
-import { Button } from "@plane/ui";
 
 import { renderFormattedPayloadDate, renderFormattedDate, getDate } from "@plane/utils";
 import { DateFilterSelect } from "./date-filter-select";

apps/web/core/components/core/image-picker-popover.tsx

@@ -11,8 +11,9 @@ import { Tab, Popover } from "@headlessui/react";
 // plane imports
 import { ACCEPTED_COVER_IMAGE_MIME_TYPES_FOR_REACT_DROPZONE, MAX_FILE_SIZE } from "@plane/constants";
 import { useOutsideClickDetector } from "@plane/hooks";
+import { Button } from "@plane/propel/button";
 import { EFileAssetType } from "@plane/types";
-import { Button, Input, Loader, TOAST_TYPE, setToast } from "@plane/ui";
+import { Input, Loader, TOAST_TYPE, setToast } from "@plane/ui";
 // helpers
 import { getFileURL } from "@plane/utils";
 // hooks

apps/web/core/components/core/modals/bulk-delete-issues-modal.tsx

@@ -8,8 +8,9 @@ import { Search } from "lucide-react";
 import { Combobox, Dialog, Transition } from "@headlessui/react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { EIssuesStoreType, ISearchIssueResponse, IUser } from "@plane/types";
-import { Button, Loader, TOAST_TYPE, setToast } from "@plane/ui";
+import { Loader, TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { SimpleEmptyState } from "@/components/empty-state/simple-empty-state-root";
 // hooks

apps/web/core/components/core/modals/existing-issues-list-modal.tsx

@@ -6,10 +6,11 @@ import { Combobox, Dialog, Transition } from "@headlessui/react";
 // i18n
 import { useTranslation } from "@plane/i18n";
 // types
+import { Button } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
 import { ISearchIssueResponse, TProjectIssuesSearchParams } from "@plane/types";
 // ui
-import { Button, Loader, ToggleSwitch, TOAST_TYPE, setToast } from "@plane/ui";
+import { Loader, ToggleSwitch, TOAST_TYPE, setToast } from "@plane/ui";
 import { generateWorkItemLink, getTabIndex } from "@plane/utils";
 // helpers
 // hooks

apps/web/core/components/core/modals/gpt-assistant-popover.tsx

@@ -8,7 +8,8 @@ import { AlertCircle } from "lucide-react";
 import { Popover, Transition } from "@headlessui/react";
 // plane imports
 import type { EditorRefApi } from "@plane/editor";
-import { Button, Input, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { Input, TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import { RichTextEditor } from "@/components/editor/rich-text";
 // services

apps/web/core/components/core/modals/user-image-upload-modal.tsx

@@ -7,8 +7,9 @@ import { UserCircle2 } from "lucide-react";
 import { Transition, Dialog } from "@headlessui/react";
 // plane imports
 import { ACCEPTED_AVATAR_IMAGE_MIME_TYPES_FOR_REACT_DROPZONE, MAX_FILE_SIZE } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { EFileAssetType } from "@plane/types";
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { getAssetIdFromUrl, getFileURL, checkURLValidity } from "@plane/utils";
 // helpers
 // services

apps/web/core/components/core/modals/workspace-image-upload-modal.tsx

@@ -7,8 +7,9 @@ import { UserCircle2 } from "lucide-react";
 import { Transition, Dialog } from "@headlessui/react";
 // plane imports
 import { ACCEPTED_AVATAR_IMAGE_MIME_TYPES_FOR_REACT_DROPZONE, MAX_FILE_SIZE } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { EFileAssetType } from "@plane/types";
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 import { getAssetIdFromUrl, getFileURL, checkURLValidity } from "@plane/utils";
 // helpers
 // hooks

apps/web/core/components/core/theme/custom-theme-selector.tsx

@@ -6,9 +6,10 @@ import { Controller, useForm } from "react-hook-form";
 // types
 import { PROFILE_SETTINGS_TRACKER_ELEMENTS, PROFILE_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { IUserTheme } from "@plane/types";
 // ui
-import { Button, InputColorPicker, setPromiseToast } from "@plane/ui";
+import { InputColorPicker, setPromiseToast } from "@plane/ui";
 // hooks
 import { captureElementAndEvent } from "@/helpers/event-tracker.helper";
 import { useUserProfile } from "@/hooks/store/user";

apps/web/core/components/cycles/archived-cycles/modal.tsx

@@ -4,7 +4,8 @@ import { useState, Fragment } from "react";
 import { Dialog, Transition } from "@headlessui/react";
 // ui
 import { CYCLE_TRACKER_EVENTS } from "@plane/constants";
-import { Button, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useCycle } from "@/hooks/store/use-cycle";

apps/web/core/components/cycles/form.tsx

@@ -6,9 +6,10 @@ import { Controller, useForm } from "react-hook-form";
 import { ETabIndices } from "@plane/constants";
 // types
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { ICycle } from "@plane/types";
 // ui
-import { Button, Input, TextArea } from "@plane/ui";
+import { Input, TextArea } from "@plane/ui";
 import { getDate, renderFormattedPayloadDate, getTabIndex } from "@plane/utils";
 // components
 import { DateRangeDropdown } from "@/components/dropdowns/date-range";

apps/web/core/components/cycles/transfer-issues.tsx

@@ -2,8 +2,8 @@
 import React from "react";
 import { AlertCircle } from "lucide-react";
 // ui
+import { Button } from "@plane/propel/button";
 import { TransferIcon } from "@plane/propel/icons";
-import { Button } from "@plane/ui";
 
 type Props = {
   handleClick: () => void;

apps/web/core/components/editor/lite-text/toolbar.tsx

@@ -8,8 +8,8 @@ import type { EditorRefApi } from "@plane/editor";
 // i18n
 import { useTranslation } from "@plane/i18n";
 // ui
+import { Button } from "@plane/propel/button";
 import { Tooltip } from "@plane/propel/tooltip";
-import { Button } from "@plane/ui";
 // constants
 import { cn } from "@plane/utils";
 import { TOOLBAR_ITEMS, ToolbarMenuItem } from "@/constants/editor";

apps/web/core/components/empty-state/comic-box-button.tsx

@@ -5,7 +5,7 @@ import { usePopper } from "react-popper";
 import { Popover } from "@headlessui/react";
 // popper
 // helper
-import { getButtonStyling } from "@plane/ui";
+import { getButtonStyling } from "@plane/propel/button";
 
 type Props = {
   label: string;

apps/web/core/components/empty-state/detailed-empty-state-root.tsx

@@ -4,7 +4,7 @@ import React from "react";
 import { observer } from "mobx-react";
 import Image from "next/image";
 // ui
-import { Button } from "@plane/ui/src/button";
+import { Button } from "@plane/propel/button";
 // utils
 import { cn } from "@plane/utils";
 

apps/web/core/components/estimates/create/modal.tsx

@@ -6,8 +6,9 @@ import { ChevronLeft } from "lucide-react";
 // plane imports
 import { EEstimateSystem, ESTIMATE_SYSTEMS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { IEstimateFormData, TEstimateSystemKeys, TEstimatePointsObject, TEstimateTypeError } from "@plane/types";
-import { Button, EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
 import { useProjectEstimates } from "@/hooks/store/estimates";
 // local imports

apps/web/core/components/estimates/delete/modal.tsx

@@ -4,7 +4,8 @@ import { FC, useState } from "react";
 import { observer } from "mobx-react";
 // ui
 import { PROJECT_SETTINGS_TRACKER_EVENTS } from "@plane/constants";
-import { Button, EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useProjectEstimates } from "@/hooks/store/estimates";

apps/web/core/components/estimates/points/create-root.tsx

@@ -5,8 +5,9 @@ import { observer } from "mobx-react";
 import { Plus } from "lucide-react";
 // plane imports
 import { estimateCount } from "@plane/constants";
+import { Button } from "@plane/propel/button";
 import { TEstimatePointsObject, TEstimateSystemKeys, TEstimateTypeError } from "@plane/types";
-import { Button, Sortable } from "@plane/ui";
+import { Sortable } from "@plane/ui";
 // local imports
 import { EstimatePointCreate } from "./create";
 import { EstimatePointItemPreview } from "./preview";

apps/web/core/components/exporter/export-form.tsx

@@ -9,7 +9,8 @@ import {
   WORKSPACE_SETTINGS_TRACKER_ELEMENTS,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { Button, CustomSearchSelect, CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
+import { Button } from "@plane/propel/button";
+import { CustomSearchSelect, CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useProject } from "@/hooks/store/use-project";
 import { useUser, useUserPermissions } from "@/hooks/store/user";

apps/web/core/components/exporter/export-modal.tsx

@@ -7,9 +7,10 @@ import { useParams } from "next/navigation";
 import { Dialog, Transition } from "@headlessui/react";
 // types
 import { useTranslation } from "@plane/i18n";
+import { Button } from "@plane/propel/button";
 import { IUser, IImporterService } from "@plane/types";
 // ui
-import { Button, CustomSearchSelect, TOAST_TYPE, setToast } from "@plane/ui";
+import { CustomSearchSelect, TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
 import { useProject } from "@/hooks/store/use-project";
 import { useUser } from "@/hooks/store/user";

apps/web/core/components/exporter/single-export.tsx

@@ -2,8 +2,8 @@
 
 import { useState, FC } from "react";
 // ui
+import { Button } from "@plane/propel/button";
 import { IExportData } from "@plane/types";
-import { Button } from "@plane/ui";
 // helpers
 import { getDate, renderFormattedDate } from "@plane/utils";
 // types

apps/web/core/components/global/product-updates/footer.tsx

@@ -1,8 +1,8 @@
 import { USER_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 // ui
+import { getButtonStyling } from "@plane/propel/button";
 import { PlaneLogo } from "@plane/propel/icons";
-import { getButtonStyling } from "@plane/ui";
 // helpers
 import { cn } from "@plane/utils";