import { Link } from "inferno-router";
import {
CommunityAggregates,
- CommunityView,
+ CommunityId,
SiteAggregates,
} from "lemmy-js-client";
import { i18n } from "../../i18next";
interface BadgesProps {
counts: CommunityAggregates | SiteAggregates;
- online: number;
- community_view?: CommunityView;
+ communityId?: CommunityId;
}
const isCommunityAggregates = (
return "subscribers" in counts;
};
-export const Badges = ({ counts, community_view, online }: BadgesProps) => {
+const isSiteAggregates = (
+ counts: CommunityAggregates | SiteAggregates
+): counts is SiteAggregates => {
+ return "communities" in counts;
+};
+
+export const Badges = ({ counts, communityId }: BadgesProps) => {
return (
- <ul className="my-1 list-inline">
- <li className="list-inline-item badge badge-secondary">
- {i18n.t("number_online", {
- count: online,
- formattedCount: numToSI(online),
- })}
- </li>
+ <ul className="badges my-1 list-inline">
<li
- className="list-inline-item badge badge-secondary pointer"
+ className="list-inline-item badge text-bg-secondary pointer"
data-tippy-content={i18n.t("active_users_in_the_last_day", {
count: Number(counts.users_active_day),
formattedCount: numToSI(counts.users_active_day),
/ {i18n.t("day")}
</li>
<li
- className="list-inline-item badge badge-secondary pointer"
+ className="list-inline-item badge text-bg-secondary pointer"
data-tippy-content={i18n.t("active_users_in_the_last_week", {
count: Number(counts.users_active_week),
formattedCount: numToSI(counts.users_active_week),
/ {i18n.t("week")}
</li>
<li
- className="list-inline-item badge badge-secondary pointer"
+ className="list-inline-item badge text-bg-secondary pointer"
data-tippy-content={i18n.t("active_users_in_the_last_month", {
count: Number(counts.users_active_month),
formattedCount: numToSI(counts.users_active_month),
/ {i18n.t("month")}
</li>
<li
- className="list-inline-item badge badge-secondary pointer"
+ className="list-inline-item badge text-bg-secondary pointer"
data-tippy-content={i18n.t("active_users_in_the_last_six_months", {
count: Number(counts.users_active_half_year),
formattedCount: numToSI(counts.users_active_half_year),
})}{" "}
/ {i18n.t("number_of_months", { count: 6, formattedCount: 6 })}
</li>
+ {isSiteAggregates(counts) && (
+ <>
+ <li className="list-inline-item badge text-bg-secondary">
+ {i18n.t("number_of_users", {
+ count: Number(counts.users),
+ formattedCount: numToSI(counts.users),
+ })}
+ </li>
+ <li className="list-inline-item badge text-bg-secondary">
+ {i18n.t("number_of_communities", {
+ count: Number(counts.communities),
+ formattedCount: numToSI(counts.communities),
+ })}
+ </li>
+ </>
+ )}
{isCommunityAggregates(counts) && (
- <li className="list-inline-item badge badge-secondary">
+ <li className="list-inline-item badge text-bg-secondary">
{i18n.t("number_of_subscribers", {
count: Number(counts.subscribers),
formattedCount: numToSI(counts.subscribers),
})}
</li>
)}
- <li className="list-inline-item badge badge-secondary">
+ <li className="list-inline-item badge text-bg-secondary">
{i18n.t("number_of_posts", {
count: Number(counts.posts),
formattedCount: numToSI(counts.posts),
})}
</li>
- <li className="list-inline-item badge badge-secondary">
+ <li className="list-inline-item badge text-bg-secondary">
{i18n.t("number_of_comments", {
count: Number(counts.comments),
formattedCount: numToSI(counts.comments),
</li>
<li className="list-inline-item">
<Link
- className="badge badge-primary"
- to={`/modlog/${community_view ?? community_view?.community.id}`}
+ className="badge text-bg-primary"
+ to={`/modlog${communityId ? `/${communityId}` : ""}`}
>
{i18n.t("modlog")}
</Link>