mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-11-09 10:02:12 +00:00
Merge branch 'main' into add_undetermined_warning
This commit is contained in:
commit
8c54921372
|
@ -305,16 +305,6 @@ pre {
|
|||
transition: width 0.2s ease-out 0s !important;
|
||||
}
|
||||
|
||||
.show-input {
|
||||
width: 13vw !important;
|
||||
}
|
||||
.hide-input {
|
||||
background: transparent !important;
|
||||
background-color: transparent !important;
|
||||
width: 0px !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
br.big {
|
||||
display: block;
|
||||
content: "";
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Component, createRef, linkEvent, RefObject } from "inferno";
|
||||
import { Component, linkEvent } from "inferno";
|
||||
import { NavLink } from "inferno-router";
|
||||
import {
|
||||
CommentResponse,
|
||||
|
@ -44,7 +44,6 @@ interface NavbarState {
|
|||
unreadReportCount: number;
|
||||
unreadApplicationCount: number;
|
||||
searchParam: string;
|
||||
toggleSearch: boolean;
|
||||
showDropdown: boolean;
|
||||
onSiteBanner?(url: string): any;
|
||||
}
|
||||
|
@ -55,14 +54,12 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
private unreadInboxCountSub: Subscription;
|
||||
private unreadReportCountSub: Subscription;
|
||||
private unreadApplicationCountSub: Subscription;
|
||||
private searchTextField: RefObject<HTMLInputElement>;
|
||||
state: NavbarState = {
|
||||
unreadInboxCount: 0,
|
||||
unreadReportCount: 0,
|
||||
unreadApplicationCount: 0,
|
||||
expanded: false,
|
||||
searchParam: "",
|
||||
toggleSearch: false,
|
||||
showDropdown: false,
|
||||
};
|
||||
subscription: any;
|
||||
|
@ -77,8 +74,6 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
componentDidMount() {
|
||||
// Subscribe to jwt changes
|
||||
if (isBrowser()) {
|
||||
this.searchTextField = createRef();
|
||||
|
||||
// On the first load, check the unreads
|
||||
let auth = myAuth(false);
|
||||
if (auth && UserService.Instance.myUserInfo) {
|
||||
|
@ -123,7 +118,6 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
updateUrl() {
|
||||
const searchParam = this.state.searchParam;
|
||||
this.setState({ searchParam: "" });
|
||||
this.setState({ toggleSearch: false });
|
||||
this.setState({ showDropdown: false, expanded: false });
|
||||
if (searchParam === "") {
|
||||
this.context.router.history.push(`/search/`);
|
||||
|
@ -308,35 +302,13 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
) && (
|
||||
<ul className="navbar-nav">
|
||||
<li className="nav-item">
|
||||
<form
|
||||
className="form-inline mr-1"
|
||||
onSubmit={linkEvent(this, this.handleSearchSubmit)}
|
||||
<NavLink
|
||||
to="/search"
|
||||
className="nav-link"
|
||||
title={i18n.t("search")}
|
||||
>
|
||||
<input
|
||||
id="search-input"
|
||||
className={`form-control mr-0 search-input ${
|
||||
this.state.toggleSearch ? "show-input" : "hide-input"
|
||||
}`}
|
||||
onInput={linkEvent(this, this.handleSearchParam)}
|
||||
value={this.state.searchParam}
|
||||
ref={this.searchTextField}
|
||||
disabled={!this.state.toggleSearch}
|
||||
type="text"
|
||||
placeholder={i18n.t("search")}
|
||||
onBlur={linkEvent(this, this.handleSearchBlur)}
|
||||
></input>
|
||||
<label className="sr-only" htmlFor="search-input">
|
||||
{i18n.t("search")}
|
||||
</label>
|
||||
<button
|
||||
name="search-btn"
|
||||
onClick={linkEvent(this, this.handleSearchBtn)}
|
||||
className="px-1 btn btn-link nav-link"
|
||||
aria-label={i18n.t("search")}
|
||||
>
|
||||
<Icon icon="search" />
|
||||
</button>
|
||||
</form>
|
||||
<Icon icon="search" />
|
||||
</NavLink>
|
||||
</li>
|
||||
</ul>
|
||||
)}
|
||||
|
@ -520,28 +492,6 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
|
|||
i.setState({ searchParam: event.target.value });
|
||||
}
|
||||
|
||||
handleSearchSubmit(i: Navbar, event: any) {
|
||||
event.preventDefault();
|
||||
i.updateUrl();
|
||||
}
|
||||
|
||||
handleSearchBtn(i: Navbar, event: any) {
|
||||
event.preventDefault();
|
||||
i.setState({ toggleSearch: true });
|
||||
|
||||
i.searchTextField.current?.focus();
|
||||
const offsetWidth = i.searchTextField.current?.offsetWidth;
|
||||
if (i.state.searchParam && offsetWidth && offsetWidth > 100) {
|
||||
i.updateUrl();
|
||||
}
|
||||
}
|
||||
|
||||
handleSearchBlur(i: Navbar, event: any) {
|
||||
if (!(event.relatedTarget && event.relatedTarget.name !== "search-btn")) {
|
||||
i.setState({ toggleSearch: false });
|
||||
}
|
||||
}
|
||||
|
||||
handleLogoutClick(i: Navbar) {
|
||||
i.setState({ showDropdown: false, expanded: false });
|
||||
UserService.Instance.logout();
|
||||
|
|
|
@ -163,27 +163,29 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
|
|||
? i18n.t("purge_comment")
|
||||
: `${i18n.t("purge")} ${cv.creator.name}`;
|
||||
|
||||
let canMod_ = canMod(
|
||||
cv.creator.id,
|
||||
this.props.moderators,
|
||||
this.props.admins
|
||||
);
|
||||
let canModOnSelf = canMod(
|
||||
cv.creator.id,
|
||||
this.props.moderators,
|
||||
this.props.admins,
|
||||
UserService.Instance.myUserInfo,
|
||||
true
|
||||
);
|
||||
let canAdmin_ = canAdmin(cv.creator.id, this.props.admins);
|
||||
let canAdminOnSelf = canAdmin(
|
||||
cv.creator.id,
|
||||
this.props.admins,
|
||||
UserService.Instance.myUserInfo,
|
||||
true
|
||||
);
|
||||
let canMod_ =
|
||||
canMod(cv.creator.id, this.props.moderators, this.props.admins) &&
|
||||
cv.community.local;
|
||||
let canModOnSelf =
|
||||
canMod(
|
||||
cv.creator.id,
|
||||
this.props.moderators,
|
||||
this.props.admins,
|
||||
UserService.Instance.myUserInfo,
|
||||
true
|
||||
) && cv.community.local;
|
||||
let canAdmin_ =
|
||||
canAdmin(cv.creator.id, this.props.admins) && cv.community.local;
|
||||
let canAdminOnSelf =
|
||||
canAdmin(
|
||||
cv.creator.id,
|
||||
this.props.admins,
|
||||
UserService.Instance.myUserInfo,
|
||||
true
|
||||
) && cv.community.local;
|
||||
let isMod_ = isMod(cv.creator.id, this.props.moderators);
|
||||
let isAdmin_ = isAdmin(cv.creator.id, this.props.admins);
|
||||
let isAdmin_ =
|
||||
isAdmin(cv.creator.id, this.props.admins) && cv.community.local;
|
||||
let amCommunityCreator_ = amCommunityCreator(
|
||||
cv.creator.id,
|
||||
this.props.moderators
|
||||
|
|
|
@ -434,15 +434,18 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
|||
let post = this.props.post_view.post;
|
||||
return (
|
||||
<Link
|
||||
className={
|
||||
className={`d-inline-block ${
|
||||
!post.featured_community && !post.featured_local
|
||||
? "text-body"
|
||||
: "text-primary"
|
||||
}
|
||||
}`}
|
||||
to={`/post/${post.id}`}
|
||||
title={i18n.t("comments")}
|
||||
>
|
||||
<div dangerouslySetInnerHTML={mdToHtmlInline(post.name)} />
|
||||
<div
|
||||
className="d-inline-block"
|
||||
dangerouslySetInnerHTML={mdToHtmlInline(post.name)}
|
||||
/>
|
||||
</Link>
|
||||
);
|
||||
}
|
||||
|
@ -457,16 +460,19 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
|||
{url ? (
|
||||
this.props.showBody ? (
|
||||
<a
|
||||
className={
|
||||
className={`d-inline-block ${
|
||||
!post.featured_community && !post.featured_local
|
||||
? "text-body"
|
||||
: "text-primary"
|
||||
}
|
||||
}`}
|
||||
href={url}
|
||||
title={url}
|
||||
rel={relTags}
|
||||
>
|
||||
<div dangerouslySetInnerHTML={mdToHtmlInline(post.name)} />
|
||||
<div
|
||||
className="d-inline-block"
|
||||
dangerouslySetInnerHTML={mdToHtmlInline(post.name)}
|
||||
/>
|
||||
</a>
|
||||
) : (
|
||||
this.postLink
|
||||
|
@ -477,7 +483,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
|
|||
{(url && isImage(url)) ||
|
||||
(post.thumbnail_url && (
|
||||
<button
|
||||
className="btn btn-link text-monospace text-muted small d-inline-block ml-2"
|
||||
className="btn btn-link text-monospace text-muted small d-inline-block"
|
||||
data-tippy-content={i18n.t("expand_here")}
|
||||
onClick={linkEvent(this, this.handleImageExpandClick)}
|
||||
>
|
||||
|
|
|
@ -651,6 +651,7 @@ export class Post extends Component<any, PostState> {
|
|||
data.recipient_ids.length == 0 &&
|
||||
!creatorBlocked &&
|
||||
postRes &&
|
||||
data.comment_view.post.id == postRes.post_view.post.id &&
|
||||
commentsRes
|
||||
) {
|
||||
commentsRes.comments.unshift(data.comment_view);
|
||||
|
|
|
@ -75,7 +75,7 @@ if (isBrowser()) {
|
|||
}
|
||||
|
||||
interface SearchProps {
|
||||
q: string;
|
||||
q?: string;
|
||||
type_: SearchType;
|
||||
sort: SortType;
|
||||
listingType: ListingType;
|
||||
|
@ -85,7 +85,7 @@ interface SearchProps {
|
|||
}
|
||||
|
||||
interface SearchState {
|
||||
q: string;
|
||||
q?: string;
|
||||
type_: SearchType;
|
||||
sort: SortType;
|
||||
listingType: ListingType;
|
||||
|
@ -97,7 +97,7 @@ interface SearchState {
|
|||
creatorDetails?: GetPersonDetailsResponse;
|
||||
loading: boolean;
|
||||
siteRes: GetSiteResponse;
|
||||
searchText: string;
|
||||
searchText?: string;
|
||||
resolveObjectResponse?: ResolveObjectResponse;
|
||||
}
|
||||
|
||||
|
@ -135,13 +135,13 @@ export class Search extends Component<any, SearchState> {
|
|||
this.props.match.params.community_id
|
||||
),
|
||||
creatorId: Search.getCreatorIdFromProps(this.props.match.params.creator_id),
|
||||
loading: true,
|
||||
loading: false,
|
||||
siteRes: this.isoData.site_res,
|
||||
communities: [],
|
||||
};
|
||||
|
||||
static getSearchQueryFromProps(q: string): string {
|
||||
return decodeURIComponent(q) || "";
|
||||
static getSearchQueryFromProps(q?: string): string | undefined {
|
||||
return q ? decodeURIComponent(q) : undefined;
|
||||
}
|
||||
|
||||
static getSearchTypeFromProps(type_: string): SearchType {
|
||||
|
@ -219,7 +219,10 @@ export class Search extends Component<any, SearchState> {
|
|||
}
|
||||
} else {
|
||||
this.fetchCommunities();
|
||||
this.search();
|
||||
|
||||
if (this.state.q) {
|
||||
this.search();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -298,29 +301,33 @@ export class Search extends Component<any, SearchState> {
|
|||
promises.push(Promise.resolve());
|
||||
}
|
||||
|
||||
let form: SearchForm = {
|
||||
q: this.getSearchQueryFromProps(pathSplit[3]),
|
||||
community_id,
|
||||
creator_id,
|
||||
type_: this.getSearchTypeFromProps(pathSplit[5]),
|
||||
sort: this.getSortTypeFromProps(pathSplit[7]),
|
||||
listing_type: this.getListingTypeFromProps(pathSplit[9]),
|
||||
page: this.getPageFromProps(pathSplit[15]),
|
||||
limit: fetchLimit,
|
||||
auth: req.auth,
|
||||
};
|
||||
let q = this.getSearchQueryFromProps(pathSplit[3]);
|
||||
|
||||
let resolveObjectForm: ResolveObject = {
|
||||
q: this.getSearchQueryFromProps(pathSplit[3]),
|
||||
auth: req.auth,
|
||||
};
|
||||
if (q) {
|
||||
let form: SearchForm = {
|
||||
q,
|
||||
community_id,
|
||||
creator_id,
|
||||
type_: this.getSearchTypeFromProps(pathSplit[5]),
|
||||
sort: this.getSortTypeFromProps(pathSplit[7]),
|
||||
listing_type: this.getListingTypeFromProps(pathSplit[9]),
|
||||
page: this.getPageFromProps(pathSplit[15]),
|
||||
limit: fetchLimit,
|
||||
auth: req.auth,
|
||||
};
|
||||
|
||||
if (form.q != "") {
|
||||
promises.push(req.client.search(form));
|
||||
promises.push(req.client.resolveObject(resolveObjectForm));
|
||||
} else {
|
||||
promises.push(Promise.resolve());
|
||||
promises.push(Promise.resolve());
|
||||
let resolveObjectForm: ResolveObject = {
|
||||
q,
|
||||
auth: req.auth,
|
||||
};
|
||||
|
||||
if (form.q != "") {
|
||||
promises.push(req.client.search(form));
|
||||
promises.push(req.client.resolveObject(resolveObjectForm));
|
||||
} else {
|
||||
promises.push(Promise.resolve());
|
||||
promises.push(Promise.resolve());
|
||||
}
|
||||
}
|
||||
|
||||
return promises;
|
||||
|
@ -336,11 +343,13 @@ export class Search extends Component<any, SearchState> {
|
|||
lastState.creatorId !== this.state.creatorId ||
|
||||
lastState.page !== this.state.page
|
||||
) {
|
||||
this.setState({
|
||||
loading: true,
|
||||
searchText: this.state.q,
|
||||
});
|
||||
this.search();
|
||||
if (this.state.q) {
|
||||
this.setState({
|
||||
loading: true,
|
||||
searchText: this.state.q,
|
||||
});
|
||||
this.search();
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -779,24 +788,24 @@ export class Search extends Component<any, SearchState> {
|
|||
this.state.creatorId == 0 ? undefined : this.state.creatorId;
|
||||
|
||||
let auth = myAuth(false);
|
||||
let form: SearchForm = {
|
||||
q: this.state.q,
|
||||
community_id,
|
||||
creator_id,
|
||||
type_: this.state.type_,
|
||||
sort: this.state.sort,
|
||||
listing_type: this.state.listingType,
|
||||
page: this.state.page,
|
||||
limit: fetchLimit,
|
||||
auth,
|
||||
};
|
||||
if (this.state.q && this.state.q != "") {
|
||||
let form: SearchForm = {
|
||||
q: this.state.q,
|
||||
community_id,
|
||||
creator_id,
|
||||
type_: this.state.type_,
|
||||
sort: this.state.sort,
|
||||
listing_type: this.state.listingType,
|
||||
page: this.state.page,
|
||||
limit: fetchLimit,
|
||||
auth,
|
||||
};
|
||||
|
||||
let resolveObjectForm: ResolveObject = {
|
||||
q: this.state.q,
|
||||
auth,
|
||||
};
|
||||
let resolveObjectForm: ResolveObject = {
|
||||
q: this.state.q,
|
||||
auth,
|
||||
};
|
||||
|
||||
if (this.state.q != "") {
|
||||
this.setState({
|
||||
searchResponse: undefined,
|
||||
resolveObjectResponse: undefined,
|
||||
|
@ -919,7 +928,7 @@ export class Search extends Component<any, SearchState> {
|
|||
|
||||
updateUrl(paramUpdates: UrlParams) {
|
||||
const qStr = paramUpdates.q || this.state.q;
|
||||
const qStrEncoded = encodeURIComponent(qStr);
|
||||
const qStrEncoded = encodeURIComponent(qStr || "");
|
||||
const typeStr = paramUpdates.type_ || this.state.type_;
|
||||
const listingTypeStr = paramUpdates.listingType || this.state.listingType;
|
||||
const sortStr = paramUpdates.sort || this.state.sort;
|
||||
|
|
Loading…
Reference in a new issue