"use client";

import Typography from "@mui/material/Typography";

import { useAppLanguage } from "@/components/providers/app-language-provider";
import { formatNumber } from "@/lib/number-utils";

export type DataTableNumberCellProps = {
  value?: string | number | null;
  align?: "left" | "center" | "right";
};

export function DataTableNumberCell({
  value,
  align = "center",
}: DataTableNumberCellProps) {
  const { language } = useAppLanguage();

  return (
    <Typography
      noWrap
      sx={{
        width: "100%",
        color: "text.primary",
        fontSize: 13,
        fontWeight: 500,
        textAlign: align,
      }}
    >
      {formatNumber(value, language)}
    </Typography>
  );
}