import React from "react";

import CancelIcon from "@mui/icons-material/Cancel";
import CheckCircleIcon from "@mui/icons-material/CheckCircle";

import { TableCell } from "../../../components/Table/TableCell";
import { NavigatingTableRow } from "../../../components/Table/TableRow";
import { SHOW_PRICE_RULES } from "../flags";
import { PriceList } from "../types/price_list";

export interface PriceListRowProps {
  priceList: PriceList;
}

export const PriceListRow: React.FC<PriceListRowProps> = ({ priceList }) => (
  <NavigatingTableRow route="pricing.price_list:detail" routeParams={{ id: priceList.id }}>
    <TableCell>{priceList.name}</TableCell>
    <TableCell>{priceList.site_code}</TableCell>
    <TableCell>{priceList.channel}</TableCell>
    <TableCell>{priceList.currency}</TableCell>
    {SHOW_PRICE_RULES && <TableCell>{priceList.price_rule ?? "—"}</TableCell>}
    <TableCell align="right">
      {priceList.is_active ? <CheckCircleIcon color="success" /> : <CancelIcon color="error" />}
    </TableCell>
  </NavigatingTableRow>
);

export default PriceListRow;