mirror of
https://github.com/LemmyNet/lemmy-ui.git
synced 2024-12-24 02:02:20 +00:00
Mark post as read when clicking "Expand here" on the preview image on the post listing page (#1600) (#1978)
* 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:
parent
2531d05191
commit
afafb777b4
|
@ -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);
|
||||
|
|
|
@ -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") {
|
||||
|
|
|
@ -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" />
|
||||
</>
|
||||
|
|
|
@ -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);
|
||||
|
|
|
@ -447,6 +447,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
|
|||
onAddModToCommunity={() => {}}
|
||||
onAddAdmin={() => {}}
|
||||
onTransferCommunity={() => {}}
|
||||
onMarkPostAsRead={() => {}}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
|
@ -641,6 +642,7 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
|
|||
onAddModToCommunity={() => {}}
|
||||
onAddAdmin={() => {}}
|
||||
onTransferCommunity={() => {}}
|
||||
onMarkPostAsRead={() => {}}
|
||||
/>
|
||||
</>
|
||||
)
|
||||
|
|
|
@ -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) {
|
||||
|
|
|
@ -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" />}
|
||||
</>
|
||||
|
|
|
@ -87,6 +87,7 @@ export class PostReport extends Component<PostReportProps, PostReportState> {
|
|||
onAddModToCommunity={() => {}}
|
||||
onAddAdmin={() => {}}
|
||||
onTransferCommunity={() => {}}
|
||||
onMarkPostAsRead={() => {}}
|
||||
/>
|
||||
<div>
|
||||
{I18NextService.i18n.t("reporter")}:{" "}
|
||||
|
|
|
@ -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" />
|
||||
<CommentForm
|
||||
|
@ -917,6 +920,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);
|
||||
|
|
|
@ -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>
|
||||
|
|
Loading…
Reference in a new issue