From 84887b6feb93e13e5a0b87e0db5af917f6c73884 Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Sat, 17 Jun 2023 12:32:12 -0400 Subject: [PATCH 01/10] fix: Only post title should be inside h5, not the additional metadata icons --- src/shared/components/post/post-listing.tsx | 148 +++++++++----------- 1 file changed, 70 insertions(+), 78 deletions(-) diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx index b9d41250..40b8ff27 100644 --- a/src/shared/components/post/post-listing.tsx +++ b/src/shared/components/post/post-listing.tsx @@ -519,88 +519,80 @@ export class PostListing extends Component { return (
-
- {url ? ( - this.props.showBody ? ( - -
- - ) : ( - this.postLink - ) +
+ {url && this.props.showBody ? ( + ) : ( this.postLink )} - {(url && isImage(url)) || - (post.thumbnail_url && ( - - ))} - {post.removed && ( - - {i18n.t("removed")} - - )} - {post.deleted && ( - - - - )} - {post.locked && ( - - - - )} - {post.featured_community && ( - - - - )} - {post.featured_local && ( - - - - )} - {post.nsfw && ( - - {i18n.t("nsfw")} - - )}
+ {(url && isImage(url)) || + (post.thumbnail_url && ( + + ))} + {post.removed && ( + + {i18n.t("removed")} + + )} + {post.deleted && ( + + + + )} + {post.locked && ( + + + + )} + {post.featured_community && ( + + + + )} + {post.featured_local && ( + + + + )} + {post.nsfw && ( + + {i18n.t("nsfw")} + + )}
); } From 086b0c0cc9d5fad51698838bfde6f7dee0304b06 Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Sat, 17 Jun 2023 18:03:12 -0400 Subject: [PATCH 02/10] feat: Move advanced post menu into dropdown --- src/shared/components/post/post-listing.tsx | 214 +++++++++++--------- 1 file changed, 121 insertions(+), 93 deletions(-) diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx index b9d41250..6f0fe08b 100644 --- a/src/shared/components/post/post-listing.tsx +++ b/src/shared/components/post/post-listing.tsx @@ -659,6 +659,17 @@ export class PostListing extends Component { ); } + get hasAdvancedButtons() { + return ( + this.myPost || + (this.showBody && this.postView.post.body) || + amMod(this.props.moderators) || + amAdmin() || + this.canMod_ || + this.canAdmin_ + ); + } + postActions(mobile = false) { // Possible enhancement: Priority+ pattern instead of just hard coding which get hidden behind the show more button. // Possible enhancement: Make each button a component. @@ -667,37 +678,52 @@ export class PostListing extends Component { <> {this.saveButton} {this.crossPostButton} - {mobile && this.showMoreButton} - {(!mobile || this.state.showAdvanced) && ( - <> - {!this.myPost && ( - <> - {this.reportButton} - {this.blockButton} - - )} - {this.myPost && (this.showBody || this.state.showAdvanced) && ( - <> - {this.editButton} - {this.deleteButton} - - )} - + + {this.showBody && post_view.post.body && this.viewSourceButton} + + {this.hasAdvancedButtons && ( +
+ + +
    + {!this.myPost ? ( + <> +
  • {this.reportButton}
    • +
  • {this.blockButton}
    • + + ) : ( + <> +
  • {this.editButton}
    • +
  • {this.deleteButton}
    • + + )} + + {/* Any mod can do these, not limited to hierarchy*/} + {(amMod(this.props.moderators) || amAdmin()) && ( + <> +
  • +
    +
    • +
  • {this.lockButton}
    • + {this.featureButtons} + + )} + + {(this.canMod_ || this.canAdmin_) && ( +
  • {this.modRemoveButton}
    • + )} +
+
)} - {this.state.showAdvanced && ( - <> - {this.showBody && post_view.post.body && this.viewSourceButton} - {/* Any mod can do these, not limited to hierarchy*/} - {(amMod(this.props.moderators) || amAdmin()) && ( - <> - {this.lockButton} - {this.featureButton} - - )} - {(this.canMod_ || this.canAdmin_) && <>{this.modRemoveButton}} - - )} - {!mobile && this.showMoreButton} ); } @@ -846,7 +872,7 @@ export class PostListing extends Component { get reportButton() { return ( ); } @@ -887,7 +914,7 @@ export class PostListing extends Component { const label = !deleted ? i18n.t("delete") : i18n.t("restore"); return ( ); } - get showMoreButton() { - return ( - - ); - } - get viewSourceButton() { return ( ); } - get featureButton() { + get featureButtons() { const featuredCommunity = this.postView.post.featured_community; const labelCommunity = featuredCommunity ? i18n.t("unfeature_from_community") @@ -969,48 +989,56 @@ export class PostListing extends Component { ? i18n.t("unfeature_from_local") : i18n.t("feature_in_local"); return ( - - - {amAdmin() && ( + <> +
  • - )} - +
    • +
  • + {amAdmin() && ( + + )} +
    • + ); } @@ -1018,7 +1046,7 @@ export class PostListing extends Component { const removed = this.postView.post.removed; return (
    ); } @@ -670,7 +670,7 @@ export class PostListing extends Component { ); } - postActions(mobile = false) { + postActions() { // Possible enhancement: Priority+ pattern instead of just hard coding which get hidden behind the show more button. // Possible enhancement: Make each button a component. const post_view = this.postView; From 4f9d5bf95d41f4e1d5bc7843b3922c5f2a9ef8d9 Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Sat, 17 Jun 2023 18:23:53 -0400 Subject: [PATCH 04/10] Empty commit to re-trigger Woodpecker job From c48ee703c0d9a93396a081b574134a07f22c58c1 Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Sat, 17 Jun 2023 18:28:35 -0400 Subject: [PATCH 05/10] fix: Fix some button labels and tippy text --- src/shared/components/post/post-listing.tsx | 7 ++----- 1 file changed, 2 insertions(+), 5 deletions(-) diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx index 7fca5793..4b6003e3 100644 --- a/src/shared/components/post/post-listing.tsx +++ b/src/shared/components/post/post-listing.tsx @@ -900,7 +900,6 @@ export class PostListing extends Component { @@ -959,7 +957,6 @@ export class PostListing extends Component { From a7b0e2002dd366dae4cdffebd4db6339ad4169c4 Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Sat, 17 Jun 2023 19:10:53 -0400 Subject: [PATCH 06/10] fix(a11y): Add aria-controls for advanced button dropdown --- src/shared/components/post/post-listing.tsx | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx index 4b6003e3..b94155cd 100644 --- a/src/shared/components/post/post-listing.tsx +++ b/src/shared/components/post/post-listing.tsx @@ -689,12 +689,13 @@ export class PostListing extends Component { data-tippy-content={i18n.t("more")} data-bs-toggle="dropdown" aria-expanded="false" + aria-controls="advancedButtonsDropdown" aria-label={i18n.t("more")} > -
      +
        {!this.myPost ? ( <>
      • {this.reportButton}
        • From d0ae0f75433507a843e973122fad7aa62e1a3b9b Mon Sep 17 00:00:00 2001 From: Jay Sitter Date: Sat, 17 Jun 2023 21:02:58 -0400 Subject: [PATCH 07/10] fix: Fix vertical alignment and border radius of advanced dropdown menu items --- src/shared/components/post/post-listing.tsx | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/shared/components/post/post-listing.tsx b/src/shared/components/post/post-listing.tsx index b94155cd..6e29f7f7 100644 --- a/src/shared/components/post/post-listing.tsx +++ b/src/shared/components/post/post-listing.tsx @@ -873,7 +873,7 @@ export class PostListing extends Component { get reportButton() { return (