LemmyNet/lemmy-ui
2
0
Fork 0
mirror of https://github.com/LemmyNet/lemmy-ui.git synced 2024-11-28 23:31:14 +00:00
Code Issues Projects Releases Wiki Activity

Mark post as read when clicking "Expand here" on the preview image on the post listing page (#1600) (#1978)

Browse source 
* Mark post as read when clicking "Expand here" on the preview image on the post listing page (#1600)

* Simplified check for mark post as read

* Implemented mark post as read as a property callback instead of directly using HttpService

---------

Co-authored-by: SleeplessOne1917 <abias1122@gmail.com>
This commit is contained in:
Milan Damen 2023-08-04 14:47:17 +00:00 committed by Dessalines
parent 47c8c80111
commit 2fa7c11666
10 changed files with 56 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -62,6 +62,7 @@ import {
LockPost,
MarkCommentReplyAsRead,
MarkPersonMentionAsRead,
MarkPostAsRead,
PostResponse,
PurgeComment,
PurgeCommunity,
@ -195,6 +196,7 @@ export class Community extends Component<
this.handleSavePost = this.handleSavePost.bind(this);
this.handlePurgePost = this.handlePurgePost.bind(this);
this.handleFeaturePost = this.handleFeaturePost.bind(this);
this.handleMarkPostAsRead = this.handleMarkPostAsRead.bind(this);
this.mainContentRef = createRef();
// Only fetch the data if coming from another route
if (FirstLoadService.isFirstLoad) {
@ -431,6 +433,7 @@ export class Community extends Component<
onAddAdmin={this.handleAddAdmin}
onTransferCommunity={this.handleTransferCommunity}
onFeaturePost={this.handleFeaturePost}
onMarkPostAsRead={this.handleMarkPostAsRead}
/>
);
}
@ -801,6 +804,11 @@ export class Community extends Component<
await HttpService.client.markPersonMentionAsRead(form);
}
async handleMarkPostAsRead(form: MarkPostAsRead) {
const res = await HttpService.client.markPostAsRead(form);
this.findAndUpdatePost(res);
}
async handleBanFromCommunity(form: BanFromCommunity) {
const banRes = await HttpService.client.banFromCommunity(form);
this.updateBanFromCommunity(banRes);

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

@ -59,6 +59,7 @@ import {
LockPost,
MarkCommentReplyAsRead,
MarkPersonMentionAsRead,
MarkPostAsRead,
PostResponse,
PurgeComment,
PurgeItemResponse,
@ -268,6 +269,7 @@ export class Home extends Component<any, HomeState> {
this.handleSavePost = this.handleSavePost.bind(this);
this.handlePurgePost = this.handlePurgePost.bind(this);
this.handleFeaturePost = this.handleFeaturePost.bind(this);
this.handleMarkPostAsRead = this.handleMarkPostAsRead.bind(this);
// Only fetch the data if coming from another route
if (FirstLoadService.isFirstLoad) {
@ -698,6 +700,7 @@ export class Home extends Component<any, HomeState> {
onAddAdmin={this.handleAddAdmin}
onTransferCommunity={this.handleTransferCommunity}
onFeaturePost={this.handleFeaturePost}
onMarkPostAsRead={this.handleMarkPostAsRead}
/>
);
}
@ -1025,6 +1028,11 @@ export class Home extends Component<any, HomeState> {
this.updateBan(banRes);
}
async handleMarkPostAsRead(form: MarkPostAsRead) {
const res = await HttpService.client.markPostAsRead(form);
this.findAndUpdatePost(res);
}
updateBanFromCommunity(banRes: RequestState<BanFromCommunityResponse>) {
// Maybe not necessary
if (banRes.state === "success") {

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

@ -25,6 +25,7 @@ import {
LockPost,
MarkCommentReplyAsRead,
MarkPersonMentionAsRead,
MarkPostAsRead,
PersonView,
PostView,
PurgeComment,
@ -84,6 +85,7 @@ interface PersonDetailsProps {
onSavePost(form: SavePost): void;
onFeaturePost(form: FeaturePost): void;
onPurgePost(form: PurgePost): void;
onMarkPostAsRead(form: MarkPostAsRead): void;
}
enum ItemEnum {
@ -200,6 +202,7 @@ export class PersonDetails extends Component<PersonDetailsProps, any> {
onAddModToCommunity={this.props.onAddModToCommunity}
onAddAdmin={this.props.onAddAdmin}
onTransferCommunity={this.props.onTransferCommunity}
onMarkPostAsRead={this.props.onMarkPostAsRead}
/>
);
}
@ -311,6 +314,7 @@ export class PersonDetails extends Component<PersonDetailsProps, any> {
onAddModToCommunity={this.props.onAddModToCommunity}
onAddAdmin={this.props.onAddAdmin}
onTransferCommunity={this.props.onTransferCommunity}
onMarkPostAsRead={this.props.onMarkPostAsRead}
/>
<hr className="my-3" />
</>

8
src/shared/components/person/profile.tsx
View file

@ -60,6 +60,7 @@ import {
LockPost,
MarkCommentReplyAsRead,
MarkPersonMentionAsRead,
MarkPostAsRead,
PersonView,
PostResponse,
PurgeComment,
@ -208,6 +209,7 @@ export class Profile extends Component<
this.handlePurgePost = this.handlePurgePost.bind(this);
this.handleFeaturePost = this.handleFeaturePost.bind(this);
this.handleModBanSubmit = this.handleModBanSubmit.bind(this);
this.handleMarkPostAsRead = this.handleMarkPostAsRead.bind(this);
// Only fetch the data if coming from another route
if (FirstLoadService.isFirstLoad) {
@ -376,6 +378,7 @@ export class Profile extends Component<
onSavePost={this.handleSavePost}
onPurgePost={this.handlePurgePost}
onFeaturePost={this.handleFeaturePost}
onMarkPostAsRead={this.handleMarkPostAsRead}
/>
</div>
@ -944,6 +947,11 @@ export class Profile extends Component<
await HttpService.client.markPersonMentionAsRead(form);
}
async handleMarkPostAsRead(form: MarkPostAsRead) {
const res = await HttpService.client.markPostAsRead(form);
this.findAndUpdatePost(res);
}
async handleBanFromCommunity(form: BanFromCommunity) {
const banRes = await HttpService.client.banFromCommunity(form);
this.updateBanFromCommunity(banRes);

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

@ -447,6 +447,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
onAddModToCommunity={() => {}}
onAddAdmin={() => {}}
onTransferCommunity={() => {}}
onMarkPostAsRead={() => {}}
/>
</>
)}
@ -643,6 +644,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
onAddModToCommunity={() => {}}
onAddAdmin={() => {}}
onTransferCommunity={() => {}}
onMarkPostAsRead={() => {}}
/>
</>
)

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

@ -1,4 +1,4 @@
import { myAuthRequired } from "@utils/app";
import { myAuth, myAuthRequired } from "@utils/app";
import { canShare, share } from "@utils/browser";
import { getExternalHost, getHttpBase } from "@utils/env";
import {
@ -34,6 +34,7 @@ import {
FeaturePost,
Language,
LockPost,
MarkPostAsRead,
PersonView,
PostView,
PurgePerson,
@ -130,6 +131,7 @@ interface PostListingProps {
onAddModToCommunity(form: AddModToCommunity): void;
onAddAdmin(form: AddAdmin): void;
onTransferCommunity(form: TransferCommunity): void;
onMarkPostAsRead(form: MarkPostAsRead): void;
}
export class PostListing extends Component<PostListingProps, PostListingState> {
@ -1723,6 +1725,15 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
event.preventDefault();
i.setState({ imageExpanded: !i.state.imageExpanded });
setupTippy();
const auth = myAuth();
if (auth && !i.props.post_view.read) {
i.props.onMarkPostAsRead({
post_id: i.props.post_view.post.id,
read: true,
auth: auth,
});
}
}
handleViewSource(i: PostListing) {

3
src/shared/components/post/post-listings.tsx
View file

@ -14,6 +14,7 @@ import {
FeaturePost,
Language,
LockPost,
MarkPostAsRead,
PostView,
PurgePerson,
PurgePost,
@ -49,6 +50,7 @@ interface PostListingsProps {
onAddModToCommunity(form: AddModToCommunity): void;
onAddAdmin(form: AddAdmin): void;
onTransferCommunity(form: TransferCommunity): void;
onMarkPostAsRead(form: MarkPostAsRead): void;
}
export class PostListings extends Component<PostListingsProps, any> {
@ -95,6 +97,7 @@ export class PostListings extends Component<PostListingsProps, any> {
onAddModToCommunity={this.props.onAddModToCommunity}
onAddAdmin={this.props.onAddAdmin}
onTransferCommunity={this.props.onTransferCommunity}
onMarkPostAsRead={this.props.onMarkPostAsRead}
/>
{idx + 1 !== this.posts.length && <hr className="my-3" />}
</>

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

@ -87,6 +87,7 @@ export class PostReport extends Component<PostReportProps, PostReportState> {
onAddModToCommunity={() => {}}
onAddAdmin={() => {}}
onTransferCommunity={() => {}}
onMarkPostAsRead={() => {}}
/>
<div>
{I18NextService.i18n.t("reporter")}:{" "}

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

@ -63,6 +63,7 @@ import {
LockPost,
MarkCommentReplyAsRead,
MarkPersonMentionAsRead,
MarkPostAsRead,
PostResponse,
PurgeComment,
PurgeCommunity,
@ -171,6 +172,7 @@ export class Post extends Component<any, PostState> {
this.handleSavePost = this.handleSavePost.bind(this);
this.handlePurgePost = this.handlePurgePost.bind(this);
this.handleFeaturePost = this.handleFeaturePost.bind(this);
this.handleMarkPostAsRead = this.handleMarkPostAsRead.bind(this);
this.state = { ...this.state, commentSectionRef: createRef() };
@ -384,6 +386,7 @@ export class Post extends Component<any, PostState> {
onAddAdmin={this.handleAddAdmin}
onTransferCommunity={this.handleTransferCommunity}
onFeaturePost={this.handleFeaturePost}
onMarkPostAsRead={this.handleMarkPostAsRead}
/>
<div ref={this.state.commentSectionRef} className="mb-2" />
@ -921,6 +924,11 @@ export class Post extends Component<any, PostState> {
await HttpService.client.markPersonMentionAsRead(form);
}
async handleMarkPostAsRead(form: MarkPostAsRead) {
const res = await HttpService.client.markPostAsRead(form);
this.updatePost(res);
}
async handleBanFromCommunity(form: BanFromCommunity) {
const banRes = await HttpService.client.banFromCommunity(form);
this.updateBan(banRes);

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

@ -706,6 +706,7 @@ export class Search extends Component<any, SearchState> {
onAddModToCommunity={() => {}}
onAddAdmin={() => {}}
onTransferCommunity={() => {}}
onMarkPostAsRead={() => {}}
/>
)}
{i.type_ === "comments" && (
@ -856,6 +857,7 @@ export class Search extends Component<any, SearchState> {
onAddModToCommunity={() => {}}
onAddAdmin={() => {}}
onTransferCommunity={() => {}}
onMarkPostAsRead={() => {}}
/>
</div>
</div>