Add FeaturedPost Support (#873)

2024-11-01 01:59:56 +00:00 · 2022-12-14 09:03:18 -06:00 · 2022-12-14 09:03:18 -06:00 · 003b177f6e
commit 003b177f6e
parent a6c0643428
9 changed files with 108 additions and 50 deletions
--- a/2
+++ b/2
@ -1 +1 @@
-Subproject commit 46f4b3e8676c23d4a8100ce78330eceed7bcf053
+Subproject commit a2f59fcbf7529a1f7dd5cda894381ef2000b9ef5
--- a/package.json
+++ b/package.json
@ -47,7 +47,7 @@
    "inferno-server": "^8.0.3",
    "isomorphic-cookie": "^1.2.4",
    "jwt-decode": "^3.1.2",
-    "lemmy-js-client": "0.17.0-rc.54",
+    "lemmy-js-client": "0.17.0-rc.56",
    "markdown-it": "^13.0.1",
    "markdown-it-container": "^3.0.0",
    "markdown-it-footnote": "^3.0.3",
--- a/src/shared/components/community/community.tsx
+++ b/src/shared/components/community/community.tsx
@ -584,7 +584,7 @@ export class Community extends Component<any, State> {
      op == UserOperation.DeletePost ||
      op == UserOperation.RemovePost ||
      op == UserOperation.LockPost ||
-      op == UserOperation.StickyPost ||
+      op == UserOperation.FeaturePost ||
      op == UserOperation.SavePost
    ) {
      let data = wsJsonToRes<PostResponse>(msg, PostResponse);
--- a/src/shared/components/home/home.tsx
+++ b/src/shared/components/home/home.tsx
@ -140,7 +140,7 @@ export class Home extends Component<any, HomeState> {
    dataType: getDataTypeFromProps(this.props),
    sort: getSortTypeFromProps(this.props),
    page: getPageFromProps(this.props),
-    tagline: None
+    tagline: None,
  };

  constructor(props: any, context: any) {
@ -179,7 +179,7 @@ export class Home extends Component<any, HomeState> {
        ...this.state,
        trendingCommunities: trendingRes.communities,
        loading: false,
-        tagline: taglines.map(tls => getRandomFromList(tls).content)
+        tagline: taglines.map(tls => getRandomFromList(tls).content),
      };
    } else {
      this.fetchTrendingCommunities();
@ -336,7 +336,12 @@ export class Home extends Component<any, HomeState> {
          <div className="row">
            <main role="main" className="col-12 col-md-8">
              {this.state.tagline.match({
-                some: tagline => <div id="tagline" dangerouslySetInnerHTML={mdToHtml(tagline)}></div>,
+                some: tagline => (
+                  <div
+                    id="tagline"
+                    dangerouslySetInnerHTML={mdToHtml(tagline)}
+                  ></div>
+                ),
                none: <></>,
              })}
              <div className="d-block d-md-none">{this.mobileView()}</div>
@ -804,7 +809,7 @@ export class Home extends Component<any, HomeState> {
      op == UserOperation.DeletePost ||
      op == UserOperation.RemovePost ||
      op == UserOperation.LockPost ||
-      op == UserOperation.StickyPost ||
+      op == UserOperation.FeaturePost ||
      op == UserOperation.SavePost
    ) {
      let data = wsJsonToRes<PostResponse>(msg, PostResponse);
--- a/src/shared/components/modlog.tsx
+++ b/src/shared/components/modlog.tsx
@ -16,12 +16,12 @@ import {
  ModAddView,
  ModBanFromCommunityView,
  ModBanView,
+  ModFeaturePostView,
  ModLockPostView,
  ModlogActionType,
  ModRemoveCommentView,
  ModRemoveCommunityView,
  ModRemovePostView,
-  ModStickyPostView,
  ModTransferCommunityView,
  PersonSafe,
  toUndefined,
@ -61,7 +61,7 @@ type ModlogType = {
  view:
    | ModRemovePostView
    | ModLockPostView
-    | ModStickyPostView
+    | ModFeaturePostView
    | ModRemoveCommentView
    | ModRemoveCommunityView
    | ModBanFromCommunityView
@ -182,12 +182,12 @@ export class Modlog extends Component<any, ModlogState> {
      when_: r.mod_lock_post.when_,
    }));

-    let stickied_posts: ModlogType[] = res.stickied_posts.map(r => ({
-      id: r.mod_sticky_post.id,
-      type_: ModlogActionType.ModStickyPost,
+    let featured_posts: ModlogType[] = res.featured_posts.map(r => ({
+      id: r.mod_feature_post.id,
+      type_: ModlogActionType.ModFeaturePost,
      view: r,
      moderator: r.moderator,
-      when_: r.mod_sticky_post.when_,
+      when_: r.mod_feature_post.when_,
    }));

    let removed_comments: ModlogType[] = res.removed_comments.map(r => ({
@ -287,7 +287,7 @@ export class Modlog extends Component<any, ModlogState> {

    combined.push(...removed_posts);
    combined.push(...locked_posts);
-    combined.push(...stickied_posts);
+    combined.push(...featured_posts);
    combined.push(...removed_comments);
    combined.push(...removed_communities);
    combined.push(...banned_from_community);
@ -344,18 +344,21 @@ export class Modlog extends Component<any, ModlogState> {
          </>
        );
      }
-      case ModlogActionType.ModStickyPost: {
-        let mspv = i.view as ModStickyPostView;
+      case ModlogActionType.ModFeaturePost: {
+        let mspv = i.view as ModFeaturePostView;
        return (
          <>
            <span>
-              {mspv.mod_sticky_post.stickied.unwrapOr(false)
-                ? "Stickied "
-                : "Unstickied "}
+              {mspv.mod_feature_post.featured ? "Featured " : "Unfeatured "}
            </span>
            <span>
              Post <Link to={`/post/${mspv.post.id}`}>{mspv.post.name}</Link>
            </span>
+            <span>
+              {mspv.mod_feature_post.is_featured_community
+                ? " In Community"
+                : " In Local"}
+            </span>
          </>
        );
      }
@ -679,8 +682,8 @@ export class Modlog extends Component<any, ModlogState> {
                  <option value={ModlogActionType.ModLockPost}>
                    Locking Posts
                  </option>
-                  <option value={ModlogActionType.ModStickyPost}>
-                    Stickying Posts
+                  <option value={ModlogActionType.ModFeaturePost}>
+                    Featuring Posts
                  </option>
                  <option value={ModlogActionType.ModRemoveComment}>
                    Removing Comments
--- a/src/shared/components/person/profile.tsx
+++ b/src/shared/components/person/profile.tsx
@ -864,7 +864,7 @@ export class Profile extends Component<any, ProfileState> {
      op == UserOperation.DeletePost ||
      op == UserOperation.RemovePost ||
      op == UserOperation.LockPost ||
-      op == UserOperation.StickyPost ||
+      op == UserOperation.FeaturePost ||
      op == UserOperation.SavePost
    ) {
      let data = wsJsonToRes<PostResponse>(msg, PostResponse);
--- a/src/shared/components/post/post-listing.tsx
+++ b/src/shared/components/post/post-listing.tsx
@ -12,15 +12,16 @@ import {
  CreatePostLike,
  CreatePostReport,
  DeletePost,
+  FeaturePost,
  Language,
  LockPost,
  PersonViewSafe,
+  PostFeatureType,
  PostView,
  PurgePerson,
  PurgePost,
  RemovePost,
  SavePost,
-  StickyPost,
  toUndefined,
  TransferCommunity,
 } from "lemmy-js-client";
@ -29,6 +30,7 @@ import { i18n } from "../../i18next";
 import { BanType, PurgeType } from "../../interfaces";
 import { UserService, WebSocketService } from "../../services";
 import {
+  amAdmin,
  amCommunityCreator,
  auth,
  canAdmin,
@ -452,7 +454,11 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
    let post = this.props.post_view.post;
    return (
      <Link
-        className={!post.stickied ? "text-body" : "text-primary"}
+        className={
+          !post.featured_community && !post.featured_local
+            ? "text-body"
+            : "text-primary"
+        }
        to={`/post/${post.id}`}
        title={i18n.t("comments")}
      >
@ -470,7 +476,11 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
            some: url =>
              this.props.showBody ? (
                <a
-                  className={!post.stickied ? "text-body" : "text-primary"}
+                  className={
+                    !post.featured_community && !post.featured_local
+                      ? "text-body"
+                      : "text-primary"
+                  }
                  href={url}
                  title={url}
                  rel={relTags}
@ -517,14 +527,22 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
              <Icon icon="lock" classes="icon-inline text-danger" />
            </small>
          )}
-          {post.stickied && (
+          {post.featured_community && (
            <small
              className="unselectable pointer ml-2 text-muted font-italic"
-              data-tippy-content={i18n.t("stickied")}
+              data-tippy-content={i18n.t("featured")}
            >
              <Icon icon="pin" classes="icon-inline text-primary" />
            </small>
          )}
+          {post.featured_local && (
+            <small
+              className="unselectable pointer ml-2 text-muted font-italic"
+              data-tippy-content={i18n.t("featured")}
+            >
+              <Icon icon="pin" classes="icon-inline text-secondary" />
+            </small>
+          )}
          {post.nsfw && (
            <small className="ml-2 text-muted font-italic">
              {i18n.t("nsfw")}
@ -617,7 +635,7 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
            {this.canModOnSelf_ && (
              <>
                {this.lockButton}
-                {this.stickyButton}
+                {this.featureButton}
              </>
            )}
            {(this.canMod_ || this.canAdmin_) && <>{this.modRemoveButton}</>}
@ -854,22 +872,48 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
    );
  }

-  get stickyButton() {
-    let stickied = this.props.post_view.post.stickied;
-    let label = stickied ? i18n.t("unsticky") : i18n.t("sticky");
+  get featureButton() {
+    const featured_community = this.props.post_view.post.featured_community;
+    const label_community = featured_community
+      ? i18n.t("unfeature_from_community")
+      : i18n.t("feature_in_community");
+
+    const is_admin = amAdmin();
+    const featured_local = this.props.post_view.post.featured_local;
+    const label_local = featured_local
+      ? i18n.t("unfeature_from_local")
+      : i18n.t("feature_in_local");
    return (
-      <button
-        className="btn btn-link btn-animate text-muted py-0"
-        onClick={linkEvent(this, this.handleModSticky)}
-        data-tippy-content={label}
-        aria-label={label}
-      >
-        <Icon
-          icon="pin"
-          classes={classNames({ "text-success": stickied })}
-          inline
-        />
-      </button>
+      <span>
+        <button
+          className="btn btn-link btn-animate text-muted py-0 pl-0"
+          onClick={() => this.handleModFeaturePost(this, true)}
+          data-tippy-content={label_community}
+          aria-label={label_community}
+        >
+          <Icon
+            icon="pin"
+            classes={classNames({ "text-success": featured_community })}
+            inline
+          />{" "}
+          Community
+        </button>
+        {is_admin && (
+          <button
+            className="btn btn-link btn-animate text-muted py-0"
+            onClick={() => this.handleModFeaturePost(this, false)}
+            data-tippy-content={label_local}
+            aria-label={label_local}
+          >
+            <Icon
+              icon="pin"
+              classes={classNames({ "text-success": featured_local })}
+              inline
+            />{" "}
+            Local
+          </button>
+        )}
+      </span>
    );
  }

@ -1491,13 +1535,18 @@ export class PostListing extends Component<PostListingProps, PostListingState> {
    WebSocketService.Instance.send(wsClient.lockPost(form));
  }

-  handleModSticky(i: PostListing) {
-    let form = new StickyPost({
+  handleModFeaturePost(i: PostListing, is_community: boolean) {
+    let form = new FeaturePost({
      post_id: i.props.post_view.post.id,
-      stickied: !i.props.post_view.post.stickied,
+      featured: is_community
+        ? !i.props.post_view.post.featured_community
+        : !i.props.post_view.post.featured_local,
+      feature_type: is_community
+        ? PostFeatureType.Community
+        : PostFeatureType.Local,
      auth: auth().unwrap(),
    });
-    WebSocketService.Instance.send(wsClient.stickyPost(form));
+    WebSocketService.Instance.send(wsClient.featurePost(form));
  }

  handleModBanFromCommunityShow(i: PostListing) {
--- a/src/shared/components/post/post.tsx
+++ b/src/shared/components/post/post.tsx
@ -755,7 +755,7 @@ export class Post extends Component<any, PostState> {
      op == UserOperation.DeletePost ||
      op == UserOperation.RemovePost ||
      op == UserOperation.LockPost ||
-      op == UserOperation.StickyPost ||
+      op == UserOperation.FeaturePost ||
      op == UserOperation.SavePost
    ) {
      let data = wsJsonToRes<PostResponse>(msg, PostResponse);
--- a/src/shared/utils.ts
+++ b/src/shared/utils.ts
@ -968,7 +968,8 @@ export function editPostRes(data: PostView, post: PostView) {
    post.post.nsfw = data.post.nsfw;
    post.post.deleted = data.post.deleted;
    post.post.removed = data.post.removed;
-    post.post.stickied = data.post.stickied;
+    post.post.featured_community = data.post.featured_community;
+    post.post.featured_local = data.post.featured_local;
    post.post.body = data.post.body;
    post.post.locked = data.post.locked;
    post.saved = data.saved;
@ -1526,6 +1527,6 @@ export function nsfwCheck(
  );
 }

-export function getRandomFromList<T>(list : T[]) : T{
+export function getRandomFromList<T>(list: T[]): T {
  return list[Math.floor(Math.random() * list.length)];
 }