diff --git a/package.json b/package.json
index f3b1b23a..2de75934 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "impro",
- "version": "0.11.79",
+ "version": "0.11.80",
"type": "module",
"scripts": {
"start": "rm -rf build && NODE_ENV=development eleventy --serve",
diff --git a/src/js/views/postQuotes.view.js b/src/js/views/postQuotes.view.js
index 915cdb41..57df953b 100644
--- a/src/js/views/postQuotes.view.js
+++ b/src/js/views/postQuotes.view.js
@@ -3,10 +3,8 @@ import { View } from "./view.js";
import { mainLayoutTemplate } from "/js/templates/mainLayout.template.js";
import { headerTemplate } from "/js/templates/header.template.js";
import { formatLargeNumber } from "/js/utils.js";
-import { smallPostTemplate } from "/js/templates/smallPost.template.js";
-import { postSkeletonTemplate } from "/js/templates/postSkeleton.template.js";
+import { postFeedTemplate } from "/js/templates/postFeed.template.js";
import { PostInteractionHandler } from "/js/postInteractionHandler.js";
-import "/js/components/infinite-scroll-container.js";
class PostQuotesView extends View {
async render({
@@ -42,44 +40,6 @@ class PostQuotesView extends View {
},
);
- function quotesListTemplate({ quotes, hasMore, currentUser }) {
- if (!quotes || quotes.length === 0) {
- return html`
No quotes yet.
`;
- }
- return html` {
- if (hasMore) {
- await loadQuotes();
- e.detail.resume();
- }
- }}
- >
-
- ${quotes.map((quote) =>
- smallPostTemplate({
- post: quote,
- currentUser,
- isAuthenticated,
- showReplyToLabel: !!quote.record?.reply,
- replyToAuthor: quote.record?.reply?.parentAuthor,
- isUserPost: currentUser?.did === quote.author?.did,
- postInteractionHandler,
- pluginService,
- }),
- )}
-
- ${hasMore
- ? Array.from({ length: 5 }).map(() => postSkeletonTemplate())
- : ""}
- `;
- }
-
- function quotesSkeletonTemplate() {
- return html`
- ${Array.from({ length: 10 }).map(() => postSkeletonTemplate())}
-
`;
- }
-
function quotesErrorTemplate({ error }) {
console.error(error);
return html`
@@ -98,7 +58,6 @@ class PostQuotesView extends View {
const post = dataLayer.selectors.getPost(postUri);
const postQuotesRequestStatus =
dataLayer.requests.getStatus("loadPostQuotes");
- const hasMore = postQuotes?.cursor ? true : false;
const subtitle = post?.quoteCount
? `${formatLargeNumber(post.quoteCount)} ${
@@ -106,6 +65,14 @@ class PostQuotesView extends View {
}`
: null;
+ // Format as feed for postFeedTemplate
+ const postQuotesFeed = postQuotes
+ ? {
+ feed: postQuotes.posts.map((quote) => ({ post: quote })),
+ cursor: postQuotes.cursor,
+ }
+ : null;
+
render(
html`
${mainLayoutTemplate({
@@ -121,21 +88,19 @@ class PostQuotesView extends View {
subtitle,
})}
- ${(() => {
- if (postQuotesRequestStatus.error) {
- return quotesErrorTemplate({
+ ${postQuotesRequestStatus.error
+ ? quotesErrorTemplate({
error: postQuotesRequestStatus.error,
- });
- } else if (postQuotes && postQuotes.posts) {
- return quotesListTemplate({
- quotes: postQuotes.posts,
+ })
+ : postFeedTemplate({
+ feed: postQuotesFeed,
currentUser,
- hasMore,
- });
- } else {
- return quotesSkeletonTemplate();
- }
- })()}
+ isAuthenticated,
+ onLoadMore: loadQuotes,
+ postInteractionHandler,
+ emptyMessage: "No quotes yet.",
+ pluginService,
+ })}
`,
})}
`,
diff --git a/tests/e2e/specs/views/postQuotes.view.test.js b/tests/e2e/specs/views/postQuotes.view.test.js
index ba9d72b4..a5000561 100644
--- a/tests/e2e/specs/views/postQuotes.view.test.js
+++ b/tests/e2e/specs/views/postQuotes.view.test.js
@@ -100,7 +100,7 @@ test.describe("Post quotes view", () => {
{ timeout: 10000 },
);
- await expect(view.locator(".search-status-message")).toContainText(
+ await expect(view.locator(".feed-end-message")).toContainText(
"No quotes yet.",
{ timeout: 10000 },
);