impro.social / impro
[READ-ONLY] Mirror of https://github.com/improsocial/impro An extensible Bluesky client for web impro.social
6
Fork 1

Configure Feed

Select the types of activity you want to include in your feed.

Update muted large post rendering

Grace Kind (May 2, 2026, 2:16 PM -0500) 161459d2 99c5a7c7

+135 -137
+1 -1
package.json
··· 1 1 { 2 2 "name": "impro", 3 - "version": "0.11.36", 3 + "version": "0.11.37", 4 4 "type": "module", 5 5 "scripts": { 6 6 "start": "rm -rf build && NODE_ENV=development eleventy --serve",
+4
src/css/style.css
··· 1518 1518 margin-bottom: 10px; 1519 1519 } 1520 1520 1521 + .large-post moderation-warning .top-bar { 1522 + margin-bottom: 0; 1523 + } 1524 + 1521 1525 .post-content { 1522 1526 position: relative; 1523 1527 display: flex;
+100 -105
src/js/templates/largePost.template.js
··· 23 23 } from "/js/navigation.js"; 24 24 import "/js/components/lightbox-image-group.js"; 25 25 26 + function mutedWarningTemplate({ post, children }) { 27 + if (post.viewer?.hasMutedWord) { 28 + return html`<moderation-warning 29 + label="Post hidden by muted word" 30 + icon-style="closed-eye" 31 + >${children}</moderation-warning 32 + > `; 33 + } else if (post.viewer?.isHidden) { 34 + return html`<moderation-warning 35 + label="Post hidden by you" 36 + icon-style="closed-eye" 37 + >${children}</moderation-warning 38 + > `; 39 + } 40 + return children; 41 + } 42 + 26 43 function postActionCountsTemplate({ 27 44 repostCount, 28 45 likeCount, ··· 110 127 if (contentLabel && contentLabel.visibility !== "ignore") { 111 128 badgeLabels.push(contentLabel); 112 129 } 113 - let content = html` 114 - <div class="post-content"> 115 - <div class="post-content-top"> 116 - <div> 117 - ${ 118 - replyContext === "parent" || replyContext === "reply" 119 - ? html`<div class="reply-context-line-in"></div>` 120 - : "" 121 - } 122 - <div>${avatarTemplate({ author: post.author })}</div> 123 - </div> 124 - <div class="large-post-header-text"> 125 - ${postHeaderTextTemplate({ 126 - author: post.author, 127 - timestamp: post.indexedAt, 128 - includeTime: false, 129 - })} 130 - </div> 130 + return html`<div class="post large-post" data-testid="large-post"> 131 + <div class="post-content"> 132 + <div class="post-content-top"> 133 + <div> 134 + ${replyContext === "parent" || replyContext === "reply" 135 + ? html`<div class="reply-context-line-in"></div>` 136 + : ""} 137 + <div>${avatarTemplate({ author: post.author })}</div> 138 + </div> 139 + <div class="large-post-header-text"> 140 + ${postHeaderTextTemplate({ 141 + author: post.author, 142 + timestamp: post.indexedAt, 143 + includeTime: false, 144 + })} 131 145 </div> 132 - ${badgeLabels.length > 0 ? postLabelsTemplate({ badgeLabels }) : ""} 133 - <div class="post-content-bottom"> 134 - <div class="post-body"> 135 - ${ 136 - postText.length > 0 137 - ? html`<div class="post-text"> 138 - ${richTextTemplate({ 139 - text: postText, 140 - facets: post.record.facets, 141 - truncateUrls: true, 142 - })} 143 - </div>` 144 - : "" 146 + </div> 147 + ${badgeLabels.length > 0 ? postLabelsTemplate({ badgeLabels }) : ""} 148 + <div class="post-content-bottom"> 149 + ${mutedWarningTemplate({ 150 + post, 151 + children: html`<div class="post-body"> 152 + ${postText.length > 0 153 + ? html`<div class="post-text"> 154 + ${richTextTemplate({ 155 + text: postText, 156 + facets: post.record.facets, 157 + truncateUrls: true, 158 + })} 159 + </div>` 160 + : ""} 161 + ${post.embed 162 + ? html`<div class="post-embed"> 163 + ${postEmbedTemplate({ 164 + embed: post.embed, 165 + mediaLabel: post.mediaLabel, 166 + isAuthenticated, 167 + })} 168 + </div>` 169 + : null} 170 + </div>`, 171 + })} 172 + <div class="post-full-timestamp"> 173 + ${formatFullTimestamp(post.indexedAt)} 174 + ${whoCanReplyBadgeTemplate({ post })} 175 + </div> 176 + ${postActionCountsTemplate({ 177 + repostCount: post.repostCount, 178 + quoteCount: post.quoteCount, 179 + likeCount: post.likeCount, 180 + bookmarkCount: post.bookmarkCount, 181 + post, 182 + })} 183 + ${postActionBarTemplate({ 184 + post, 185 + isUserPost, 186 + isAuthenticated, 187 + currentUser, 188 + onClickReply, 189 + onClickLike: (post, doLike) => 190 + postInteractionHandler.handleLike(post, doLike), 191 + onClickRepost: (post, doRepost) => 192 + postInteractionHandler.handleRepost(post, doRepost), 193 + onClickQuotePost: (post) => 194 + postInteractionHandler.handleQuotePost(post), 195 + onClickBookmark: (post, doBookmark) => 196 + postInteractionHandler.handleBookmark(post, doBookmark), 197 + onClickHidePost: async (post) => { 198 + await postInteractionHandler.handleHidePost(post); 199 + if (afterHide) { 200 + afterHide(post); 145 201 } 146 - ${ 147 - post.embed 148 - ? html`<div class="post-embed"> 149 - ${postEmbedTemplate({ 150 - embed: post.embed, 151 - mediaLabel: post.mediaLabel, 152 - isAuthenticated, 153 - })} 154 - </div>` 155 - : null 202 + }, 203 + onClickMute: (profile, doMute) => 204 + postInteractionHandler.handleMuteAuthor(profile, doMute), 205 + onClickBlock: (profile, doBlock) => 206 + postInteractionHandler.handleBlockAuthor(profile, doBlock), 207 + onClickDelete: async (post) => { 208 + await postInteractionHandler.handleDeletePost(post); 209 + if (afterDelete) { 210 + afterDelete(post); 156 211 } 157 - <div class="post-full-timestamp"> 158 - ${formatFullTimestamp(post.indexedAt)} 159 - ${whoCanReplyBadgeTemplate({ post })} 160 - </div> 161 - ${postActionCountsTemplate({ 162 - repostCount: post.repostCount, 163 - quoteCount: post.quoteCount, 164 - likeCount: post.likeCount, 165 - bookmarkCount: post.bookmarkCount, 166 - post, 167 - })} 168 - ${postActionBarTemplate({ 169 - post, 170 - isUserPost, 171 - isAuthenticated, 172 - currentUser, 173 - onClickReply, 174 - onClickLike: (post, doLike) => 175 - postInteractionHandler.handleLike(post, doLike), 176 - onClickRepost: (post, doRepost) => 177 - postInteractionHandler.handleRepost(post, doRepost), 178 - onClickQuotePost: (post) => 179 - postInteractionHandler.handleQuotePost(post), 180 - onClickBookmark: (post, doBookmark) => 181 - postInteractionHandler.handleBookmark(post, doBookmark), 182 - onClickHidePost: async (post) => { 183 - await postInteractionHandler.handleHidePost(post); 184 - if (afterHide) { 185 - afterHide(post); 186 - } 187 - }, 188 - onClickMute: (profile, doMute) => 189 - postInteractionHandler.handleMuteAuthor(profile, doMute), 190 - onClickBlock: (profile, doBlock) => 191 - postInteractionHandler.handleBlockAuthor(profile, doBlock), 192 - onClickDelete: async (post) => { 193 - await postInteractionHandler.handleDeletePost(post); 194 - if (afterDelete) { 195 - afterDelete(post); 196 - } 197 - }, 198 - onClickReport: (post) => 199 - postInteractionHandler.handleReport(post), 200 - })} 201 - </div> 202 - </div> 203 - </div> 212 + }, 213 + onClickReport: (post) => postInteractionHandler.handleReport(post), 214 + })} 204 215 </div> 205 - `; 206 - 207 - if (post.viewer?.hasMutedWord) { 208 - content = html`<moderation-warning 209 - label="Post hidden by muted word" 210 - icon-style="closed-eye" 211 - >${content}</moderation-warning 212 - > `; 213 - } else if (post.viewer?.isHidden) { 214 - content = html`<moderation-warning 215 - label="Post hidden by you" 216 - icon-style="closed-eye" 217 - >${content}</moderation-warning 218 - > `; 219 - } 220 - return html`<div class="post large-post" data-testid="large-post"> 221 - ${content} 216 + </div> 222 217 </div>`; 223 218 }
+30 -31
src/js/templates/smallPost.template.js
··· 164 164 })} 165 165 </div>` 166 166 : null}`} 167 - ${postActionBarTemplate({ 168 - post, 169 - isUserPost, 170 - isAuthenticated, 171 - currentUser, 172 - onClickReply: () => { 173 - window.router.go(linkToPost(post)); 174 - }, 175 - onClickLike: (post, doLike) => 176 - postInteractionHandler.handleLike(post, doLike), 177 - onClickRepost: (post, doRepost) => 178 - postInteractionHandler.handleRepost(post, doRepost), 179 - onClickQuotePost: (post) => 180 - postInteractionHandler.handleQuotePost(post), 181 - onClickBookmark: (post, doBookmark) => 182 - postInteractionHandler.handleBookmark(post, doBookmark), 183 - onClickShowLess, 184 - onClickShowMore, 185 - onClickHidePost: (post) => 186 - postInteractionHandler.handleHidePost(post), 187 - onClickMute: (profile, doMute) => 188 - postInteractionHandler.handleMuteAuthor(profile, doMute), 189 - onClickBlock: (profile, doBlock) => 190 - postInteractionHandler.handleBlockAuthor(profile, doBlock), 191 - onClickDelete: (post) => { 192 - postInteractionHandler.handleDeletePost(post); 193 - }, 194 - onClickReport: (post) => 195 - postInteractionHandler.handleReport(post), 196 - enableFeedFeedback, 197 - })} 198 167 </div>`, 168 + })} 169 + ${postActionBarTemplate({ 170 + post, 171 + isUserPost, 172 + isAuthenticated, 173 + currentUser, 174 + onClickReply: () => { 175 + window.router.go(linkToPost(post)); 176 + }, 177 + onClickLike: (post, doLike) => 178 + postInteractionHandler.handleLike(post, doLike), 179 + onClickRepost: (post, doRepost) => 180 + postInteractionHandler.handleRepost(post, doRepost), 181 + onClickQuotePost: (post) => 182 + postInteractionHandler.handleQuotePost(post), 183 + onClickBookmark: (post, doBookmark) => 184 + postInteractionHandler.handleBookmark(post, doBookmark), 185 + onClickShowLess, 186 + onClickShowMore, 187 + onClickHidePost: (post) => 188 + postInteractionHandler.handleHidePost(post), 189 + onClickMute: (profile, doMute) => 190 + postInteractionHandler.handleMuteAuthor(profile, doMute), 191 + onClickBlock: (profile, doBlock) => 192 + postInteractionHandler.handleBlockAuthor(profile, doBlock), 193 + onClickDelete: (post) => { 194 + postInteractionHandler.handleDeletePost(post); 195 + }, 196 + onClickReport: (post) => postInteractionHandler.handleReport(post), 197 + enableFeedFeedback, 199 198 })} 200 199 </div> 201 200 </div>