import { List } from "flowbite-react";
import { FC } from "react";
import { InputField } from "../forms/Inputs";
import { TSsettingSchema } from "../forms/schema/setting";

type props = {
  isEdit: boolean;
  setting: TSsettingSchema;
  title: string;
  field: any;
};

const ListItems: FC<props> = ({ setting, title, field, isEdit }) => {
  const value: any = setting?.settings?.[field];
  return (
    <List.Item className={`flex ${isEdit ? "!mt-5" : ""}`}>
      <div>
        <span className="label text-md font-medium text-gray-800 w-36 inline-block">
          {title}
        </span>
        <span className="font-bold text-gray-900 mr-2">:</span>
      </div>
      <div>
        {isEdit ? (
          <div className="-mt-4 w-96">
            <InputField name={`settings.${field}`} />
          </div>
        ) : (
          <span>{value}</span>
        )}
      </div>
    </List.Item>
  );
};
export default ListItems;