[WEB-4976]chore: propel toast implementation (#4265)

* draft: implementation * chore: migrated toast from @plane/ui to propel package * chore: reverted unwanted changes * fix: lint errors * chore: migrated toast from @plane/ui to @plane/propel * chore: updated toast type
2025-10-08 18:23:12 +05:30
parent ae637a7496
commit 7572fc4efd
247 changed files with 383 additions and 322 deletions
@@ -3,8 +3,8 @@ import Link from "next/link";
 import { useForm } from "react-hook-form";
 // plane internal packages
 import { Button, getButtonStyling } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { IFormattedInstanceConfiguration, TInstanceOIDCAuthenticationConfigurationKeys } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { CodeBlock } from "@/components/common/code-block";
@@ -5,7 +5,8 @@ import { observer } from "mobx-react";
 import Image from "next/image";
 import useSWR from "swr";
 // ui
-import { Loader, ToggleSwitch, setPromiseToast } from "@plane/ui";
+import { setPromiseToast } from "@plane/propel/toast";
+import { Loader, ToggleSwitch } from "@plane/ui";
 // components
 import { AuthenticationMethodCard } from "@/components/authentication/authentication-method-card";
 import { PageHeader } from "@/components/common/page-header";
@@ -3,8 +3,9 @@ import Link from "next/link";
 import { Controller, useForm } from "react-hook-form";
 // plane internal packages
 import { Button, getButtonStyling } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { IFormattedInstanceConfiguration, TInstanceSAMLAuthenticationConfigurationKeys } from "@plane/types";
-import { TOAST_TYPE, TextArea, setToast } from "@plane/ui";
+import { TextArea } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { CodeBlock } from "@/components/common/code-block";
@@ -5,7 +5,8 @@ import { observer } from "mobx-react";
 import Image from "next/image";
 import useSWR from "swr";
 // ui
-import { Loader, ToggleSwitch, setPromiseToast } from "@plane/ui";
+import { setPromiseToast } from "@plane/propel/toast";
+import { Loader, ToggleSwitch } from "@plane/ui";
 // components
 import { AuthenticationMethodCard } from "@/components/authentication/authentication-method-card";
 import { PageHeader } from "@/components/common/page-header";
@@ -5,8 +5,8 @@ import { FormProvider, useForm } from "react-hook-form";
 // plane imports
 import type { EditorRefApi } from "@plane/editor";
 import { PlaneLogo } from "@plane/propel/icons";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import type { IProject } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { cn } from "@plane/utils";
 // plane web imports
 import { useIntake } from "@/plane-web/hooks/store/use-intake";
@@ -4,16 +4,9 @@ import { useParams } from "next/navigation";
 import { Eye, LayoutGrid, Pencil, Plus } from "lucide-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EWidgetChartModels, EWidgetChartTypes, ICustomSearchSelectOption } from "@plane/types";
-import {
-  BreadcrumbNavigationSearchDropdown,
-  Breadcrumbs,
-  Button,
-  getButtonStyling,
-  Header,
-  setToast,
-  TOAST_TYPE,
-} from "@plane/ui";
+import { BreadcrumbNavigationSearchDropdown, Breadcrumbs, Button, getButtonStyling, Header } from "@plane/ui";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 import { SwitcherLabel } from "@/components/common/switcher-label";
@@ -6,16 +6,9 @@ import { observer } from "mobx-react";
 import { Activity, Repeat } from "lucide-react";
 import { AUTOMATION_TRACKER_ELEMENTS, AUTOMATION_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EAutomationSidebarTab, ICustomSearchSelectOption } from "@plane/types";
-import {
-  BreadcrumbNavigationSearchDropdown,
-  Breadcrumbs,
-  Button,
-  Header,
-  setToast,
-  TOAST_TYPE,
-  Tooltip,
-} from "@plane/ui";
+import { BreadcrumbNavigationSearchDropdown, Breadcrumbs, Button, Header, Tooltip } from "@plane/ui";
 // hooks
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
 import { SwitcherLabel } from "@/components/common/switcher-label";
@@ -6,8 +6,9 @@ import { useParams } from "next/navigation";
 // plane imports
 import { E_FEATURE_FLAGS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setPromiseToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { setPromiseToast, ToggleSwitch } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 import { cn } from "@plane/utils";
 // component
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
@@ -6,9 +6,10 @@ import { useParams } from "next/navigation";
 import { INITIATIVE_TRACKER_EVENTS, INITIATIVES_TRACKER_ELEMENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { InitiativeIcon } from "@plane/propel/icons";
+import { setPromiseToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
 // component
-import { setPromiseToast, ToggleSwitch } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
 import { PageHead } from "@/components/core/page-title";
 import { SettingsContentWrapper } from "@/components/settings/content-wrapper";
@@ -10,8 +10,8 @@ import { Cloud } from "lucide-react";
 import { E_FEATURE_FLAGS } from "@plane/constants";
 import { SILO_ERROR_CODES } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { E_INTEGRATION_KEYS } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { UserAuthentication, IntegrationRoot } from "@/plane-web/components/integrations/github";
 // plane web hooks
 import { useFlag, useGithubIntegration, useWorkspaceSubscription } from "@/plane-web/hooks/store";
@@ -8,8 +8,9 @@ import { Cloud } from "lucide-react";
 import { E_FEATURE_FLAGS } from "@plane/constants";
 import { SILO_ERROR_CODES } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { E_INTEGRATION_KEYS } from "@plane/types";
-import { Loader, TOAST_TYPE, setToast } from "@plane/ui";
+import { Loader } from "@plane/ui";
 import { GithubHeader, IntegrationRoot, UserAuthentication } from "@/plane-web/components/integrations/github";
 // plane web hooks
 import { useFlag, useGithubIntegration, useWorkspaceSubscription } from "@/plane-web/hooks/store";
@@ -8,8 +8,9 @@ import { Cloud } from "lucide-react";
 import { E_FEATURE_FLAGS } from "@plane/constants";
 import { SILO_ERROR_CODES } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { E_INTEGRATION_KEYS } from "@plane/types";
-import { Loader, setToast, TOAST_TYPE } from "@plane/ui";
+import { Loader } from "@plane/ui";
 import { UserAuthentication, IntegrationRoot, GitlabHeader } from "@/plane-web/components/integrations/gitlab";
 // plane web hooks
 import { useFlag, useGitlabIntegration, useWorkspaceSubscription } from "@/plane-web/hooks/store";
@@ -8,8 +8,9 @@ import { Cloud } from "lucide-react";
 // plane web components
 import { SILO_ERROR_CODES } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { E_INTEGRATION_KEYS } from "@plane/types";
-import { Loader, setToast, TOAST_TYPE } from "@plane/ui";
+import { Loader } from "@plane/ui";
 import { SentryIntegrationRoot } from "@/plane-web/components/integrations/sentry";
 //  plane web hooks
 import { useFlag, useWorkspaceSubscription } from "@/plane-web/hooks/store";
@@ -9,8 +9,9 @@ import { Cloud } from "lucide-react";
 import { E_FEATURE_FLAGS } from "@plane/constants";
 import { SILO_ERROR_CODES } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { E_INTEGRATION_KEYS } from "@plane/types";
-import { Loader, setToast, TOAST_TYPE } from "@plane/ui";
+import { Loader } from "@plane/ui";
 import { SlackIntegrationRoot } from "@/plane-web/components/integrations/slack";
 //  plane web hooks
 import { useFlag, useWorkspaceSubscription } from "@/plane-web/hooks/store";
@@ -6,8 +6,8 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import useSWR from "swr";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TApplication } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
 import { PageHead } from "@/components/core/page-title";
 // hooks
@@ -8,8 +8,8 @@ import { useParams } from "next/navigation";
 import useSWR from "swr";
 import { ChevronLeftIcon } from "lucide-react";
 import { EUserPermissions, EUserPermissionsLevel } from "@plane/constants";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TUserApplication } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
 import { PageHead } from "@/components/core/page-title";
 import { APPLICATION_CATEGORIES_LIST } from "@/constants/fetch-keys";
@@ -11,8 +11,9 @@ import {
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { PiIcon } from "@plane/propel/icons";
+import { setPromiseToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { setPromiseToast, ToggleSwitch } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 // component
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
 import { PageHead } from "@/components/core/page-title";
@@ -7,8 +7,9 @@ import { useParams } from "next/navigation";
 import { TEAMSPACE_TRACKER_ELEMENTS, TEAMSPACE_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { TeamsIcon } from "@plane/propel/icons";
+import { setPromiseToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { setPromiseToast, ToggleSwitch, Tooltip } from "@plane/ui";
+import { ToggleSwitch, Tooltip } from "@plane/ui";
 // component
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
 import { PageHead } from "@/components/core/page-title";
@@ -5,7 +5,7 @@ import { useEffect } from "react";
 import { useSearchParams } from "next/navigation";
 import { SILO_ERROR_CODES } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // components
 import { PageHead } from "@/components/core/page-title";
 import { SettingsHeading } from "@/components/settings/heading";
@@ -7,8 +7,9 @@ import { useParams } from "next/navigation";
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { UpdatesIcon } from "@plane/propel/icons";
+import { setPromiseToast } from "@plane/propel/toast";
 import { EUserProjectRoles } from "@plane/types";
-import { setPromiseToast, ToggleSwitch } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
 // store hooks
 import { SettingsContentWrapper } from "@/components/settings/content-wrapper";
@@ -6,8 +6,9 @@ import useSWR from "swr";
 // plane imports
 import { EUserPermissionsLevel, WORKFLOW_TRACKER_ELEMENTS, WORKFLOW_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setPromiseToast } from "@plane/propel/toast";
 import { EUserProjectRoles } from "@plane/types";
-import { setPromiseToast, ToggleSwitch } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 // components
 import { NotAuthorizedView } from "@/components/auth-screens/not-authorized-view";
 import { PageHead } from "@/components/core/page-title";
@@ -7,8 +7,9 @@ import { FileText, ListFilter } from "lucide-react";
 // plane imports
 import { WORKSPACE_PAGE_TRACKER_EVENTS, EPageAccess } from "@plane/constants";
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TPage, TPageNavigationTabs } from "@plane/types";
-import { Breadcrumbs, Header, setToast, TOAST_TYPE } from "@plane/ui";
+import { Breadcrumbs, Header } from "@plane/ui";
 import { calculateTotalFilters, capitalizeFirstLetter } from "@plane/utils";
 // components
 import { BreadcrumbLink } from "@/components/common/breadcrumb-link";
@@ -5,7 +5,7 @@ import { useSearchParams } from "next/navigation";
 // plane imports
 import { SILO_ERROR_CODES } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // components
 import { PageHead } from "@/components/core/page-title";
 import { ProfileSettingContentHeader } from "@/components/profile/profile-setting-content-header";
@@ -3,9 +3,10 @@ import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { projectTemplateService } from "@plane/services";
 import { EUserPermissions, IWorkspace } from "@plane/types";
-import { Loader, setToast, TOAST_TYPE } from "@plane/ui";
+import { Loader } from "@plane/ui";
 import { orderWorkspacesList } from "@plane/utils";
 // hooks
 import { useWorkspace } from "@/hooks/store/use-workspace";
@@ -6,8 +6,8 @@ import { useTheme } from "next-themes";
 // plane imports
 import { I_THEME_OPTION, THEME_OPTIONS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setPromiseToast } from "@plane/propel/toast";
 import { IUserTheme } from "@plane/types";
-import { setPromiseToast } from "@plane/ui";
 import { applyTheme, unsetCustomCssVariables } from "@plane/utils";
 // hooks
 import { useUserProfile } from "@/hooks/store/user";
@@ -3,8 +3,8 @@ import { observer } from "mobx-react";
 import { useSearchParams } from "next/navigation";
 // plane imports
 import type { EditorRefApi } from "@plane/editor";
+import { TOAST_TYPE, updateToast } from "@plane/propel/toast";
 import type { TDocumentPayload, TPage, TPageVersion, TWebhookConnectionQueryParams } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // hooks
 import { usePageFallback } from "@/hooks/use-page-fallback";
 import { type TCustomEventHandlers } from "@/hooks/use-realtime-page-events";
@@ -121,7 +121,7 @@ export const PageRoot = observer((props: TPageRootProps) => {
      if (version && isNestedPagesEnabled(workspaceSlug.toString())) {
        page.setVersionToBeRestored(version, descriptionHTML);
        page.setRestorationStatus(true);
-        setToast({ id: "restoring-version", type: TOAST_TYPE.LOADING_TOAST, title: "Restoring version..." });
+        updateToast("restoring-version", { type: TOAST_TYPE.LOADING_TOAST, title: "Restoring version..." });
        if (page.id) {
          await handlers.restoreVersion(page.id, version);
        }
@@ -6,8 +6,9 @@ import { useParams } from "next/navigation";
 import { ChevronRight, FileText, Loader } from "lucide-react";
 // plane imports
 import { RestrictedPageIcon } from "@plane/propel/icons";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TPageNavigationTabs } from "@plane/types";
-import { Logo, setToast, TOAST_TYPE } from "@plane/ui";
+import { Logo } from "@plane/ui";
 import { cn, getPageName } from "@plane/utils";
 // components
 import { ListItem } from "@/components/core/list";
@@ -12,8 +12,8 @@ import {
  PROJECT_PAGE_TRACKER_EVENTS,
 } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EUserProjectRoles, type TPageNavigationTabs, TPage, TPageDragPayload } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // components
 import { DetailedEmptyState } from "@/components/empty-state/detailed-empty-state-root";
 import { PageListBlockRoot } from "@/components/pages/list/block-root";
@@ -10,6 +10,7 @@ import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { AlertModalCore } from "@plane/ui";
 // constants
 import { getPageName } from "@plane/utils";
+// constants
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 // plane web hooks
@@ -1,11 +1,12 @@
 import React from "react";
 import { observer } from "mobx-react";
 import { ListFilter } from "lucide-react";
-// plane imports
 import { getButtonStyling } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+// plane imports
 import { IFilterInstance } from "@plane/shared-state";
 import { LOGICAL_OPERATOR, TExternalFilter, TFilterProperty } from "@plane/types";
-import { CustomSearchSelect, setToast, TButtonVariant, TOAST_TYPE } from "@plane/ui";
+import { CustomSearchSelect, TButtonVariant } from "@plane/ui";
 import { cn, getOperatorForPayload } from "@plane/utils";

 export type TAddFilterButtonProps<P extends TFilterProperty, E extends TExternalFilter> = {
@@ -3,9 +3,8 @@ import { isEqual, cloneDeep } from "lodash-es";
 import { observer } from "mobx-react";
 // plane imports
 import { EUserPermissionsLevel, PROJECT_VIEW_TRACKER_EVENTS } from "@plane/constants";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EUserProjectRoles, EViewAccess, IProjectView, TWorkItemFilterExpression } from "@plane/types";
-// components
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { removeNillKeys } from "@/components/issues/issue-layouts/utils";
 import { CreateUpdateProjectViewModal } from "@/components/views/modal";
 // hooks
@@ -3,9 +3,8 @@ import { isEqual, cloneDeep } from "lodash-es";
 import { observer } from "mobx-react";
 // plane imports
 import { DEFAULT_GLOBAL_VIEWS_LIST, EUserPermissionsLevel, GLOBAL_VIEW_TRACKER_EVENTS } from "@plane/constants";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EUserProjectRoles, EViewAccess, IWorkspaceView, TWorkItemFilterExpression } from "@plane/types";
-// components
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { removeNillKeys } from "@/components/issues/issue-layouts/utils";
 import { CreateUpdateWorkspaceViewModal } from "@/components/workspace/views/modal";
 // hooks
@@ -3,7 +3,7 @@ import { useMemo } from "react";
 import { IS_FAVORITE_MENU_OPEN, PROJECT_PAGE_TRACKER_EVENTS, EPageAccess } from "@plane/constants";
 import type { EditorRefApi } from "@plane/editor";
 import { useLocalStorage } from "@plane/hooks";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { copyUrlToClipboard } from "@plane/utils";
 // helpers
 import { captureSuccess, captureError } from "@/helpers/event-tracker.helper";
@@ -1,8 +1,8 @@
 import { useCallback, useMemo } from "react";
 // plane imports
 import type { EventToPayloadMap } from "@plane/editor";
+import { setToast, TOAST_TYPE, dismissToast } from "@plane/propel/toast";
 import type { IUserLite, TCollaborator } from "@plane/types";
-import { dismissToast, setToast, TOAST_TYPE } from "@plane/ui";
 // components
 import type { TEditorBodyHandlers } from "@/components/pages/editor/editor-body";
 // hooks
@@ -3,8 +3,9 @@ import { observer } from "mobx-react";
 // plane imports
 import { AUTOMATION_TRACKER_ELEMENTS, AUTOMATION_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-// helpers
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+// helpers
 import {
  EActionNodeHandlerName,
  EAutomationNodeType,
@@ -12,7 +13,6 @@ import {
  TChangePropertyActionConfig,
  TChangePropertyActionFormConfig,
 } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { captureClick, captureSuccess, captureError } from "@/helpers/event-tracker.helper";
 // plane web imports
 import { useAutomations } from "@/plane-web/hooks/store/automations/use-automations";
@@ -4,8 +4,9 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EAutomationNodeType } from "@plane/types";
-import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { AlertModalCore } from "@plane/ui";

 type Props = {
  nodeType: EAutomationNodeType;
@@ -5,7 +5,8 @@ import { observer } from "mobx-react";
 // plane imports
 import { AUTOMATION_TRACKER_ELEMENTS, AUTOMATION_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+import { AlertModalCore } from "@plane/ui";
 // helpers
 import { captureClick, captureSuccess, captureError } from "@/helpers/event-tracker.helper";
 // plane web hooks
@@ -3,8 +3,8 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 // constants
 // hooks
 import { useAppTheme } from "@/hooks/store/use-app-theme";
@@ -5,10 +5,10 @@ import { observer } from "mobx-react";
 import { useDropzone } from "react-dropzone";
 import { UserCircle2 } from "lucide-react";
 import { Dialog, Transition } from "@headlessui/react";
-// plane imports
 import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+// plane imports
 import { EFileAssetType } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 import { checkURLValidity, getAssetIdFromUrl, getFileURL } from "@plane/utils";
 // hooks
 import { useWorkspace } from "@/hooks/store/use-workspace";
@@ -8,7 +8,8 @@ import { AlertTriangle } from "lucide-react";
 import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { EModalWidth, EModalPosition, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+import { EModalWidth, EModalPosition, ModalCore } from "@plane/ui";
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useAppRouter } from "@/hooks/use-app-router";
@@ -6,8 +6,9 @@ import { Link2, Pencil, Trash2 } from "lucide-react";
 // plane imports
 import { CUSTOMER_TRACKER_ELEMENTS, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { ContextMenu, CustomMenu, TContextMenuItem, TOAST_TYPE, setToast } from "@plane/ui";
+import { ContextMenu, CustomMenu, TContextMenuItem } from "@plane/ui";
 import { cn, copyUrlToClipboard } from "@plane/utils";
 // hooks
 import { captureClick } from "@/helpers/event-tracker.helper";
@@ -6,7 +6,8 @@ import { useParams } from "next/navigation";
 // ui
 import { mutate } from "swr";
 import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
-import { TOAST_TYPE, setToast, AlertModalCore } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+import { AlertModalCore } from "@plane/ui";
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useCustomers } from "@/plane-web/hooks/store";
@@ -5,8 +5,9 @@ import { Link2, Pencil, Trash2 } from "lucide-react";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { ContextMenu, CustomMenu, TContextMenuItem, TOAST_TYPE, setToast } from "@plane/ui";
+import { ContextMenu, CustomMenu, TContextMenuItem } from "@plane/ui";
 import { cn, copyUrlToClipboard } from "@plane/utils";
 // plane web constants
 import { useUserPermissions } from "@/hooks/store/user";
@@ -3,10 +3,11 @@
 import React, { useEffect } from "react";
 import { observer } from "mobx-react";
 import useSWR from "swr";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // ui
 import { CustomerPropertyValueService } from "@plane/services";
 import { TIssuePropertyValues } from "@plane/types";
-import { Loader, setToast, TOAST_TYPE } from "@plane/ui";
+import { Loader } from "@plane/ui";
 // plane web hooks
 import { useCustomerProperties } from "@/plane-web/hooks/store";
 import { CustomerAdditionalPropertyValues } from "./root";
@@ -12,8 +12,9 @@ import {
 import { useTranslation } from "@plane/i18n";
 // plane types
 import { CustomersIcon } from "@plane/propel/icons";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EFileAssetType, TCustomerPayload } from "@plane/types";
-import { CustomSearchSelect, Input, setToast, TOAST_TYPE } from "@plane/ui";
+import { CustomSearchSelect, Input } from "@plane/ui";
 // utils
 import { getDescriptionPlaceholderI18n, getFileURL, getTabIndex } from "@plane/utils";
 import { RichTextEditor } from "@/components/editor/rich-text";
@@ -5,8 +5,8 @@ import { FormProvider, useForm } from "react-hook-form";
 import { CUSTOMER_TRACKER_EVENTS, ETabIndices } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TCustomer, TCustomerPayload } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // helpers
 import { cn, getTabIndex } from "@plane/utils";
 // store
@@ -1,10 +1,10 @@
 import React, { useState } from "react";
 import { observer } from "mobx-react";
 import { mutate } from "swr";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // plane imports
 import { CustomerPropertyValueService } from "@plane/services";
 import { TIssuePropertyValueErrors, TIssuePropertyValues } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { getPropertiesDefaultValues } from "@plane/utils";
 // plane web hooks
 import { CustomerModalContext, TCreateUpdatePropertyValuesProps } from "@/plane-web/components/customers";
@@ -3,8 +3,9 @@ import { Controller, FieldValues, useForm } from "react-hook-form";
 // plane imports
 import { CUSTOMER_WEBSITE_AND_SOURCE_URL_REGEX } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TCustomer } from "@plane/types";
-import { Input, setToast, TOAST_TYPE } from "@plane/ui";
+import { Input } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { ButtonAvatars } from "@/components/dropdowns/member/avatar";
@@ -56,7 +57,6 @@ export const CustomerDefaultSidebarProperties: FC<TProps> = (props) => {
          />
        </div>
      </div>
-
      <div className="flex h-8 gap-2 items-center">
        <div className="w-2/5 flex-shrink-0">
          <span className="text-sm text-custom-text-200">{t("customers.properties.default.website_url.name")}</span>
@@ -77,7 +77,6 @@ export const CustomerDefaultSidebarProperties: FC<TProps> = (props) => {
          />
        </div>
      </div>
-
      <div className="flex h-8 gap-2 items-center">
        <div className="w-2/5 flex-shrink-0">
          <span className="text-sm text-custom-text-200">{t("customers.properties.default.size.name")}</span>
@@ -100,7 +99,6 @@ export const CustomerDefaultSidebarProperties: FC<TProps> = (props) => {
          />
        </div>
      </div>
-
      <div className="flex h-8 gap-2 items-center">
        <div className="w-2/5 flex-shrink-0">
          <span className="text-sm text-custom-text-200">{t("customers.properties.default.domain.name")}</span>
@@ -116,7 +114,6 @@ export const CustomerDefaultSidebarProperties: FC<TProps> = (props) => {
          />
        </div>
      </div>
-
      <div className="flex h-8 gap-2 items-center">
        <div className="w-2/5 flex-shrink-0">
          <span className="text-sm text-custom-text-200">{t("customers.properties.default.contract_status.name")}</span>
@@ -132,7 +129,6 @@ export const CustomerDefaultSidebarProperties: FC<TProps> = (props) => {
          disabled={isDisabled}
        />
      </div>
-
      <div className="flex h-8 gap-2 items-center">
        <div className="w-2/5 flex-shrink-0">
          <span className="text-sm text-custom-text-200">{t("customers.properties.default.stage.name")}</span>
@@ -148,7 +144,6 @@ export const CustomerDefaultSidebarProperties: FC<TProps> = (props) => {
          disabled={isDisabled}
        />
      </div>
-
      <div className="flex h-8 gap-2 items-center">
        <div className="w-2/5 flex-shrink-0">
          <span className="text-sm text-custom-text-200">{t("customers.properties.default.revenue.name")}</span>
@@ -169,7 +164,6 @@ export const CustomerDefaultSidebarProperties: FC<TProps> = (props) => {
          disabled={isDisabled}
        />
      </div>
-
      {createdByDetails && (
        <div className="flex h-8 gap-2 items-center">
          <div className="w-2/5 flex-shrink-0">
@@ -5,8 +5,9 @@ import { ExternalLink } from "lucide-react";
 // plane imports
 import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EFileAssetType, TCustomerPayload } from "@plane/types";
-import { setToast, Tabs, TOAST_TYPE } from "@plane/ui";
+import { Tabs } from "@plane/ui";
 // hooks
 import { formatURLForDisplay } from "@plane/utils";
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
@@ -2,8 +2,8 @@ import React, { FC } from "react";
 import { observer } from "mobx-react";
 import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
 import { ScrollArea } from "@plane/propel/scrollarea";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TCustomer } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // plane web imports
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { SidebarWrapper } from "@/plane-web/components/common/layout/sidebar/sidebar-wrapper";
@@ -6,8 +6,8 @@ import useSWR from "swr";
 import { EUserPermissionsLevel } from "@plane/constants";
 // components
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { ListLayout } from "@/components/core/list";
 import { DetailedEmptyState } from "@/components/empty-state/detailed-empty-state-root";
 import { ListLoaderItemRow } from "@/components/ui/loader/layouts/list-layout-loader";
@@ -2,7 +2,7 @@ import React, { FC, ReactNode, useCallback, useState } from "react";
 import { FileRejection, useDropzone } from "react-dropzone";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { useFileSize } from "@/plane-web/hooks/use-file-size";
 // helpers
 import { useAttachmentOperations } from "./helper";
@@ -3,8 +3,7 @@ import { observer } from "mobx-react";
 import { FileRejection, useDropzone } from "react-dropzone";
 import { UploadCloud } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
-// hooks
-import { TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 // plane web hooks
 import { cn } from "@plane/utils";
 import { useCustomers } from "@/plane-web/hooks/store";
@@ -3,7 +3,7 @@ import { useMemo } from "react";
 // plane ui
 import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { TOAST_TYPE, setPromiseToast, setToast } from "@plane/ui";
+import { TOAST_TYPE, setPromiseToast, setToast } from "@plane/propel/toast";
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useCustomers } from "@/plane-web/hooks/store";
@@ -7,9 +7,10 @@ import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { LayersIcon } from "@plane/propel/icons";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { CustomerService } from "@plane/services";
 import { EFileAssetType, ISearchIssueResponse, TCustomerRequest, TProjectIssuesSearchParams } from "@plane/types";
-import { EModalPosition, EModalWidth, Input, setToast, TOAST_TYPE, ModalCore } from "@plane/ui";
+import { EModalPosition, EModalWidth, Input, ModalCore } from "@plane/ui";
 import { getDescriptionPlaceholderI18n } from "@plane/utils";
 // components
 import { ExistingIssuesListModal } from "@/components/core/modals/existing-issues-list-modal";
@@ -4,9 +4,9 @@ import { Database, LayersIcon, PlusIcon } from "lucide-react";
 import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { CustomerService } from "@plane/services";
 import { ISearchIssueResponse, TProjectIssuesSearchParams } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // components
 import { ContentOverflowWrapper } from "@/components/core/content-overflow-HOC";
 import { ExistingIssuesListModal } from "@/components/core/modals/existing-issues-list-modal";
@@ -2,8 +2,8 @@
 import { useMemo } from "react";
 import { CUSTOMER_TRACKER_EVENTS } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EIssueServiceType, TIssue, TIssueServiceType } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 // helper
 import { copyTextToClipboard } from "@plane/utils";
 // hooks
@@ -4,9 +4,9 @@ import { observer } from "mobx-react";
 import { CUSTOMER_TRACKER_EVENTS, EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { CustomerService } from "@plane/services";
 import { EUserWorkspaceRoles, ISearchIssueResponse, TProjectIssuesSearchParams } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { ExistingIssuesListModal } from "@/components/core/modals/existing-issues-list-modal";
 // plane web components
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
@@ -2,7 +2,7 @@ import { FC, useState } from "react";
 import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 import { E_FEATURE_FLAGS } from "@plane/constants";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { useCycle } from "@/hooks/store/use-cycle";
 import { StartCycleModal } from "@/plane-web/components/cycles";
 import { CYCLE_ACTION } from "@/plane-web/constants/cycle";
@@ -1,10 +1,11 @@
 "use client";
-
 import { FC, useMemo, useState } from "react";
 import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+
 import { EIssuesStoreType } from "@plane/types";
 // plane imports
-import { EModalPosition, EModalWidth, Input, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { EModalPosition, EModalWidth, Input, ModalCore } from "@plane/ui";
 // components
 import { CycleDropdown } from "@/components/dropdowns/cycle";
 // hooks
@@ -4,8 +4,8 @@ import { Plus } from "lucide-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { getButtonStyling } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EWidgetChartModels, EWidgetChartTypes } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // components
 import { SimpleEmptyState } from "@/components/empty-state/simple-empty-state-root";
 // hooks
@@ -4,7 +4,7 @@ import { observer } from "mobx-react";
 import { type Layout, Layouts, Responsive, WidthProvider } from "react-grid-layout";
 // plane imports
 import { EWidgetGridBreakpoints, WIDGET_GRID_BREAKPOINTS } from "@plane/constants";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // plane web hooks
 import { useDashboards } from "@/plane-web/hooks/store";
 // local imports
@@ -1,9 +1,10 @@
 import { useCallback } from "react";
 import { observer } from "mobx-react";
 import { Info, Minus } from "lucide-react";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // plane imports
 import { Tooltip } from "@plane/propel/tooltip";
-import { Avatar, FavoriteStar, setToast, TOAST_TYPE } from "@plane/ui";
+import { Avatar, FavoriteStar } from "@plane/ui";
 // plane utils
 import { getFileURL, renderFormattedDate } from "@plane/utils";
 // hooks
@@ -5,8 +5,9 @@ import { Controller, useForm } from "react-hook-form";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TDashboard } from "@plane/types";
-import { EModalPosition, EModalWidth, Input, ModalCore, setToast, TOAST_TYPE } from "@plane/ui";
+import { EModalPosition, EModalWidth, Input, ModalCore } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { Logo } from "@/components/common/logo";
@@ -4,7 +4,8 @@ import { useState } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+import { AlertModalCore } from "@plane/ui";
 // plane web hooks
 import { useDashboards } from "@/plane-web/hooks/store";

@@ -3,7 +3,8 @@ import { observer } from "mobx-react";
 import { ExternalLink, Link, Pencil, Trash2 } from "lucide-react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
-import { ContextMenu, CustomMenu, setToast, TContextMenuItem, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+import { ContextMenu, CustomMenu, TContextMenuItem } from "@plane/ui";
 import { cn, copyUrlToClipboard } from "@plane/utils";
 // plane web hooks
 import { useDashboards } from "@/plane-web/hooks/store";
@@ -1,12 +1,12 @@
 import { useCallback, useEffect } from "react";
 import { observer } from "mobx-react";
-import { FormProvider, useForm } from "react-hook-form";

+import { FormProvider, useForm } from "react-hook-form";
 // plane imports
 import { ALL_WIDGETS_Y_AXIS_METRICS_LIST, WIDGET_X_AXIS_PROPERTIES_LIST } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TDashboardWidget } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { cn } from "@plane/utils";

 // plane web hooks
@@ -2,8 +2,9 @@

 import { useState } from "react";
 import { observer } from "mobx-react";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 // plane imports
-import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { AlertModalCore } from "@plane/ui";
 // plane web hooks
 import { useDashboards } from "@/plane-web/hooks/store";

@@ -7,8 +7,8 @@ import { Popover } from "@headlessui/react";
 // plane imports
 import { useOutsideClickDetector } from "@plane/hooks";
 import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { TDeDupeIssue } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { cn } from "@plane/utils";
 // components
 import { MultipleSelectGroup } from "@/components/core/multiple-select";
@@ -1,8 +1,8 @@
 "use client";

 import { useMemo } from "react";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EIssueServiceType, EIssuesStoreType, TIssue } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
 import { useIssuesActions } from "@/hooks/use-issues-actions";
@@ -1,7 +1,7 @@
 import React, { FC } from "react";
 import { observer } from "mobx-react";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EIssueServiceType, EIssuesStoreType, ISearchIssueResponse, TIssue } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // components
 import { ExistingIssuesListModal } from "@/components/core/modals/existing-issues-list-modal";
 import { CreateUpdateIssueModal } from "@/components/issues/issue-modal/modal";
@@ -1,8 +1,8 @@
 import { useMemo } from "react";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EFileAssetType, EIssueServiceType, TCommentsOperations } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { copyUrlToClipboard, formatTextList, generateWorkItemLink } from "@plane/utils";
 // hooks
 import { useEditorAsset } from "@/hooks/store/use-editor-asset";
@@ -5,8 +5,9 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
 import { WORK_ITEM_TRACKER_EVENTS } from "@plane/constants";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EIssueServiceType, EIssuesStoreType, TIssue } from "@plane/types";
-import { EModalPosition, EModalWidth, ModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
 // components
 import { CreateIssueToastActionItems } from "@/components/issues/create-issue-toast-action-items";
 import { IssuesModalProps } from "@/components/issues/issue-modal/modal";
@@ -8,8 +8,8 @@ import { FormProvider, useForm } from "react-hook-form";
 import { ETabIndices } from "@plane/constants";
 import type { EditorRefApi } from "@plane/editor";
 import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EIssueServiceType, EWorkItemTypeEntity, type ISearchIssueResponse, type TIssue } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 import { cn, getChangedIssuefields, getTabIndex } from "@plane/utils";
 // components
 import {
@@ -3,6 +3,7 @@ import { observer } from "mobx-react";
 import { mutate } from "swr";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import {
  EIssueServiceType,
  EWorkItemConversionType,
@@ -11,7 +12,6 @@ import {
  TIssuePropertyValueErrors,
  TIssuePropertyValues,
 } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 import { getPropertiesDefaultValues } from "@plane/utils";
 // components
 import {
@@ -7,9 +7,10 @@ import { Link2, MoveDiagonal, MoveRight, Sidebar } from "lucide-react";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { CenterPanelIcon, FullScreenPanelIcon, SidePanelIcon } from "@plane/propel/icons";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { Tooltip } from "@plane/propel/tooltip";
 import { EIssueServiceType, EIssuesStoreType, EUserProjectRoles, EWorkItemConversionType, TIssue } from "@plane/types";
-import { CustomSelect, TOAST_TYPE, setToast } from "@plane/ui";
+import { CustomSelect } from "@plane/ui";
 import { cn, copyUrlToClipboard, generateWorkItemLink } from "@plane/utils";
 import { IssueSubscription } from "@/components/issues/issue-detail/subscription";
 import { NameDescriptionUpdateStatus } from "@/components/issues/issue-update-status";
@@ -4,8 +4,8 @@ import { FC, useEffect, useState, useMemo, useCallback } from "react";
 import { observer } from "mobx-react";
 // plane imports
 import { EPIC_TRACKER_EVENTS, EUserPermissionsLevel } from "@plane/constants";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EIssueServiceType, EUserProjectRoles, TIssue, IWorkItemPeekOverview } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 // components
 import type { TIssueOperations } from "@/components/issues/issue-detail";
 // hooks
@@ -6,8 +6,8 @@ import { useTheme } from "next-themes";
 // plane imports
 import { useTranslation } from "@plane/i18n";
 import { Button, getButtonStyling } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EProductSubscriptionEnum } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 // helpers
 import { DetailedEmptyState } from "@/components/empty-state/detailed-empty-state-root";
 // plane web hooks
@@ -5,9 +5,10 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane imports
 import { useTranslation } from "@plane/i18n";
+import { setPromiseToast } from "@plane/propel/toast";
 import { Tooltip } from "@plane/propel/tooltip";
 import { EWorkItemTypeEntity } from "@plane/types";
-import { setPromiseToast, ToggleSwitch } from "@plane/ui";
+import { ToggleSwitch } from "@plane/ui";
 // components
 import { SettingsHeading } from "@/components/settings/heading";
 // hooks
@@ -3,8 +3,9 @@
 import { FC, useState } from "react";
 import { observer } from "mobx-react";
 import { MoveRight, Trash2, X } from "lucide-react";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EEstimateSystem, TEstimatePointsObject } from "@plane/types";
-import { Spinner, TOAST_TYPE, setToast } from "@plane/ui";
+import { Spinner } from "@plane/ui";
 // ce imports
 import { convertMinutesToHoursMinutesString } from "@plane/utils";
 import { TEstimatePointDelete } from "@/ce/components/estimates/points/delete";
@@ -3,8 +3,9 @@ import { observer } from "mobx-react";
 import { ChevronLeft, Plus } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { TEstimatePointsObject, TEstimateTypeError, TEstimateUpdateStageKeys } from "@plane/types";
-import { Sortable, TOAST_TYPE, setToast } from "@plane/ui";
+import { Sortable } from "@plane/ui";
 // components
 import { EstimatePointCreate } from "@/components/estimates/points/create";
 import { EstimatePointItemPreview } from "@/components/estimates/points/preview";
@@ -4,6 +4,7 @@ import { observer } from "mobx-react";
 import { ChevronLeft, MoveRight } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import {
  IEstimateFormData,
  TEstimatePointsObject,
@@ -11,7 +12,6 @@ import {
  TEstimateTypeError,
  TEstimateUpdateStageKeys,
 } from "@plane/types";
-import { TOAST_TYPE, setToast } from "@plane/ui";
 // hooks
 import { useEstimate } from "@/hooks/store/estimates";
 // plane web components
@@ -4,9 +4,10 @@ import { useParams } from "next/navigation";
 import { CalendarCheck2, CalendarClock, Trash2Icon } from "lucide-react";
 // Plane
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { Tooltip } from "@plane/propel/tooltip";
 import { TIssue } from "@plane/types";
-import { ControlLink, EModalPosition, EModalWidth, ModalCore, setToast, Spinner, TOAST_TYPE } from "@plane/ui";
+import { ControlLink, EModalPosition, EModalWidth, ModalCore, Spinner } from "@plane/ui";
 // components
 import { DateDropdown } from "@/components/dropdowns/date";
 // hooks
@@ -3,8 +3,8 @@ import { observer } from "mobx-react";
 import { ExternalLink, RefreshCw } from "lucide-react";
 import { Button } from "@plane/propel/button";
 import { PlaneLogo } from "@plane/propel/icons";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EProductSubscriptionEnum } from "@plane/types";
-import { setToast, TOAST_TYPE } from "@plane/ui";
 // helpers
 import { cn } from "@plane/utils";
 // hooks
@@ -4,7 +4,7 @@ import { FC, useState } from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // plane web hooks
 import { useAsanaImporter } from "@/plane-web/hooks/store";

@@ -7,8 +7,9 @@ import { IMPORTER_TRACKER_EVENTS } from "@plane/constants";
 import { E_IMPORTER_KEYS, E_JOB_STATUS } from "@plane/etl/core";
 import { FlatfileConfig } from "@plane/etl/flatfile";
 import { Button } from "@plane/propel/button";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { TImportJob } from "@plane/types";
-import { setToast, TOAST_TYPE, Loader } from "@plane/ui";
+import { Loader } from "@plane/ui";
 // hooks
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import DynamicFlatfileProvider from "@/plane-web/components/importers/flatfile/steps/configure-flatfile/provider";
@@ -4,7 +4,7 @@ import { FC, useState } from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // plane web hooks
 import { useJiraImporter } from "@/plane-web/hooks/store";

@@ -4,7 +4,7 @@ import { FC, useState } from "react";
 import { observer } from "mobx-react";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // plane web hooks
 import { useLinearImporter } from "@/plane-web/hooks/store";

@@ -6,7 +6,8 @@ import { IMPORTER_TRACKER_EVENTS } from "@plane/constants";
 import { E_IMPORTER_KEYS } from "@plane/etl/core";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
-import { CircularProgressIndicator, setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+import { CircularProgressIndicator } from "@plane/ui";
 import { captureError, captureSuccess } from "@/helpers/event-tracker.helper";
 import { useZipImporter } from "@/plane-web/hooks/store/importers/use-zip-importer";
 import { UploadState } from "@/plane-web/store/importers/zip-importer/root.store";
@@ -345,7 +346,6 @@ export const UploadZip: FC<TZipImporterProps> = observer(({ driverType, serviceN
          )}
        </div>
      )}
-
      {/* stepper button */}
      <div className="flex-shrink-0 flex justify-end items-center gap-2 mt-8">
        <StepperNavigation currentStep={currentStep} handleStep={handleStepper}>
@@ -5,7 +5,8 @@ import { PlusIcon, BriefcaseIcon } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { EpicIcon } from "@plane/propel/icons";
-import { CustomMenu, setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+import { CustomMenu } from "@plane/ui";
 // components
 import { ProjectMultiSelectModal } from "@/components/project/multi-select-modal";
 // hooks
@@ -3,7 +3,8 @@ import { observer } from "mobx-react";
 import { useParams } from "next/navigation";
 // plane
 import { useTranslation } from "@plane/i18n";
-import { EModalPosition, EModalWidth, ModalCore, setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+import { EModalPosition, EModalWidth, ModalCore } from "@plane/ui";
 // hooks
 import useKeypress from "@/hooks/use-keypress";
 // Plane web
@@ -5,8 +5,9 @@ import { useTranslation } from "@plane/i18n";
 import { Button } from "@plane/propel/button";
 import { EmojiPicker } from "@plane/propel/emoji-icon-picker";
 import { InitiativeIcon } from "@plane/propel/icons";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EFileAssetType } from "@plane/types";
-import { Input, setToast, TOAST_TYPE, EmojiIconPickerTypes } from "@plane/ui";
+import { Input, EmojiIconPickerTypes } from "@plane/ui";
 import { getDate, getDescriptionPlaceholderI18n, renderFormattedPayloadDate } from "@plane/utils";
 // components
 import { Logo } from "@/components/common/logo";
@@ -6,7 +6,8 @@ import { useParams } from "next/navigation";
 // plane imports
 import { PROJECT_ERROR_MESSAGES } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
-import { AlertModalCore, TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+import { AlertModalCore } from "@plane/ui";
 // hooks
 import { useAppRouter } from "@/hooks/use-app-router";
 // plane web
@@ -6,8 +6,9 @@ import { ExternalLink, LinkIcon, Pencil, Trash2 } from "lucide-react";
 // plane imports
 import { EUserPermissionsLevel } from "@plane/constants";
 import { useTranslation } from "@plane/i18n";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 import { EUserWorkspaceRoles } from "@plane/types";
-import { ContextMenu, CustomMenu, TContextMenuItem, TOAST_TYPE, setToast } from "@plane/ui";
+import { ContextMenu, CustomMenu, TContextMenuItem } from "@plane/ui";
 import { cn, copyUrlToClipboard } from "@plane/utils";
 // hooks
 import { useUser, useUserPermissions } from "@/hooks/store/user";
@@ -3,8 +3,7 @@ import { FC, useCallback, useState } from "react";
 import { observer } from "mobx-react";
 import { FileRejection, useDropzone } from "react-dropzone";
 import { UploadCloud } from "lucide-react";
-// ui
-import { TOAST_TYPE, setToast } from "@plane/ui";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 // plane web hooks
 import { useInitiativeAttachments } from "@/plane-web/hooks/store";
 import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives";
@@ -1,7 +1,6 @@
 "use client";
 import { useMemo } from "react";
-// plane ui
-import { TOAST_TYPE, setPromiseToast, setToast } from "@plane/ui";
+import { TOAST_TYPE, setPromiseToast, setToast } from "@plane/propel/toast";
 // hooks
 import { useInitiativeAttachments } from "@/plane-web/hooks/store";
 // types
@@ -4,8 +4,9 @@ import { observer } from "mobx-react";
 import { LinkIcon, MoreHorizontal, Trash2 } from "lucide-react";
 // Plane
 import { useTranslation } from "@plane/i18n";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 import { EIssueServiceType } from "@plane/types";
-import { CustomMenu, setToast, TContextMenuItem, TOAST_TYPE } from "@plane/ui";
+import { CustomMenu, TContextMenuItem } from "@plane/ui";
 import { cn, copyUrlToClipboard, generateWorkItemLink } from "@plane/utils";
 // hooks
 import { useIssueDetail } from "@/hooks/store/use-issue-detail";
@@ -4,9 +4,10 @@ import { FC } from "react";
 import { observer } from "mobx-react";
 import { Copy, LinkIcon, Pencil, Trash2 } from "lucide-react";
 import { useTranslation } from "@plane/i18n";
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
 // plane imports
 import { Tooltip } from "@plane/propel/tooltip";
-import { CustomMenu, TOAST_TYPE, setToast } from "@plane/ui";
+import { CustomMenu } from "@plane/ui";
 // helpers
 import { calculateTimeAgoShort, copyTextToClipboard } from "@plane/utils";
 // hooks
@@ -1,7 +1,7 @@
 import { useMemo } from "react";
 // Plane
 import { useTranslation } from "@plane/i18n";
-import { setToast, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
 // PLane-web
 import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives";
 import { TInitiativeLink } from "@/plane-web/types/initiative";
@@ -2,7 +2,8 @@ import { observer } from "mobx-react";
 import { LinkIcon, MoreHorizontal, Trash2 } from "lucide-react";
 // Plane
 import { useTranslation } from "@plane/i18n";
-import { CustomMenu, setToast, TContextMenuItem, TOAST_TYPE } from "@plane/ui";
+import { setToast, TOAST_TYPE } from "@plane/propel/toast";
+import { CustomMenu, TContextMenuItem } from "@plane/ui";
 import { cn, copyUrlToClipboard } from "@plane/utils";
 // Plane-web
 import { useInitiatives } from "@/plane-web/hooks/store/use-initiatives";
--- a/Show More
+++ b/Show More