// Only fetch the data if coming from another route
if (this.isoData.path == this.context.router.route.match.url) {
- this.state.personRes = Some(
- this.isoData.routeData[0] as GetPersonDetailsResponse
- );
- this.state.loading = false;
+ this.state = {
+ ...this.state,
+ personRes: Some(this.isoData.routeData[0] as GetPersonDetailsResponse),
+ loading: false,
+ };
} else {
this.fetchUserData();
}
-
- this.setPersonBlock();
}
fetchUserData() {
UserService.Instance.myUserInfo.match({
some: mui =>
this.state.personRes.match({
- some: res => {
- this.state.personBlocked = mui.person_blocks
- .map(a => a.target.id)
- .includes(res.person_view.person.id);
- },
+ some: res =>
+ this.setState({
+ personBlocked: mui.person_blocks
+ .map(a => a.target.id)
+ .includes(res.person_view.person.id),
+ }),
none: void 0,
}),
none: void 0,
}
componentDidMount() {
+ this.setPersonBlock();
setupTippy();
}
}
get documentTitle(): string {
- return this.state.siteRes.site_view.match({
- some: siteView =>
- this.state.personRes.match({
- some: res =>
- `@${res.person_view.person.name} - ${siteView.site.name}`,
- none: "",
- }),
+ return this.state.personRes.match({
+ some: res =>
+ `@${res.person_view.person.name} - ${this.state.siteRes.site_view.site.name}`,
none: "",
});
}
render() {
return (
- <div class="container">
+ <div className="container-lg">
{this.state.loading ? (
<h5>
<Spinner large />
) : (
this.state.personRes.match({
some: res => (
- <div class="row">
- <div class="col-12 col-md-8">
+ <div className="row">
+ <div className="col-12 col-md-8">
<>
<HtmlTags
title={this.documentTitle}
enableNsfw={enableNsfw(this.state.siteRes)}
view={this.state.view}
onPageChange={this.handlePageChange}
+ allLanguages={this.state.siteRes.all_languages}
+ siteLanguages={this.state.siteRes.discussion_languages}
/>
</div>
{!this.state.loading && (
- <div class="col-12 col-md-4">
+ <div className="col-12 col-md-4">
{this.moderates()}
{this.amCurrentUser && this.follows()}
</div>
viewRadios() {
return (
- <div class="btn-group btn-group-toggle flex-wrap mb-2">
+ <div className="btn-group btn-group-toggle flex-wrap mb-2">
<label
className={`btn btn-outline-secondary pointer
${this.state.view == PersonDetailsView.Overview && "active"}
return (
<div className="mb-2">
- <span class="mr-3">{this.viewRadios()}</span>
+ <span className="mr-3">{this.viewRadios()}</span>
<SortSelect
sort={this.state.sort}
onChange={this.handleSortChange}
banner={pv.person.banner}
icon={pv.person.avatar}
/>
- <div class="mb-3">
- <div class="">
- <div class="mb-0 d-flex flex-wrap">
+ <div className="mb-3">
+ <div className="">
+ <div className="mb-0 d-flex flex-wrap">
<div>
- {pv.person.display_name && (
- <h5 class="mb-0">{pv.person.display_name}</h5>
- )}
- <ul class="list-inline mb-2">
+ {pv.person.display_name.match({
+ some: displayName => (
+ <h5 className="mb-0">{displayName}</h5>
+ ),
+ none: <></>,
+ })}
+ <ul className="list-inline mb-2">
<li className="list-inline-item">
<PersonListing
person={pv.person}
{i18n.t("banned")}
</li>
)}
+ {pv.person.deleted && (
+ <li className="list-inline-item badge badge-danger">
+ {i18n.t("deleted")}
+ </li>
+ )}
{pv.person.admin && (
<li className="list-inline-item badge badge-light">
{i18n.t("admin")}
none: <></>,
})}
<div>
- <ul class="list-inline mb-2">
+ <ul className="list-inline mb-2">
<li className="list-inline-item badge badge-light">
{i18n.t("number_of_posts", {
count: pv.counts.post_count,
</li>
</ul>
</div>
- <div class="text-muted">
+ <div className="text-muted">
{i18n.t("joined")}{" "}
<MomentTime
published={pv.person.published}
<>
{this.state.showBanDialog && (
<form onSubmit={linkEvent(this, this.handleModBanSubmit)}>
- <div class="form-group row col-12">
- <label class="col-form-label" htmlFor="profile-ban-reason">
+ <div className="form-group row col-12">
+ <label
+ className="col-form-label"
+ htmlFor="profile-ban-reason"
+ >
{i18n.t("reason")}
</label>
<input
type="text"
id="profile-ban-reason"
- class="form-control mr-2"
+ className="form-control mr-2"
placeholder={i18n.t("reason")}
value={toUndefined(this.state.banReason)}
onInput={linkEvent(this, this.handleModBanReasonChange)}
/>
- <label class="col-form-label" htmlFor={`mod-ban-expires`}>
+ <label className="col-form-label" htmlFor={`mod-ban-expires`}>
{i18n.t("expires")}
</label>
<input
type="number"
id={`mod-ban-expires`}
- class="form-control mr-2"
+ className="form-control mr-2"
placeholder={i18n.t("number_of_days")}
value={toUndefined(this.state.banExpireDays)}
onInput={linkEvent(this, this.handleModBanExpireDaysChange)}
/>
- <div class="form-group">
- <div class="form-check">
+ <div className="form-group">
+ <div className="form-check">
<input
- class="form-check-input"
+ className="form-check-input"
id="mod-ban-remove-data"
type="checkbox"
checked={this.state.removeData}
)}
/>
<label
- class="form-check-label"
+ className="form-check-label"
htmlFor="mod-ban-remove-data"
title={i18n.t("remove_content_more")}
>
{/* <label class="col-form-label">Expires</label> */}
{/* <input type="date" class="form-control mr-2" placeholder={i18n.t('expires')} value={this.state.banExpires} onInput={linkEvent(this, this.handleModBanExpiresChange)} /> */}
{/* </div> */}
- <div class="form-group row">
+ <div className="form-group row">
<button
- type="cancel"
- class="btn btn-secondary mr-2"
+ type="reset"
+ className="btn btn-secondary mr-2"
aria-label={i18n.t("cancel")}
onClick={linkEvent(this, this.handleModBanSubmitCancel)}
>
</button>
<button
type="submit"
- class="btn btn-secondary"
+ className="btn btn-secondary"
aria-label={i18n.t("ban")}
>
{i18n.t("ban")} {pv.person.name}
});
}
- // TODO test this, make sure its good
moderates() {
return this.state.personRes
.map(r => r.moderates)
.match({
some: moderates => {
if (moderates.length > 0) {
- <div class="card border-secondary mb-3">
- <div class="card-body">
- <h5>{i18n.t("moderates")}</h5>
- <ul class="list-unstyled mb-0">
- {moderates.map(cmv => (
- <li>
- <CommunityLink community={cmv.community} />
- </li>
- ))}
- </ul>
+ return (
+ <div className="card border-secondary mb-3">
+ <div className="card-body">
+ <h5>{i18n.t("moderates")}</h5>
+ <ul className="list-unstyled mb-0">
+ {moderates.map(cmv => (
+ <li key={cmv.community.id}>
+ <CommunityLink community={cmv.community} />
+ </li>
+ ))}
+ </ul>
+ </div>
</div>
- </div>;
+ );
+ } else {
+ return <></>;
}
},
none: void 0,
.match({
some: follows => {
if (follows.length > 0) {
- <div class="card border-secondary mb-3">
- <div class="card-body">
- <h5>{i18n.t("subscribed")}</h5>
- <ul class="list-unstyled mb-0">
- {follows.map(cfv => (
- <li>
- <CommunityLink community={cfv.community} />
- </li>
- ))}
- </ul>
+ return (
+ <div className="card border-secondary mb-3">
+ <div className="card-body">
+ <h5>{i18n.t("subscribed")}</h5>
+ <ul className="list-unstyled mb-0">
+ {follows.map(cfv => (
+ <li key={cfv.community.id}>
+ <CommunityLink community={cfv.community} />
+ </li>
+ ))}
+ </ul>
+ </div>
</div>
- </div>;
+ );
+ } else {
+ return <></>;
}
},
none: void 0,
this.props.history.push(
`${typeView}/view/${viewStr}/sort/${sortStr}/page/${page}`
);
- this.state.loading = true;
- this.setState(this.state);
+ this.setState({ loading: true });
this.fetchUserData();
}
}
handleModBanShow(i: Profile) {
- i.state.showBanDialog = true;
- i.setState(i.state);
+ i.setState({ showBanDialog: true });
}
handleModBanReasonChange(i: Profile, event: any) {
- i.state.banReason = event.target.value;
- i.setState(i.state);
+ i.setState({ banReason: event.target.value });
}
handleModBanExpireDaysChange(i: Profile, event: any) {
- i.state.banExpireDays = event.target.value;
- i.setState(i.state);
+ i.setState({ banExpireDays: event.target.value });
}
handleModRemoveDataChange(i: Profile, event: any) {
- i.state.removeData = event.target.checked;
- i.setState(i.state);
+ i.setState({ removeData: event.target.checked });
}
handleModBanSubmitCancel(i: Profile, event?: any) {
event.preventDefault();
- i.state.showBanDialog = false;
- i.setState(i.state);
+ i.setState({ showBanDialog: false });
}
handleModBanSubmit(i: Profile, event?: any) {
// If its an unban, restore all their data
let ban = !person.banned;
if (ban == false) {
- i.state.removeData = false;
+ i.setState({ removeData: false });
}
let form = new BanPerson({
person_id: person.id,
});
WebSocketService.Instance.send(wsClient.banPerson(form));
- i.state.showBanDialog = false;
- i.setState(i.state);
+ i.setState({ showBanDialog: false });
},
none: void 0,
});
msg,
GetPersonDetailsResponse
);
- this.state.personRes = Some(data);
- this.state.loading = false;
+ this.setState({ personRes: Some(data), loading: false });
this.setPersonBlock();
- this.setState(this.state);
restoreScrollPosition(this.context);
} else if (op == UserOperation.AddAdmin) {
let data = wsJsonToRes<AddAdminResponse>(msg, AddAdminResponse);
- this.state.siteRes.admins = data.admins;
- this.setState(this.state);
+ this.setState(s => ((s.siteRes.admins = data.admins), s));
} else if (op == UserOperation.CreateCommentLike) {
let data = wsJsonToRes<CommentResponse>(msg, CommentResponse);
createCommentLikeRes(
op == UserOperation.DeletePost ||
op == UserOperation.RemovePost ||
op == UserOperation.LockPost ||
- op == UserOperation.StickyPost ||
+ op == UserOperation.FeaturePost ||
op == UserOperation.SavePost
) {
let data = wsJsonToRes<PostResponse>(msg, PostResponse);
projects / lemmy-ui.git / blobdiff