LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-29 07:41:13 +00:00
Code Issues Projects Releases Wiki Activity

Merge branch 'main' into add_undetermined_warning

Browse source
This commit is contained in:
Dessalines 2023-02-21 15:53:27 -05:00 committed by GitHub
commit 8c54921372
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
6 changed files with 102 additions and 144 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

10
src/assets/css/main.css
View file

@ -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: "";

64
src/shared/components/app/navbar.tsx
View file

@ -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();

42
src/shared/components/comment/comment-node.tsx
View file

@ -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

20
src/shared/components/post/post-listing.tsx
View file

@ -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)}
>

1
src/shared/components/post/post.tsx
View file

@ -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);

109
src/shared/components/search.tsx
View file

@ -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;