mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-11-08 09:34:16 +00:00
Adding site sidebar for remote communities. Fixes #626
This commit is contained in:
parent
130bfc9c8b
commit
630c7344b3
|
@ -74,7 +74,7 @@
|
|||
"eslint-plugin-prettier": "^4.0.0",
|
||||
"husky": "^7.0.4",
|
||||
"import-sort-style-module": "^6.0.0",
|
||||
"lemmy-js-client": "0.16.0-rc.1",
|
||||
"lemmy-js-client": "0.16.4-rc.1",
|
||||
"lint-staged": "^12.4.1",
|
||||
"mini-css-extract-plugin": "^2.6.0",
|
||||
"node-fetch": "^2.6.1",
|
||||
|
|
|
@ -60,6 +60,7 @@ import { Icon, Spinner } from "../common/icon";
|
|||
import { Paginator } from "../common/paginator";
|
||||
import { SortSelect } from "../common/sort-select";
|
||||
import { Sidebar } from "../community/sidebar";
|
||||
import { SiteSidebar } from "../home/site-sidebar";
|
||||
import { PostListings } from "../post/post-listings";
|
||||
import { CommunityLink } from "./community-link";
|
||||
|
||||
|
@ -268,13 +269,20 @@ export class Community extends Component<any, State> {
|
|||
/>
|
||||
</button>
|
||||
{this.state.showSidebarMobile && (
|
||||
<Sidebar
|
||||
community_view={cv}
|
||||
moderators={this.state.communityRes.moderators}
|
||||
admins={this.state.siteRes.admins}
|
||||
online={this.state.communityRes.online}
|
||||
enableNsfw={this.state.siteRes.site_view.site.enable_nsfw}
|
||||
/>
|
||||
<>
|
||||
<Sidebar
|
||||
community_view={cv}
|
||||
moderators={this.state.communityRes.moderators}
|
||||
admins={this.state.siteRes.admins}
|
||||
online={this.state.communityRes.online}
|
||||
enableNsfw={
|
||||
this.state.siteRes.site_view.site.enable_nsfw
|
||||
}
|
||||
/>
|
||||
{!cv.community.local && this.state.communityRes.site && (
|
||||
<SiteSidebar site={this.state.communityRes.site} />
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
{this.selects()}
|
||||
|
@ -292,6 +300,9 @@ export class Community extends Component<any, State> {
|
|||
online={this.state.communityRes.online}
|
||||
enableNsfw={this.state.siteRes.site_view.site.enable_nsfw}
|
||||
/>
|
||||
{!cv.community.local && this.state.communityRes.site && (
|
||||
<SiteSidebar site={this.state.communityRes.site} />
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
|
|
@ -40,9 +40,7 @@ import {
|
|||
getListingTypeFromProps,
|
||||
getPageFromProps,
|
||||
getSortTypeFromProps,
|
||||
mdToHtml,
|
||||
notifyPost,
|
||||
numToSI,
|
||||
relTags,
|
||||
restoreScrollPosition,
|
||||
saveCommentRes,
|
||||
|
@ -59,7 +57,6 @@ import {
|
|||
wsUserOp,
|
||||
} from "../../utils";
|
||||
import { CommentNodes } from "../comment/comment-nodes";
|
||||
import { BannerIconHeader } from "../common/banner-icon-header";
|
||||
import { DataTypeSelect } from "../common/data-type-select";
|
||||
import { HtmlTags } from "../common/html-tags";
|
||||
import { Icon, Spinner } from "../common/icon";
|
||||
|
@ -67,18 +64,15 @@ import { ListingTypeSelect } from "../common/listing-type-select";
|
|||
import { Paginator } from "../common/paginator";
|
||||
import { SortSelect } from "../common/sort-select";
|
||||
import { CommunityLink } from "../community/community-link";
|
||||
import { PersonListing } from "../person/person-listing";
|
||||
import { PostListings } from "../post/post-listings";
|
||||
import { SiteForm } from "./site-form";
|
||||
import { SiteSidebar } from "./site-sidebar";
|
||||
|
||||
interface HomeState {
|
||||
trendingCommunities: CommunityView[];
|
||||
siteRes: GetSiteResponse;
|
||||
showEditSite: boolean;
|
||||
showSubscribedMobile: boolean;
|
||||
showTrendingMobile: boolean;
|
||||
showSidebarMobile: boolean;
|
||||
sidebarCollapsed: boolean;
|
||||
subscribedCollapsed: boolean;
|
||||
loading: boolean;
|
||||
posts: PostView[];
|
||||
|
@ -109,12 +103,10 @@ export class Home extends Component<any, HomeState> {
|
|||
private emptyState: HomeState = {
|
||||
trendingCommunities: [],
|
||||
siteRes: this.isoData.site_res,
|
||||
showEditSite: false,
|
||||
showSubscribedMobile: false,
|
||||
showTrendingMobile: false,
|
||||
showSidebarMobile: false,
|
||||
subscribedCollapsed: false,
|
||||
sidebarCollapsed: false,
|
||||
loading: true,
|
||||
posts: [],
|
||||
comments: [],
|
||||
|
@ -128,7 +120,6 @@ export class Home extends Component<any, HomeState> {
|
|||
super(props, context);
|
||||
|
||||
this.state = this.emptyState;
|
||||
this.handleEditCancel = this.handleEditCancel.bind(this);
|
||||
this.handleSortChange = this.handleSortChange.bind(this);
|
||||
this.handleListingTypeChange = this.handleListingTypeChange.bind(this);
|
||||
this.handleDataTypeChange = this.handleDataTypeChange.bind(this);
|
||||
|
@ -293,6 +284,7 @@ export class Home extends Component<any, HomeState> {
|
|||
}
|
||||
|
||||
mobileView() {
|
||||
let siteRes = this.state.siteRes;
|
||||
return (
|
||||
<div class="row">
|
||||
<div class="col-12">
|
||||
|
@ -337,19 +329,22 @@ export class Home extends Component<any, HomeState> {
|
|||
classes="icon-inline"
|
||||
/>
|
||||
</button>
|
||||
{this.state.showSubscribedMobile && (
|
||||
<div class="col-12 card border-secondary mb-3">
|
||||
<div class="card-body">{this.subscribedCommunities()}</div>
|
||||
</div>
|
||||
{this.state.showSidebarMobile && (
|
||||
<SiteSidebar
|
||||
site={siteRes.site_view.site}
|
||||
admins={siteRes.admins}
|
||||
counts={siteRes.site_view.counts}
|
||||
online={siteRes.online}
|
||||
/>
|
||||
)}
|
||||
{this.state.showTrendingMobile && (
|
||||
<div class="col-12 card border-secondary mb-3">
|
||||
<div class="card-body">{this.trendingCommunities()}</div>
|
||||
</div>
|
||||
)}
|
||||
{this.state.showSidebarMobile && (
|
||||
{this.state.showSubscribedMobile && (
|
||||
<div class="col-12 card border-secondary mb-3">
|
||||
<div class="card-body">{this.sidebar()}</div>
|
||||
<div class="card-body">{this.subscribedCommunities()}</div>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
@ -358,6 +353,7 @@ export class Home extends Component<any, HomeState> {
|
|||
}
|
||||
|
||||
mySidebar() {
|
||||
let siteRes = this.state.siteRes;
|
||||
return (
|
||||
<div>
|
||||
{!this.state.loading && (
|
||||
|
@ -370,9 +366,12 @@ export class Home extends Component<any, HomeState> {
|
|||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card border-secondary mb-3">
|
||||
<div class="card-body">{this.sidebar()}</div>
|
||||
</div>
|
||||
<SiteSidebar
|
||||
site={siteRes.site_view.site}
|
||||
admins={siteRes.admins}
|
||||
counts={siteRes.site_view.counts}
|
||||
online={siteRes.online}
|
||||
/>
|
||||
|
||||
{UserService.Instance.myUserInfo &&
|
||||
UserService.Instance.myUserInfo.follows.length > 0 && (
|
||||
|
@ -460,30 +459,6 @@ export class Home extends Component<any, HomeState> {
|
|||
);
|
||||
}
|
||||
|
||||
sidebar() {
|
||||
let site = this.state.siteRes.site_view.site;
|
||||
return (
|
||||
<div>
|
||||
{!this.state.showEditSite ? (
|
||||
<div>
|
||||
<div class="mb-2">
|
||||
{this.siteName()}
|
||||
{this.adminButtons()}
|
||||
</div>
|
||||
{!this.state.sidebarCollapsed && (
|
||||
<>
|
||||
<BannerIconHeader banner={site.banner} />
|
||||
{this.siteInfo()}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<SiteForm site={site} onCancel={this.handleEditCancel} />
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
updateUrl(paramUpdates: UrlParams) {
|
||||
const listingTypeStr = paramUpdates.listingType || this.state.listingType;
|
||||
const dataTypeStr = paramUpdates.dataType || DataType[this.state.dataType];
|
||||
|
@ -494,179 +469,6 @@ export class Home extends Component<any, HomeState> {
|
|||
);
|
||||
}
|
||||
|
||||
siteInfo() {
|
||||
let site = this.state.siteRes.site_view.site;
|
||||
return (
|
||||
<div>
|
||||
{site.description && <h6>{site.description}</h6>}
|
||||
{site.sidebar && this.siteSidebar()}
|
||||
{this.badges()}
|
||||
{this.admins()}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
siteName() {
|
||||
let site = this.state.siteRes.site_view.site;
|
||||
return (
|
||||
site.name && (
|
||||
<h5 class="mb-0 d-inline">
|
||||
{site.name}
|
||||
<button
|
||||
class="btn btn-sm text-muted"
|
||||
onClick={linkEvent(this, this.handleCollapseSidebar)}
|
||||
aria-label={i18n.t("collapse")}
|
||||
data-tippy-content={i18n.t("collapse")}
|
||||
>
|
||||
{this.state.sidebarCollapsed ? (
|
||||
<Icon icon="plus-square" classes="icon-inline" />
|
||||
) : (
|
||||
<Icon icon="minus-square" classes="icon-inline" />
|
||||
)}
|
||||
</button>
|
||||
</h5>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
admins() {
|
||||
return (
|
||||
<ul class="mt-1 list-inline small mb-0">
|
||||
<li class="list-inline-item">{i18n.t("admins")}:</li>
|
||||
{this.state.siteRes.admins.map(av => (
|
||||
<li class="list-inline-item">
|
||||
<PersonListing person={av.person} />
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
}
|
||||
|
||||
badges() {
|
||||
let counts = this.state.siteRes.site_view.counts;
|
||||
return (
|
||||
<ul class="my-2 list-inline">
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_online", {
|
||||
count: this.state.siteRes.online,
|
||||
formattedCount: numToSI(this.state.siteRes.online),
|
||||
})}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_day", {
|
||||
count: counts.users_active_day,
|
||||
formattedCount: numToSI(counts.users_active_day),
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_day,
|
||||
formattedCount: numToSI(counts.users_active_day),
|
||||
})}{" "}
|
||||
/ {i18n.t("day")}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_week", {
|
||||
count: counts.users_active_week,
|
||||
formattedCount: counts.users_active_week,
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_week,
|
||||
formattedCount: numToSI(counts.users_active_week),
|
||||
})}{" "}
|
||||
/ {i18n.t("week")}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_month", {
|
||||
count: counts.users_active_month,
|
||||
formattedCount: counts.users_active_month,
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_month,
|
||||
formattedCount: numToSI(counts.users_active_month),
|
||||
})}{" "}
|
||||
/ {i18n.t("month")}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_six_months", {
|
||||
count: counts.users_active_half_year,
|
||||
formattedCount: counts.users_active_half_year,
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_half_year,
|
||||
formattedCount: numToSI(counts.users_active_half_year),
|
||||
})}{" "}
|
||||
/ {i18n.t("number_of_months", { count: 6, formattedCount: 6 })}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users,
|
||||
formattedCount: numToSI(counts.users),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_communities", {
|
||||
count: counts.communities,
|
||||
formattedCount: numToSI(counts.communities),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_posts", {
|
||||
count: counts.posts,
|
||||
formattedCount: numToSI(counts.posts),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_comments", {
|
||||
count: counts.comments,
|
||||
formattedCount: numToSI(counts.comments),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item">
|
||||
<Link className="badge badge-primary" to="/modlog">
|
||||
{i18n.t("modlog")}
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
);
|
||||
}
|
||||
|
||||
adminButtons() {
|
||||
return (
|
||||
this.canAdmin && (
|
||||
<ul class="list-inline mb-1 text-muted font-weight-bold">
|
||||
<li className="list-inline-item-action">
|
||||
<button
|
||||
class="btn btn-link d-inline-block text-muted"
|
||||
onClick={linkEvent(this, this.handleEditClick)}
|
||||
aria-label={i18n.t("edit")}
|
||||
data-tippy-content={i18n.t("edit")}
|
||||
>
|
||||
<Icon icon="edit" classes="icon-inline" />
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
siteSidebar() {
|
||||
return (
|
||||
<div
|
||||
className="md-div"
|
||||
dangerouslySetInnerHTML={mdToHtml(
|
||||
this.state.siteRes.site_view.site.sidebar
|
||||
)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
posts() {
|
||||
return (
|
||||
<div class="main-content-wrapper">
|
||||
|
@ -767,25 +569,6 @@ export class Home extends Component<any, HomeState> {
|
|||
);
|
||||
}
|
||||
|
||||
get canAdmin(): boolean {
|
||||
return (
|
||||
UserService.Instance.myUserInfo &&
|
||||
this.state.siteRes.admins
|
||||
.map(a => a.person.id)
|
||||
.includes(UserService.Instance.myUserInfo.local_user_view.person.id)
|
||||
);
|
||||
}
|
||||
|
||||
handleEditClick(i: Home) {
|
||||
i.state.showEditSite = true;
|
||||
i.setState(i.state);
|
||||
}
|
||||
|
||||
handleEditCancel() {
|
||||
this.state.showEditSite = false;
|
||||
this.setState(this.state);
|
||||
}
|
||||
|
||||
handleShowSubscribedMobile(i: Home) {
|
||||
i.state.showSubscribedMobile = !i.state.showSubscribedMobile;
|
||||
i.setState(i.state);
|
||||
|
@ -806,11 +589,6 @@ export class Home extends Component<any, HomeState> {
|
|||
i.setState(i.state);
|
||||
}
|
||||
|
||||
handleCollapseSidebar(i: Home) {
|
||||
i.state.sidebarCollapsed = !i.state.sidebarCollapsed;
|
||||
i.setState(i.state);
|
||||
}
|
||||
|
||||
handlePageChange(page: number) {
|
||||
this.updateUrl({ page });
|
||||
window.scrollTo(0, 0);
|
||||
|
@ -873,7 +651,6 @@ export class Home extends Component<any, HomeState> {
|
|||
} else if (op == UserOperation.EditSite) {
|
||||
let data = wsJsonToRes<SiteResponse>(msg).data;
|
||||
this.state.siteRes.site_view = data.site_view;
|
||||
this.state.showEditSite = false;
|
||||
this.setState(this.state);
|
||||
toast(i18n.t("site_saved"));
|
||||
} else if (op == UserOperation.GetPosts) {
|
||||
|
|
|
@ -16,6 +16,7 @@ import { MarkdownTextArea } from "../common/markdown-textarea";
|
|||
interface SiteFormProps {
|
||||
site?: Site; // If a site is given, that means this is an edit
|
||||
onCancel?(): any;
|
||||
onEdit?(): any;
|
||||
}
|
||||
|
||||
interface SiteFormState {
|
||||
|
@ -404,6 +405,7 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
|
|||
i.state.loading = true;
|
||||
if (i.props.site) {
|
||||
WebSocketService.Instance.send(wsClient.editSite(i.state.siteForm));
|
||||
i.props.onEdit();
|
||||
} else {
|
||||
let form: CreateSite = {
|
||||
name: i.state.siteForm.name || "My site",
|
||||
|
|
267
src/shared/components/home/site-sidebar.tsx
Normal file
267
src/shared/components/home/site-sidebar.tsx
Normal file
|
@ -0,0 +1,267 @@
|
|||
import { Component, linkEvent } from "inferno";
|
||||
import { Link } from "inferno-router";
|
||||
import { PersonViewSafe, Site, SiteAggregates } from "lemmy-js-client";
|
||||
import { i18n } from "../../i18next";
|
||||
import { UserService } from "../../services";
|
||||
import { mdToHtml, numToSI } from "../../utils";
|
||||
import { BannerIconHeader } from "../common/banner-icon-header";
|
||||
import { Icon } from "../common/icon";
|
||||
import { PersonListing } from "../person/person-listing";
|
||||
import { SiteForm } from "./site-form";
|
||||
|
||||
interface SiteSidebarProps {
|
||||
site: Site;
|
||||
counts?: SiteAggregates;
|
||||
admins?: PersonViewSafe[];
|
||||
online?: number;
|
||||
}
|
||||
|
||||
interface SiteSidebarState {
|
||||
collapsed: boolean;
|
||||
showEdit: boolean;
|
||||
}
|
||||
|
||||
export class SiteSidebar extends Component<SiteSidebarProps, SiteSidebarState> {
|
||||
private emptyState: SiteSidebarState = {
|
||||
collapsed: false,
|
||||
showEdit: false,
|
||||
};
|
||||
|
||||
constructor(props: any, context: any) {
|
||||
super(props, context);
|
||||
this.state = this.emptyState;
|
||||
this.handleEditCancel = this.handleEditCancel.bind(this);
|
||||
this.handleEditSite = this.handleEditSite.bind(this);
|
||||
}
|
||||
|
||||
render() {
|
||||
let site = this.props.site;
|
||||
return (
|
||||
<div class="card border-secondary mb-3">
|
||||
<div class="card-body">
|
||||
{!this.state.showEdit ? (
|
||||
<div>
|
||||
<div class="mb-2">
|
||||
{this.siteName()}
|
||||
{this.props.admins && this.adminButtons()}
|
||||
</div>
|
||||
{!this.state.collapsed && (
|
||||
<>
|
||||
<BannerIconHeader banner={site.banner} />
|
||||
{this.siteInfo()}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<SiteForm
|
||||
site={site}
|
||||
onEdit={this.handleEditSite}
|
||||
onCancel={this.handleEditCancel}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
siteName() {
|
||||
let site = this.props.site;
|
||||
return (
|
||||
site.name && (
|
||||
<h5 class="mb-0 d-inline">
|
||||
{site.name}
|
||||
<button
|
||||
class="btn btn-sm text-muted"
|
||||
onClick={linkEvent(this, this.handleCollapseSidebar)}
|
||||
aria-label={i18n.t("collapse")}
|
||||
data-tippy-content={i18n.t("collapse")}
|
||||
>
|
||||
{this.state.collapsed ? (
|
||||
<Icon icon="plus-square" classes="icon-inline" />
|
||||
) : (
|
||||
<Icon icon="minus-square" classes="icon-inline" />
|
||||
)}
|
||||
</button>
|
||||
</h5>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
siteInfo() {
|
||||
let site = this.props.site;
|
||||
return (
|
||||
<div>
|
||||
{site.description && <h6>{site.description}</h6>}
|
||||
{site.sidebar && this.siteSidebar()}
|
||||
{this.props.counts && this.badges()}
|
||||
{this.props.admins && this.admins()}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
adminButtons() {
|
||||
return (
|
||||
this.canAdmin && (
|
||||
<ul class="list-inline mb-1 text-muted font-weight-bold">
|
||||
<li className="list-inline-item-action">
|
||||
<button
|
||||
class="btn btn-link d-inline-block text-muted"
|
||||
onClick={linkEvent(this, this.handleEditClick)}
|
||||
aria-label={i18n.t("edit")}
|
||||
data-tippy-content={i18n.t("edit")}
|
||||
>
|
||||
<Icon icon="edit" classes="icon-inline" />
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
siteSidebar() {
|
||||
return (
|
||||
<div
|
||||
className="md-div"
|
||||
dangerouslySetInnerHTML={mdToHtml(this.props.site.sidebar)}
|
||||
/>
|
||||
);
|
||||
}
|
||||
|
||||
admins() {
|
||||
return (
|
||||
<ul class="mt-1 list-inline small mb-0">
|
||||
<li class="list-inline-item">{i18n.t("admins")}:</li>
|
||||
{this.props.admins?.map(av => (
|
||||
<li class="list-inline-item">
|
||||
<PersonListing person={av.person} />
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
);
|
||||
}
|
||||
|
||||
badges() {
|
||||
let counts = this.props.counts;
|
||||
let online = this.props.online;
|
||||
return (
|
||||
<ul class="my-2 list-inline">
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_online", {
|
||||
count: online,
|
||||
formattedCount: numToSI(online),
|
||||
})}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_day", {
|
||||
count: counts.users_active_day,
|
||||
formattedCount: numToSI(counts.users_active_day),
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_day,
|
||||
formattedCount: numToSI(counts.users_active_day),
|
||||
})}{" "}
|
||||
/ {i18n.t("day")}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_week", {
|
||||
count: counts.users_active_week,
|
||||
formattedCount: counts.users_active_week,
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_week,
|
||||
formattedCount: numToSI(counts.users_active_week),
|
||||
})}{" "}
|
||||
/ {i18n.t("week")}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_month", {
|
||||
count: counts.users_active_month,
|
||||
formattedCount: counts.users_active_month,
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_month,
|
||||
formattedCount: numToSI(counts.users_active_month),
|
||||
})}{" "}
|
||||
/ {i18n.t("month")}
|
||||
</li>
|
||||
<li
|
||||
className="list-inline-item badge badge-secondary pointer"
|
||||
data-tippy-content={i18n.t("active_users_in_the_last_six_months", {
|
||||
count: counts.users_active_half_year,
|
||||
formattedCount: counts.users_active_half_year,
|
||||
})}
|
||||
>
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users_active_half_year,
|
||||
formattedCount: numToSI(counts.users_active_half_year),
|
||||
})}{" "}
|
||||
/ {i18n.t("number_of_months", { count: 6, formattedCount: 6 })}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_users", {
|
||||
count: counts.users,
|
||||
formattedCount: numToSI(counts.users),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_communities", {
|
||||
count: counts.communities,
|
||||
formattedCount: numToSI(counts.communities),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_posts", {
|
||||
count: counts.posts,
|
||||
formattedCount: numToSI(counts.posts),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item badge badge-secondary">
|
||||
{i18n.t("number_of_comments", {
|
||||
count: counts.comments,
|
||||
formattedCount: numToSI(counts.comments),
|
||||
})}
|
||||
</li>
|
||||
<li className="list-inline-item">
|
||||
<Link className="badge badge-primary" to="/modlog">
|
||||
{i18n.t("modlog")}
|
||||
</Link>
|
||||
</li>
|
||||
</ul>
|
||||
);
|
||||
}
|
||||
|
||||
get canAdmin(): boolean {
|
||||
return (
|
||||
UserService.Instance.myUserInfo &&
|
||||
this.props.admins
|
||||
.map(a => a.person.id)
|
||||
.includes(UserService.Instance.myUserInfo.local_user_view.person.id)
|
||||
);
|
||||
}
|
||||
|
||||
handleCollapseSidebar(i: SiteSidebar) {
|
||||
i.state.collapsed = !i.state.collapsed;
|
||||
i.setState(i.state);
|
||||
}
|
||||
|
||||
handleEditClick(i: SiteSidebar) {
|
||||
i.state.showEdit = true;
|
||||
i.setState(i.state);
|
||||
}
|
||||
|
||||
handleEditSite() {
|
||||
this.state.showEdit = false;
|
||||
this.setState(this.state);
|
||||
}
|
||||
|
||||
handleEditCancel() {
|
||||
this.state.showEdit = false;
|
||||
this.setState(this.state);
|
||||
}
|
||||
}
|
|
@ -4813,10 +4813,10 @@ lcid@^1.0.0:
|
|||
dependencies:
|
||||
invert-kv "^1.0.0"
|
||||
|
||||
lemmy-js-client@0.16.0-rc.1:
|
||||
version "0.16.0-rc.1"
|
||||
resolved "https://registry.yarnpkg.com/lemmy-js-client/-/lemmy-js-client-0.16.0-rc.1.tgz#14c4a526abf4b171c8afe4efbe2a62dcaf6a6f17"
|
||||
integrity sha512-0hR/gHHsokp46whIHGMBQO2zBKWM7bT6mwKNMZxPvyJo+YW9EbKTO5edjF5E4v8nf3FuIE+gFtm5NFAjCaeWJg==
|
||||
lemmy-js-client@0.16.4-rc.1:
|
||||
version "0.16.4-rc.1"
|
||||
resolved "https://registry.yarnpkg.com/lemmy-js-client/-/lemmy-js-client-0.16.4-rc.1.tgz#dfa94a152a7abe75f50f2599a8d9b40c143f37ff"
|
||||
integrity sha512-94Xh7A/WDywRaJ0GPXPaXZhyXqMzK0gAISNSB8m++2mC1WJalOqfjR72q/7PmLGxfjYO88/aWSz4Sk0SXWJjCw==
|
||||
|
||||
levn@^0.4.1:
|
||||
version "0.4.1"
|
||||
|
|
Loading…
Reference in a new issue