import { observer } from "mobx-react";
// buzzwareTech imports
import { setPromiseToast } from "@buzzwaretech/propel/toast";
import type { IProject } from "@buzzwaretech/types";
import { ToggleSwitch } from "@buzzwaretech/ui";
// components
import { SettingsBoxedControlItem } from "@/components/settings/boxed-control-item";
// hooks
import { useProject } from "@/hooks/store/use-project";

type Props = {
  description?: React.ReactNode;
  disabled?: boolean;
  projectId: string;
  featureProperty: keyof IProject;
  title: React.ReactNode;
  value: boolean;
  workspaceSlug: string;
};

export const ProjectSettingsFeatureControlItem = observer(
  function ProjectSettingsFeatureControlItem(props: Props) {
    const {
      description,
      disabled,
      featureProperty,
      projectId,
      title,
      value,
      workspaceSlug,
    } = props;
    // store hooks
    const { getProjectById, updateProject } = useProject();
    // derived values
    const currentProjectDetails = getProjectById(projectId);

    const handleSubmit = () => {
      if (!workspaceSlug || !projectId || !currentProjectDetails) return;

      // making the request to update the project feature
      const settingsPayload = {
        [featureProperty]: !currentProjectDetails?.[featureProperty],
      };
      const updateProjectPromise = updateProject(
        workspaceSlug,
        projectId,
        settingsPayload,
      );

      setPromiseToast(updateProjectPromise, {
        loading: "Updating project feature...",
        success: {
          title: "Success!",
          message: () => "Project feature updated successfully.",
        },
        error: {
          title: "Error!",
          message: () =>
            "Something went wrong while updating project feature. Please try again.",
        },
      });
      void updateProjectPromise.then(() => {
        return undefined;
      });
    };

    return (
      <SettingsBoxedControlItem
        title={title}
        description={description}
        control={
          <ToggleSwitch
            value={value}
            onChange={handleSubmit}
            disabled={disabled}
            size="sm"
          />
        }
      />
    );
  },
);