fedi/lemmy-ui
1
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-08 17:44:16 +00:00
Code Issues Packages Projects Releases Wiki Activity

Updating translations.

Browse source
This commit is contained in:
Dessalines 2022-07-27 09:42:05 -04:00
parent c2c98ac638
commit 753861b0f3
14 changed files with 260 additions and 213 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
lemmy-translations

@ -1 +1 @@
Subproject commit 7c1b691af63845a2fe2f8219b4620b8db3c9c3ba
Subproject commit 7c3945745dcd07774b19453803f7f14ab80ab3d3

2
src/shared/components/comment/comment-form.tsx
View file

@ -3,6 +3,7 @@ import { Component } from "inferno";
import { T } from "inferno-i18next-dess";
import { Link } from "inferno-router";
import {
CommentNode as CommentNodeI,
CommentResponse,
CreateComment,
EditComment,
@ -12,7 +13,6 @@ import {
} from "lemmy-js-client";
import { Subscription } from "rxjs";
import { i18n } from "../../i18next";
import { CommentNode as CommentNodeI } from "../../interfaces";
import { UserService, WebSocketService } from "../../services";
import {
auth,

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

@ -8,12 +8,16 @@ import {
BanFromCommunity,
BanPerson,
BlockPerson,
CommentNode as CommentNodeI,
CommentReplyView,
CommentView,
CommunityModeratorView,
CreateCommentLike,
CreateCommentReport,
DeleteComment,
MarkCommentAsRead,
GetComments,
ListingType,
MarkCommentReplyAsRead,
MarkPersonMentionAsRead,
PersonMentionView,
PersonViewSafe,
@ -26,11 +30,7 @@ import {
} from "lemmy-js-client";
import moment from "moment";
import { i18n } from "../../i18next";
import {
BanType,
CommentNode as CommentNodeI,
PurgeType,
} from "../../interfaces";
import { BanType, CommentViewType, PurgeType } from "../../interfaces";
import { UserService, WebSocketService } from "../../services";
import {
amCommunityCreator,
@ -38,6 +38,7 @@ import {
canAdmin,
canMod,
colorList,
commentTreeMaxDepth,
futureDaysToUnixTime,
isAdmin,
isBanned,
@ -82,7 +83,6 @@ interface CommentNodeState {
score: number;
upvotes: number;
downvotes: number;
borderColor: string;
readLoading: boolean;
saveLoading: boolean;
}
@ -99,6 +99,7 @@ interface CommentNodeProps {
showContext?: boolean;
showCommunity?: boolean;
enableDownvotes: boolean;
viewType: CommentViewType;
}
export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
@ -129,9 +130,6 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
score: this.props.node.comment_view.counts.score,
upvotes: this.props.node.comment_view.counts.upvotes,
downvotes: this.props.node.comment_view.counts.downvotes,
borderColor: this.props.node.depth
? colorList[this.props.node.depth % colorList.length]
: colorList[0],
readLoading: false,
saveLoading: false,
};
@ -181,10 +179,23 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
cv.creator.id
);
let borderColor = this.props.node.depth
? colorList[(this.props.node.depth - 1) % colorList.length]
: colorList[0];
let moreRepliesBorderColor = this.props.node.depth
? colorList[this.props.node.depth % colorList.length]
: colorList[0];
let showMoreChildren =
this.props.viewType == CommentViewType.Tree &&
!this.state.collapsed &&
node.children.length == 0 &&
node.comment_view.counts.child_count > 0;
return (
<div
className={`comment ${
cv.comment.parent_id.isSome() && !this.props.noIndent ? "ml-1" : ""
this.props.node.depth && !this.props.noIndent ? "ml-1" : ""
}`}
>
<div
@ -194,14 +205,12 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
} ${this.isCommentNew ? "mark" : ""}`}
style={
!this.props.noIndent &&
cv.comment.parent_id.isSome() &&
`border-left: 2px ${this.state.borderColor} solid !important`
this.props.node.depth &&
`border-left: 2px ${borderColor} solid !important`
}
>
<div
class={`${
!this.props.noIndent && cv.comment.parent_id.isSome() && "ml-2"
}`}
class={`${!this.props.noIndent && this.props.node.depth && "ml-2"}`}
>
<div class="d-flex flex-wrap align-items-center text-muted small">
<span class="mr-2">
@ -262,7 +271,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
<>
<a
className={`unselectable pointer ${this.scoreColor}`}
onClick={linkEvent(node, this.handleCommentUpvote)}
onClick={this.handleCommentUpvote}
data-tippy-content={this.pointsTippy}
>
<span
@ -314,12 +323,12 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
class="btn btn-link btn-animate text-muted"
onClick={linkEvent(this, this.handleMarkRead)}
data-tippy-content={
this.commentOrMentionRead
this.commentReplyOrMentionRead
? i18n.t("mark_as_unread")
: i18n.t("mark_as_read")
}
aria-label={
this.commentOrMentionRead
this.commentReplyOrMentionRead
? i18n.t("mark_as_unread")
: i18n.t("mark_as_read")
}
@ -330,7 +339,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
<Icon
icon="check"
classes={`icon-inline ${
this.commentOrMentionRead && "text-success"
this.commentReplyOrMentionRead && "text-success"
}`}
/>
)}
@ -345,7 +354,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
? "text-info"
: "text-muted"
}`}
onClick={linkEvent(node, this.handleCommentUpvote)}
onClick={this.handleCommentUpvote}
data-tippy-content={i18n.t("upvote")}
aria-label={i18n.t("upvote")}
>
@ -364,10 +373,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
? "text-danger"
: "text-muted"
}`}
onClick={linkEvent(
node,
this.handleCommentDownvote
)}
onClick={this.handleCommentDownvote}
data-tippy-content={i18n.t("downvote")}
aria-label={i18n.t("downvote")}
>
@ -772,6 +778,21 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
)}
</div>
</div>
{showMoreChildren && (
<div
className={`details ml-1 comment-node py-2 ${
!this.props.noBorder ? "border-top border-light" : ""
}`}
style={`border-left: 2px ${moreRepliesBorderColor} solid !important`}
>
<button
class="btn btn-link text-muted"
onClick={linkEvent(this, this.handleFetchChildren)}
>
{node.comment_view.counts.child_count} more replies ➔
</button>
</div>
)}
{/* end of details */}
{this.state.showRemoveDialog && (
<form
@ -931,7 +952,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
focus
/>
)}
{!this.state.collapsed && node.children && (
{!this.state.collapsed && node.children.length > 0 && (
<CommentNodes
nodes={node.children}
locked={this.props.locked}
@ -939,6 +960,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
admins={this.props.admins}
maxCommentsShown={None}
enableDownvotes={this.props.enableDownvotes}
viewType={this.props.viewType}
/>
)}
{/* A collapsed clearfix */}
@ -947,11 +969,16 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
);
}
get commentOrMentionRead() {
get commentReplyOrMentionRead(): boolean {
let cv = this.props.node.comment_view;
return this.isPersonMentionType(cv)
? cv.person_mention.read
: cv.comment.read;
if (this.isPersonMentionType(cv)) {
return cv.person_mention.read;
} else if (this.isCommentReplyType(cv)) {
return cv.comment_reply.read;
} else {
return false;
}
}
linkBtn(small = false) {
@ -968,7 +995,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
<>
<Link
className={classnames}
to={`/post/${cv.post.id}/comment/${cv.comment.id}`}
to={`/comment/${cv.comment.id}`}
title={title}
>
<Icon icon="link" classes="icon-inline" />
@ -1061,7 +1088,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
this.setState(this.state);
}
handleCommentUpvote(i: CommentNodeI, event: any) {
handleCommentUpvote(event: any) {
event.preventDefault();
let myVote = this.state.my_vote.unwrapOr(0);
let newVote = myVote == 1 ? 0 : 1;
@ -1081,17 +1108,16 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
this.state.my_vote = Some(newVote);
let form = new CreateCommentLike({
comment_id: i.comment_view.comment.id,
comment_id: this.props.node.comment_view.comment.id,
score: newVote,
auth: auth().unwrap(),
});
WebSocketService.Instance.send(wsClient.likeComment(form));
this.setState(this.state);
setupTippy();
}
handleCommentDownvote(i: CommentNodeI, event: any) {
handleCommentDownvote(event: any) {
event.preventDefault();
let myVote = this.state.my_vote.unwrapOr(0);
let newVote = myVote == -1 ? 0 : -1;
@ -1111,7 +1137,7 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
this.state.my_vote = Some(newVote);
let form = new CreateCommentLike({
comment_id: i.comment_view.comment.id,
comment_id: this.props.node.comment_view.comment.id,
score: newVote,
auth: auth().unwrap(),
});
@ -1175,11 +1201,17 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
}
isPersonMentionType(
item: CommentView | PersonMentionView
item: CommentView | PersonMentionView | CommentReplyView
): item is PersonMentionView {
return (item as PersonMentionView).person_mention?.id !== undefined;
}
isCommentReplyType(
item: CommentView | PersonMentionView | CommentReplyView
): item is CommentReplyView {
return (item as CommentReplyView).comment_reply?.id !== undefined;
}
handleMarkRead(i: CommentNode) {
if (i.isPersonMentionType(i.props.node.comment_view)) {
let form = new MarkPersonMentionAsRead({
@ -1188,13 +1220,13 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
auth: auth().unwrap(),
});
WebSocketService.Instance.send(wsClient.markPersonMentionAsRead(form));
} else {
let form = new MarkCommentAsRead({
comment_id: i.props.node.comment_view.comment.id,
read: !i.props.node.comment_view.comment.read,
} else if (i.isCommentReplyType(i.props.node.comment_view)) {
let form = new MarkCommentReplyAsRead({
comment_reply_id: i.props.node.comment_view.comment_reply.id,
read: !i.props.node.comment_view.comment_reply.read,
auth: auth().unwrap(),
});
WebSocketService.Instance.send(wsClient.markCommentAsRead(form));
WebSocketService.Instance.send(wsClient.markCommentReplyAsRead(form));
}
i.state.readLoading = true;
@ -1419,6 +1451,24 @@ export class CommentNode extends Component<CommentNodeProps, CommentNodeState> {
setupTippy();
}
handleFetchChildren(i: CommentNode) {
let form = new GetComments({
post_id: Some(i.props.node.comment_view.post.id),
parent_id: Some(i.props.node.comment_view.comment.id),
max_depth: Some(commentTreeMaxDepth),
page: None,
sort: None,
limit: Some(999),
type_: Some(ListingType.All),
community_name: None,
community_id: None,
saved_only: Some(false),
auth: auth(false).ok(),
});
WebSocketService.Instance.send(wsClient.getComments(form));
}
get scoreColor() {
if (this.state.my_vote.unwrapOr(0) == 1) {
return "text-info";

10
src/shared/components/comment/comment-nodes.tsx
View file

@ -1,7 +1,11 @@
import { Option } from "@sniptt/monads";
import { Component } from "inferno";
import { CommunityModeratorView, PersonViewSafe } from "lemmy-js-client";
import { CommentNode as CommentNodeI } from "../../interfaces";
import {
CommentNode as CommentNodeI,
CommunityModeratorView,
PersonViewSafe,
} from "lemmy-js-client";
import { CommentViewType } from "../../interfaces";
import { CommentNode } from "./comment-node";
interface CommentNodesProps {
@ -17,6 +21,7 @@ interface CommentNodesProps {
showContext?: boolean;
showCommunity?: boolean;
enableDownvotes?: boolean;
viewType: CommentViewType;
}
export class CommentNodes extends Component<CommentNodesProps, any> {
@ -45,6 +50,7 @@ export class CommentNodes extends Component<CommentNodesProps, any> {
showContext={this.props.showContext}
showCommunity={this.props.showCommunity}
enableDownvotes={this.props.enableDownvotes}
viewType={this.props.viewType}
/>
))}
</div>

7
src/shared/components/comment/comment-report.tsx
View file

@ -2,13 +2,14 @@ import { None } from "@sniptt/monads";
import { Component, linkEvent } from "inferno";
import { T } from "inferno-i18next-dess";
import {
CommentNode as CommentNodeI,
CommentReportView,
CommentView,
ResolveCommentReport,
SubscribedType,
} from "lemmy-js-client";
import { i18n } from "../../i18next";
import { CommentNode as CommentNodeI } from "../../interfaces";
import { CommentViewType } from "../../interfaces";
import { WebSocketService } from "../../services";
import { auth, wsClient } from "../../utils";
import { Icon } from "../common/icon";
@ -44,18 +45,20 @@ export class CommentReport extends Component<CommentReportProps, any> {
subscribed: SubscribedType.NotSubscribed,
saved: false,
creator_blocked: false,
recipient: None,
my_vote: r.my_vote,
};
let node: CommentNodeI = {
comment_view,
children: [],
depth: 0,
};
return (
<div>
<CommentNode
node={node}
viewType={CommentViewType.Flat}
moderators={None}
admins={None}
enableDownvotes={true}

1
src/shared/components/common/sort-select.tsx
View file

@ -51,6 +51,7 @@ export class SortSelect extends Component<SortSelectProps, SortSelectState> {
<option value={SortType.Active}>{i18n.t("active")}</option>,
]}
<option value={SortType.New}>{i18n.t("new")}</option>
<option value={SortType.Old}>{i18n.t("old")}</option>
{!this.props.hideMostComments && [
<option value={SortType.MostComments}>
{i18n.t("most_comments")}

18
src/shared/components/community/community.tsx
View file

@ -28,7 +28,11 @@ import {
} from "lemmy-js-client";
import { Subscription } from "rxjs";
import { i18n } from "../../i18next";
import { DataType, InitialFetchRequest } from "../../interfaces";
import {
CommentViewType,
DataType,
InitialFetchRequest,
} from "../../interfaces";
import { UserService, WebSocketService } from "../../services";
import {
auth,
@ -45,6 +49,7 @@ import {
getPageFromProps,
getSortTypeFromProps,
notifyPost,
postToCommentSortType,
relTags,
restoreScrollPosition,
saveCommentRes,
@ -231,9 +236,12 @@ export class Community extends Component<any, State> {
community_id: None,
page,
limit: Some(fetchLimit),
sort,
max_depth: None,
sort: sort.map(postToCommentSortType),
type_: Some(ListingType.Community),
saved_only: Some(false),
post_id: None,
parent_id: None,
auth: req.auth,
});
promises.push(Promise.resolve());
@ -387,6 +395,7 @@ export class Community extends Component<any, State> {
) : (
<CommentNodes
nodes={commentsToFlatNodes(this.state.comments)}
viewType={CommentViewType.Flat}
noIndent
showContext
enableDownvotes={enableDownvotes(this.state.siteRes)}
@ -497,11 +506,14 @@ export class Community extends Component<any, State> {
let form = new GetComments({
page: Some(this.state.page),
limit: Some(fetchLimit),
sort: Some(this.state.sort),
max_depth: None,
sort: Some(postToCommentSortType(this.state.sort)),
type_: Some(ListingType.Community),
community_name: Some(this.state.communityName),
community_id: None,
saved_only: Some(false),
post_id: None,
parent_id: None,
auth: auth(false).ok(),
});
WebSocketService.Instance.send(wsClient.getComments(form));

18
src/shared/components/home/home.tsx
View file

@ -30,7 +30,11 @@ import {
} from "lemmy-js-client";
import { Subscription } from "rxjs";
import { i18n } from "../../i18next";
import { DataType, InitialFetchRequest } from "../../interfaces";
import {
CommentViewType,
DataType,
InitialFetchRequest,
} from "../../interfaces";
import { UserService, WebSocketService } from "../../services";
import {
auth,
@ -48,6 +52,7 @@ import {
getSortTypeFromProps,
isBrowser,
notifyPost,
postToCommentSortType,
relTags,
restoreScrollPosition,
saveCommentRes,
@ -263,9 +268,12 @@ export class Home extends Component<any, HomeState> {
community_name: None,
page,
limit: Some(fetchLimit),
sort,
max_depth: None,
sort: sort.map(postToCommentSortType),
type_,
saved_only: Some(false),
post_id: None,
parent_id: None,
auth: req.auth,
});
promises.push(Promise.resolve());
@ -565,6 +573,7 @@ export class Home extends Component<any, HomeState> {
) : (
<CommentNodes
nodes={commentsToFlatNodes(this.state.comments)}
viewType={CommentViewType.Flat}
moderators={None}
admins={None}
maxCommentsShown={None}
@ -694,8 +703,11 @@ export class Home extends Component<any, HomeState> {
community_name: None,
page: Some(this.state.page),
limit: Some(fetchLimit),
sort: Some(this.state.sort),
max_depth: None,
sort: Some(postToCommentSortType(this.state.sort)),
saved_only: Some(false),
post_id: None,
parent_id: None,
auth: auth(false).ok(),
type_: Some(this.state.listingType),
});

185
src/shared/components/person/inbox.tsx
View file

@ -2,8 +2,11 @@ import { None, Some } from "@sniptt/monads";
import { Component, linkEvent } from "inferno";
import {
BlockPersonResponse,
CommentReplyResponse,
CommentReplyView,
CommentReportResponse,
CommentResponse,
CommentSortType,
CommentView,
GetPersonMentions,
GetPersonMentionsResponse,
@ -17,14 +20,13 @@ import {
PrivateMessageResponse,
PrivateMessagesResponse,
PrivateMessageView,
SortType,
UserOperation,
wsJsonToRes,
wsUserOp,
} from "lemmy-js-client";
import { Subscription } from "rxjs";
import { i18n } from "../../i18next";
import { InitialFetchRequest } from "../../interfaces";
import { CommentViewType, InitialFetchRequest } from "../../interfaces";
import { UserService, WebSocketService } from "../../services";
import {
auth,
@ -44,10 +46,10 @@ import {
wsSubscribe,
} from "../../utils";
import { CommentNodes } from "../comment/comment-nodes";
import { CommentSortSelect } from "../common/comment-sort-select";
import { HtmlTags } from "../common/html-tags";
import { Icon, Spinner } from "../common/icon";
import { Paginator } from "../common/paginator";
import { SortSelect } from "../common/sort-select";
import { PrivateMessage } from "../private_message/private-message";
enum UnreadOrAll {
@ -70,18 +72,18 @@ enum ReplyEnum {
type ReplyType = {
id: number;
type_: ReplyEnum;
view: CommentView | PrivateMessageView | PersonMentionView;
view: CommentView | PrivateMessageView | PersonMentionView | CommentReplyView;
published: string;
};
interface InboxState {
unreadOrAll: UnreadOrAll;
messageType: MessageType;
replies: CommentView[];
replies: CommentReplyView[];
mentions: PersonMentionView[];
messages: PrivateMessageView[];
combined: ReplyType[];
sort: SortType;
sort: CommentSortType;
page: number;
siteRes: GetSiteResponse;
loading: boolean;
@ -102,7 +104,7 @@ export class Inbox extends Component<any, InboxState> {
mentions: [],
messages: [],
combined: [],
sort: SortType.New,
sort: CommentSortType.New,
page: 1,
siteRes: this.isoData.site_res,
loading: true,
@ -323,19 +325,17 @@ export class Inbox extends Component<any, InboxState> {
<div className="mb-2">
<span class="mr-3">{this.unreadOrAllRadios()}</span>
<span class="mr-3">{this.messageTypeRadios()}</span>
<SortSelect
<CommentSortSelect
sort={this.state.sort}
onChange={this.handleSortChange}
hideHot
hideMostComments
/>
</div>
);
}
replyToReplyType(r: CommentView): ReplyType {
replyToReplyType(r: CommentReplyView): ReplyType {
return {
id: r.comment.id,
id: r.comment_reply.id,
type_: ReplyEnum.Reply,
view: r,
published: r.comment.published,
@ -382,7 +382,10 @@ export class Inbox extends Component<any, InboxState> {
return (
<CommentNodes
key={i.id}
nodes={[{ comment_view: i.view as CommentView }]}
nodes={[
{ comment_view: i.view as CommentView, children: [], depth: 0 },
]}
viewType={CommentViewType.Flat}
moderators={None}
admins={None}
maxCommentsShown={None}
@ -397,7 +400,14 @@ export class Inbox extends Component<any, InboxState> {
return (
<CommentNodes
key={i.id}
nodes={[{ comment_view: i.view as PersonMentionView }]}
nodes={[
{
comment_view: i.view as PersonMentionView,
children: [],
depth: 0,
},
]}
viewType={CommentViewType.Flat}
moderators={None}
admins={None}
maxCommentsShown={None}
@ -429,6 +439,7 @@ export class Inbox extends Component<any, InboxState> {
<div>
<CommentNodes
nodes={commentsToFlatNodes(this.state.replies)}
viewType={CommentViewType.Flat}
moderators={None}
admins={None}
maxCommentsShown={None}
@ -448,7 +459,8 @@ export class Inbox extends Component<any, InboxState> {
{this.state.mentions.map(umv => (
<CommentNodes
key={umv.person_mention.id}
nodes={[{ comment_view: umv }]}
nodes={[{ comment_view: umv, children: [], depth: 0 }]}
viewType={CommentViewType.Flat}
moderators={None}
admins={None}
maxCommentsShown={None}
@ -498,9 +510,11 @@ export class Inbox extends Component<any, InboxState> {
static fetchInitialData(req: InitialFetchRequest): Promise<any>[] {
let promises: Promise<any>[] = [];
let sort = Some(CommentSortType.New);
// It can be /u/me, or /username/1
let repliesForm = new GetReplies({
sort: Some(SortType.New),
sort,
unread_only: Some(true),
page: Some(1),
limit: Some(fetchLimit),
@ -509,7 +523,7 @@ export class Inbox extends Component<any, InboxState> {
promises.push(req.client.getReplies(repliesForm));
let personMentionsForm = new GetPersonMentions({
sort: Some(SortType.New),
sort,
unread_only: Some(true),
page: Some(1),
limit: Some(fetchLimit),
@ -565,7 +579,7 @@ export class Inbox extends Component<any, InboxState> {
);
}
handleSortChange(val: SortType) {
handleSortChange(val: CommentSortType) {
this.state.sort = val;
this.state.page = 1;
this.setState(this.state);
@ -581,6 +595,7 @@ export class Inbox extends Component<any, InboxState> {
i.state.replies = [];
i.state.mentions = [];
i.state.messages = [];
i.state.combined = i.buildCombined();
UserService.Instance.unreadInboxCountSub.next(0);
window.scrollTo(0, 0);
i.setState(i.state);
@ -716,34 +731,51 @@ export class Inbox extends Component<any, InboxState> {
let data = wsJsonToRes<CommentResponse>(msg, CommentResponse);
editCommentRes(data.comment_view, this.state.replies);
this.setState(this.state);
} else if (op == UserOperation.MarkCommentAsRead) {
let data = wsJsonToRes<CommentResponse>(msg, CommentResponse);
} else if (op == UserOperation.MarkCommentReplyAsRead) {
let data = wsJsonToRes<CommentReplyResponse>(msg, CommentReplyResponse);
console.log(data);
// If youre in the unread view, just remove it from the list
if (
this.state.unreadOrAll == UnreadOrAll.Unread &&
data.comment_view.comment.read
) {
this.state.replies = this.state.replies.filter(
r => r.comment.id !== data.comment_view.comment.id
);
this.state.combined = this.state.combined.filter(
r => r.id !== data.comment_view.comment.id
);
} else {
let found = this.state.replies.find(
c => c.comment.id == data.comment_view.comment.id
);
let found = this.state.replies.find(
c => c.comment_reply.id == data.comment_reply_view.comment_reply.id
);
if (found) {
let combinedView = this.state.combined.find(
i => i.id == data.comment_view.comment.id
).view as CommentView;
found.comment.read = combinedView.comment.read =
data.comment_view.comment.read;
}
i => i.id == data.comment_reply_view.comment_reply.id
).view as CommentReplyView;
found.comment.content = combinedView.comment.content =
data.comment_reply_view.comment.content;
found.comment.updated = combinedView.comment.updated =
data.comment_reply_view.comment.updated;
found.comment.removed = combinedView.comment.removed =
data.comment_reply_view.comment.removed;
found.comment.deleted = combinedView.comment.deleted =
data.comment_reply_view.comment.deleted;
found.counts.upvotes = combinedView.counts.upvotes =
data.comment_reply_view.counts.upvotes;
found.counts.downvotes = combinedView.counts.downvotes =
data.comment_reply_view.counts.downvotes;
found.counts.score = combinedView.counts.score =
data.comment_reply_view.counts.score;
this.sendUnreadCount(data.comment_view.comment.read);
// If youre in the unread view, just remove it from the list
if (
this.state.unreadOrAll == UnreadOrAll.Unread &&
data.comment_reply_view.comment_reply.read
) {
this.state.replies = this.state.replies.filter(
r => r.comment_reply.id !== data.comment_reply_view.comment_reply.id
);
this.state.combined = this.state.combined.filter(
r => r.id !== data.comment_reply_view.comment_reply.id
);
} else {
found.comment_reply.read = combinedView.comment_reply.read =
data.comment_reply_view.comment_reply.read;
}
}
this.sendUnreadCount(data.comment_reply_view.comment_reply.read);
this.setState(this.state);
setupTippy();
} else if (op == UserOperation.MarkPersonMentionAsRead) {
let data = wsJsonToRes<PersonMentionResponse>(msg, PersonMentionResponse);
@ -791,71 +823,6 @@ export class Inbox extends Component<any, InboxState> {
}
this.sendUnreadCount(data.person_mention_view.person_mention.read);
this.setState(this.state);
} else if (op == UserOperation.CreateComment) {
let data = wsJsonToRes<CommentResponse>(msg, CommentResponse);
UserService.Instance.myUserInfo.match({
some: mui => {
if (data.recipient_ids.includes(mui.local_user_view.local_user.id)) {
this.state.replies.unshift(data.comment_view);
this.state.combined.unshift(
this.replyToReplyType(data.comment_view)
);
this.setState(this.state);
} else if (
data.comment_view.creator.id == mui.local_user_view.person.id
) {
// If youre in the unread view, just remove it from the list
if (this.state.unreadOrAll == UnreadOrAll.Unread) {
this.state.replies = this.state.replies.filter(
r =>
r.comment.id !==
data.comment_view.comment.parent_id.unwrapOr(0)
);
this.state.mentions = this.state.mentions.filter(
m =>
m.comment.id !==
data.comment_view.comment.parent_id.unwrapOr(0)
);
this.state.combined = this.state.combined.filter(r => {
if (this.isMention(r.view))
return (
r.view.comment.id !==
data.comment_view.comment.parent_id.unwrapOr(0)
);
else
return (
r.id !== data.comment_view.comment.parent_id.unwrapOr(0)
);
});
} else {
let mention_found = this.state.mentions.find(
i =>
i.comment.id ==
data.comment_view.comment.parent_id.unwrapOr(0)
);
if (mention_found) {
mention_found.person_mention.read = true;
}
let reply_found = this.state.replies.find(
i =>
i.comment.id ==
data.comment_view.comment.parent_id.unwrapOr(0)
);
if (reply_found) {
reply_found.comment.read = true;
}
this.state.combined = this.buildCombined();
}
this.sendUnreadCount(true);
this.setState(this.state);
setupTippy();
// TODO this seems wrong, you should be using form_id
toast(i18n.t("reply_sent"));
}
},
none: void 0,
});
} else if (op == UserOperation.CreatePrivateMessage) {
let data = wsJsonToRes<PrivateMessageResponse>(
msg,
@ -904,4 +871,8 @@ export class Inbox extends Component<any, InboxState> {
isMention(view: any): view is PersonMentionView {
return (view as PersonMentionView).person_mention !== undefined;
}
isReply(view: any): view is CommentReplyView {
return (view as CommentReplyView).comment_reply !== undefined;
}
}

6
src/shared/components/person/person-details.tsx
View file

@ -7,7 +7,7 @@ import {
PostView,
SortType,
} from "lemmy-js-client";
import { PersonDetailsView } from "../../interfaces";
import { CommentViewType, PersonDetailsView } from "../../interfaces";
import { commentsToFlatNodes, setupTippy } from "../../utils";
import { CommentNodes } from "../comment/comment-nodes";
import { Paginator } from "../common/paginator";
@ -89,7 +89,8 @@ export class PersonDetails extends Component<PersonDetailsProps, any> {
return (
<CommentNodes
key={i.id}
nodes={[{ comment_view: c }]}
nodes={[{ comment_view: c, children: [], depth: 0 }]}
viewType={CommentViewType.Flat}
admins={Some(this.props.admins)}
moderators={None}
maxCommentsShown={None}
@ -159,6 +160,7 @@ export class PersonDetails extends Component<PersonDetailsProps, any> {
<div>
<CommentNodes
nodes={commentsToFlatNodes(this.props.personRes.comments)}
viewType={CommentViewType.Flat}
admins={Some(this.props.admins)}
moderators={None}
maxCommentsShown={None}

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

@ -408,7 +408,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
className={`btn-animate btn btn-link p-0 ${
this.state.my_vote.unwrapOr(0) == 1 ? "text-info" : "text-muted"
}`}
onClick={linkEvent(this, this.handlePostLike)}
onClick={this.handlePostLike}
data-tippy-content={i18n.t("upvote")}
aria-label={i18n.t("upvote")}
>
@ -431,7 +431,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
? "text-danger"
: "text-muted"
}`}
onClick={linkEvent(this, this.handlePostDisLike)}
onClick={this.handlePostDisLike}
data-tippy-content={i18n.t("downvote")}
aria-label={i18n.t("downvote")}
>
@ -647,7 +647,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
this.state.my_vote.unwrapOr(0) == 1 ? "text-info" : "text-muted"
}`}
{...tippy}
onClick={linkEvent(this, this.handlePostLike)}
onClick={this.handlePostLike}
aria-label={i18n.t("upvote")}
>
<Icon icon="arrow-up1" classes="icon-inline small" />
@ -662,7 +662,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
? "text-danger"
: "text-muted"
}`}
onClick={linkEvent(this, this.handlePostDisLike)}
onClick={this.handlePostDisLike}
{...tippy}
aria-label={i18n.t("downvote")}
>
@ -1250,7 +1250,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
});
}
handlePostLike(i: PostListing, event: any) {
handlePostLike(event: any) {
event.preventDefault();
if (UserService.Instance.myUserInfo.isNone()) {
this.context.router.history.push(`/login`);
@ -1260,31 +1260,31 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
let newVote = myVote == 1 ? 0 : 1;
if (myVote == 1) {
i.state.score--;
i.state.upvotes--;
this.state.score--;
this.state.upvotes--;
} else if (myVote == -1) {
i.state.downvotes--;
i.state.upvotes++;
i.state.score += 2;
this.state.downvotes--;
this.state.upvotes++;
this.state.score += 2;
} else {
i.state.upvotes++;
i.state.score++;
this.state.upvotes++;
this.state.score++;
}
i.state.my_vote = Some(newVote);
this.state.my_vote = Some(newVote);
let form = new CreatePostLike({
post_id: i.props.post_view.post.id,
post_id: this.props.post_view.post.id,
score: newVote,
auth: auth().unwrap(),
});
WebSocketService.Instance.send(wsClient.likePost(form));
i.setState(i.state);
this.setState(this.state);
setupTippy();
}
handlePostDisLike(i: PostListing, event: any) {
handlePostDisLike(event: any) {
event.preventDefault();
if (UserService.Instance.myUserInfo.isNone()) {
this.context.router.history.push(`/login`);
@ -1294,27 +1294,27 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
let newVote = myVote == -1 ? 0 : -1;
if (myVote == 1) {
i.state.score -= 2;
i.state.upvotes--;
i.state.downvotes++;
this.state.score -= 2;
this.state.upvotes--;
this.state.downvotes++;
} else if (myVote == -1) {
i.state.downvotes--;
i.state.score++;
this.state.downvotes--;
this.state.score++;
} else {
i.state.downvotes++;
i.state.score--;
this.state.downvotes++;
this.state.score--;
}
i.state.my_vote = Some(newVote);
this.state.my_vote = Some(newVote);
let form = new CreatePostLike({
post_id: i.props.post_view.post.id,
post_id: this.props.post_view.post.id,
score: newVote,
auth: auth().unwrap(),
});
WebSocketService.Instance.send(wsClient.likePost(form));
i.setState(i.state);
this.setState(this.state);
setupTippy();
}

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

@ -26,8 +26,8 @@ import {
wsUserOp,
} from "lemmy-js-client";
import { Subscription } from "rxjs";
import { InitialFetchRequest } from "shared/interfaces";
import { i18n } from "../i18next";
import { CommentViewType, InitialFetchRequest } from "../interfaces";
import { WebSocketService } from "../services";
import {
auth,
@ -594,7 +594,14 @@ export class Search extends Component<any, SearchState> {
{i.type_ == "comments" && (
<CommentNodes
key={(i.data as CommentView).comment.id}
nodes={[{ comment_view: i.data as CommentView }]}
nodes={[
{
comment_view: i.data as CommentView,
children: [],
depth: 0,
},
]}
viewType={CommentViewType.Flat}
moderators={None}
admins={None}
maxCommentsShown={None}
@ -631,6 +638,7 @@ export class Search extends Component<any, SearchState> {
return (
<CommentNodes
nodes={commentsToFlatNodes(comments)}
viewType={CommentViewType.Flat}
locked
noIndent
moderators={None}

22
src/shared/interfaces.ts
View file

@ -1,10 +1,5 @@
import { Either, Option } from "@sniptt/monads";
import {
CommentView,
GetSiteResponse,
LemmyHttp,
PersonMentionView,
} from "lemmy-js-client";
import { GetSiteResponse, LemmyHttp } from "lemmy-js-client";
/**
* This contains serialized data, it needs to be deserialized before use.
@ -32,12 +27,6 @@ export interface InitialFetchRequest {
path: string;
}
export interface CommentNode {
comment_view: CommentView | PersonMentionView;
children?: CommentNode[];
depth?: number;
}
export interface PostFormParams {
name: Option<string>;
url: Option<string>;
@ -45,16 +34,9 @@ export interface PostFormParams {
nameOrId: Option<Either<string, number>>;
}
export enum CommentSortType {
Hot,
Top,
New,
Old,
}
export enum CommentViewType {
Tree,
Chat,
Flat,
}
export enum DataType {

4
src/shared/routes.ts
View file

@ -72,12 +72,12 @@ export const routes: IRoutePropsWithFetch[] = [
fetchInitialData: req => Communities.fetchInitialData(req),
},
{
path: `/post/:id/comment/:comment_id`,
path: `/post/:post_id`,
component: Post,
fetchInitialData: req => Post.fetchInitialData(req),
},
{
path: `/post/:id`,
path: `/comment/:comment_id`,
component: Post,
fetchInitialData: req => Post.fetchInitialData(req),
},