28 lines
983 B
TypeScript
28 lines
983 B
TypeScript
import { Link } from "react-router";
|
|
import { Fragment } from "react";
|
|
import { useTranslation } from "react-i18next";
|
|
import { useLocaleFormatters } from "~/locale/format";
|
|
|
|
export default function CreditsRemaining({ remaining, redirectTo }: { remaining?: number | "unlimited"; redirectTo: string }) {
|
|
const { t } = useTranslation();
|
|
const formatters = useLocaleFormatters();
|
|
return (
|
|
<Fragment>
|
|
{!!remaining && (
|
|
<Link
|
|
to={redirectTo}
|
|
className="cursor-pointer select-none rounded-full border border-green-200 bg-green-50 px-2 py-1 text-xs text-green-700 hover:bg-green-100"
|
|
>
|
|
{remaining === "unlimited" ? (
|
|
<span>{t("models.credit.unlimited")}</span>
|
|
) : remaining <= 0 ? (
|
|
<span>{t("models.credit.empty")}</span>
|
|
) : (
|
|
<span>{t("models.credit.remaining", { 0: formatters.number(remaining) })}</span>
|
|
)}
|
|
</Link>
|
|
)}
|
|
</Fragment>
|
|
);
|
|
}
|