Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

refactor: remove comments count #171

Merged
merged 4 commits into from
May 10, 2023
Merged

refactor: remove comments count #171

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
b23aaef
refactor: remove comments count
iuioiua May 9, 2023
56e9c32
better
iuioiua May 9, 2023
d9a0326
Merge branch 'main' into remove-comments-summary-in-item-summary
iuioiua May 9, 2023
405eee3
Merge branch 'main' into remove-comments-summary-in-item-summary
iuioiua May 10, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
18 changes: 10 additions & 8 deletions components/ItemSummary.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,6 @@ export function timeAgo(time: number | Date) {
export interface ItemSummaryProps {
item: Item;
user: User;
commentsCount: number;
isVoted: boolean;
}

Expand All @@ -29,19 +28,22 @@ export default function ItemSummary(props: ItemSummaryProps) {
isVoted={props.isVoted}
/>
<div>
<span class="mr-2 text-black">
<a href={props.item.url}>{props.item.title}</a>
<span class="mr-2">
<a class="text-black hover:underline" href={`/item/${props.item.id}`}>
{props.item.title}
</a>
</span>
<span>
<a class="hover:underline" href={props.item.url} target="_blank">
{new URL(props.item.url).host} ↗
</a>
</span>
{new URL(props.item.url).host}
<p>
{getUserDisplayName(props.user)}{" "}
{props.user.isSubscribed && (
<span title="Deno Hunt premium user">🦕{" "}</span>
)}
{timeAgo(new Date(props.item.createdAt))} ago •{" "}
<a href={`/item/${props.item.id}`}>
{pluralize(props.commentsCount, "comment")}
</a>
{timeAgo(new Date(props.item.createdAt))} ago
</p>
</div>
</div>
Expand Down
8 changes: 1 addition & 7 deletions routes/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,6 @@ import type { State } from "./_middleware.ts";
import ItemSummary from "@/components/ItemSummary.tsx";
import {
getAllItems,
getItemCommentsCount,
getUsersByIds,
getVotedItemIdsByUser,
type Item,
Expand All @@ -17,7 +16,6 @@ import {
interface HomePageData extends State {
users: User[];
items: Item[];
commentsCounts: number[];
areVoted: boolean[];
}

Expand All @@ -38,15 +36,12 @@ export const handler: Handlers<HomePageData, State> = {
/** @todo Add pagination functionality */
const items = (await getAllItems({ limit: 10 })).sort(compareScore);
const users = await getUsersByIds(items.map((item) => item.userId));
const commentsCounts = await Promise.all(
items.map((item) => getItemCommentsCount(item.id)),
);
const votedItemIds = ctx.state.session
? await getVotedItemIdsByUser(ctx.state.session?.user.id)
: [];
/** @todo Optimise */
const areVoted = items.map((item) => votedItemIds.includes(item.id));
return ctx.render({ ...ctx.state, items, commentsCounts, users, areVoted });
return ctx.render({ ...ctx.state, items, users, areVoted });
},
};

Expand All @@ -59,7 +54,6 @@ export default function HomePage(props: PageProps<HomePageData>) {
{props.data.items.map((item, index) => (
<ItemSummary
item={item}
commentsCount={props.data.commentsCounts[index]}
isVoted={props.data.areVoted[index]}
user={props.data.users[index]}
/>
Expand Down
9 changes: 7 additions & 2 deletions routes/item/[id].tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import {
type User,
} from "@/utils/db.ts";
import { redirect } from "@/utils/http.ts";
import { pluralize } from "@/components/ItemSummary.tsx";

interface ItemPageData extends State {
user: User;
Expand Down Expand Up @@ -89,14 +90,18 @@ export default function ItemPage(props: PageProps<ItemPageData>) {
<>
<Head title={props.data.item.title} href={props.url.href} />
<Layout session={props.data.session}>
<div class={`${SITE_WIDTH_STYLES} flex-1 px-8 space-y-4`}>
<div class={`${SITE_WIDTH_STYLES} flex-1 px-8 space-y-8`}>
<ItemSummary
item={props.data.item}
commentsCount={props.data.comments.length}
isVoted={props.data.isVoted}
user={props.data.user}
/>
<div>
<h2>
<strong>
{pluralize(props.data.comments.length, "comment")}
</strong>
</h2>
{props.data.comments.map((comment, index) => (
<div class="py-4">
<p>
Expand Down
7 changes: 0 additions & 7 deletions utils/db.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,13 +98,6 @@ export async function getCommentsByItem(
return comments;
}

export async function getItemCommentsCount(itemId: string) {
const iter = kv.list<Comment>({ prefix: ["comments_by_item", itemId] });
let count = 0;
for await (const _ of iter) count++;
return count;
}

interface InitVote {
userId: string;
itemId: string;
Expand Down