import { Text } from '@/components/ui/text';
import {
  DropdownMenu,
  DropdownMenuContent,
  DropdownMenuTrigger,
} from '@/components/ui/dropdown-menu';
import CommonImage from './CommonImage';

interface DataStatsProps {
  total: number;
  active?: number | string;
}

const DataStats = ({ total }: DataStatsProps) => {
  return (
    <Text className="table-bottom-left">
      <DropdownMenu>
        <DropdownMenuTrigger asChild>
          <Text className="table-info">
            <CommonImage
              src="/main/Info.png"
              width={12}
              height={12}
              alt="View Info"
              classname="info-icon"
            />
          </Text>
        </DropdownMenuTrigger>
        <DropdownMenuContent
          side="top"
          sideOffset={12}
          className="p-2 w-40 mb-0 ml-12 table-info-widget"
        >
          <Text className="mb-2 total-table-row" weight="semibold">
            Total : {Math.ceil(total)}
          </Text>
        </DropdownMenuContent>
      </DropdownMenu>
    </Text>
  );
};

export default DataStats;