snapshot of https://github.com/makeplane/plane.git @ d868349a55de79979eb8b98701bf1702c67ad634 (2026-09-15)

apps/web/core/components/project-states/options/delete.tsx

@@ -0,0 +1,104 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useState } from "react";
+import { observer } from "mobx-react";
+import { CloseOutline, LoadingOutline } from "@makeplane/propel/icons";
+// plane imports
+import { TOAST_TYPE, setToast } from "@plane/propel/toast";
+import { Tooltip } from "@makeplane/propel/components/tooltip";
+import type { IState, TStateOperationsCallbacks } from "@plane/types";
+import { AlertModalCore } from "@plane/ui";
+import { cn } from "@plane/utils";
+// hooks
+import { usePlatformOS } from "@/hooks/use-platform-os";
+
+type TStateDelete = {
+  totalStates: number;
+  state: IState;
+  deleteStateCallback: TStateOperationsCallbacks["deleteState"];
+};
+
+export const StateDelete = observer(function StateDelete(props: TStateDelete) {
+  const { totalStates, state, deleteStateCallback } = props;
+  // hooks
+  const { isMobile } = usePlatformOS();
+  // states
+  const [isDeleteModal, setIsDeleteModal] = useState(false);
+  const [isDelete, setIsDelete] = useState(false);
+  // derived values
+  const isDeleteDisabled = state.default ? true : totalStates === 1 ? true : false;
+
+  const handleDeleteState = async () => {
+    if (isDeleteDisabled) return;
+
+    setIsDelete(true);
+
+    try {
+      await deleteStateCallback(state.id);
+      setIsDelete(false);
+    } catch (error) {
+      const errorStatus = error as { status: number; data: { error: string } };
+      if (errorStatus.status === 400) {
+        setToast({
+          type: TOAST_TYPE.ERROR,
+          title: "Error!",
+          message:
+            "This state contains some work items within it, please move them to some other state to delete this state.",
+        });
+      } else {
+        setToast({
+          type: TOAST_TYPE.ERROR,
+          title: "Error!",
+          message: "State could not be deleted. Please try again.",
+        });
+      }
+      setIsDelete(false);
+    }
+  };
+
+  return (
+    <>
+      <AlertModalCore
+        handleClose={() => setIsDeleteModal(false)}
+        handleSubmit={handleDeleteState}
+        isSubmitting={isDelete}
+        isOpen={isDeleteModal}
+        title="Delete State"
+        content={
+          <>
+            Are you sure you want to delete state- <span className="font-medium text-primary">{state?.name}</span>? All
+            of the data related to the state will be permanently removed. This action cannot be undone.
+          </>
+        }
+      />
+
+      <button
+        type="button"
+        className={cn(
+          "flex h-5 w-5 flex-shrink-0 cursor-pointer items-center justify-center overflow-hidden rounded-sm transition-colors focus:outline-none",
+          isDeleteDisabled ? "bg-surface-2 text-secondary" : "text-danger-primary hover:bg-layer-1"
+        )}
+        disabled={isDeleteDisabled}
+        onClick={() => setIsDeleteModal(true)}
+      >
+        <Tooltip
+          label={
+            state.default ? "Cannot delete the default state." : totalStates === 1 ? `Cannot have an empty group.` : ``
+          }
+          layout="stacked"
+          disabled={!isDeleteDisabled || isMobile}
+        >
+          {isDelete ? (
+            <LoadingOutline className="h-3.5 w-3.5 text-secondary" />
+          ) : (
+            <CloseOutline className="h-3.5 w-3.5" />
+          )}
+        </Tooltip>
+      </button>
+    </>
+  );
+});

apps/web/core/components/project-states/options/index.ts

@@ -0,0 +1,8 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+export * from "./mark-as-default";
+export * from "./delete";

apps/web/core/components/project-states/options/mark-as-default.tsx

@@ -0,0 +1,49 @@
+/**
+ * Copyright (c) 2023-present Plane Software, Inc. and contributors
+ * SPDX-License-Identifier: AGPL-3.0-only
+ * See the LICENSE file for details.
+ */
+
+import { useState } from "react";
+import { observer } from "mobx-react";
+// plane imports
+import type { TStateOperationsCallbacks } from "@plane/types";
+import { cn } from "@plane/utils";
+
+type TStateMarksAsDefault = {
+  stateId: string;
+  isDefault: boolean;
+  markStateAsDefaultCallback: TStateOperationsCallbacks["markStateAsDefault"];
+};
+
+export const StateMarksAsDefault = observer(function StateMarksAsDefault(props: TStateMarksAsDefault) {
+  const { stateId, isDefault, markStateAsDefaultCallback } = props;
+  // states
+  const [isLoading, setIsLoading] = useState(false);
+
+  const handleMarkAsDefault = async () => {
+    if (!stateId || isDefault) return;
+    setIsLoading(true);
+
+    try {
+      setIsLoading(false);
+      await markStateAsDefaultCallback(stateId);
+      setIsLoading(false);
+    } catch {
+      setIsLoading(false);
+    }
+  };
+
+  return (
+    <button
+      className={cn(
+        "text-11 whitespace-nowrap transition-colors",
+        isDefault ? "text-tertiary" : "text-secondary hover:text-primary"
+      )}
+      disabled={isDefault || isLoading}
+      onClick={handleMarkAsDefault}
+    >
+      {isLoading ? "Marking as default" : isDefault ? `Default` : `Mark as default`}
+    </button>
+  );
+});