{error}
diff --git a/src/app/feed/components/FeedView.ts b/src/app/feed/components/FeedView.ts
deleted file mode 100644
index b79acb9..0000000
--- a/src/app/feed/components/FeedView.ts
+++ /dev/null
@@ -1,36 +0,0 @@
-import { useCallback, useRef, useState } from 'react'
-import { Post } from '../posts/posts.ts'
-
-const PageSize = 20
-
-export function useFeedViewModel(
- loadMore: (cursor: string | null, amount: number) => Promise
,
-) {
- const [pages, setPages] = useState([])
- const [hasMore, setHasMore] = useState(true)
- const [error, setError] = useState(null)
-
- const cursor = useRef(null)
- const loading = useRef(false)
-
- const loadNextPage = useCallback(async () => {
- if (loading.current || !hasMore || error) return
- loading.current = true
-
- try {
- const delay = new Promise((resolve) => setTimeout(resolve, 500))
- const pagePromise = loadMore(cursor.current, PageSize)
- const [page] = await Promise.all([pagePromise, delay])
- setHasMore(page.length >= PageSize)
- cursor.current = page.at(-1)?.postId ?? null
- setPages((prev) => [...prev, page])
- } catch (e: unknown) {
- const err = e as Error
- setError(err.message)
- } finally {
- loading.current = false
- }
- }, [loadMore, hasMore, error])
-
- return { pages, setPages, loadNextPage, error } as const
-}
diff --git a/src/app/feed/components/FeedView.tsx b/src/app/feed/components/FeedView.tsx
deleted file mode 100644
index d35256f..0000000
--- a/src/app/feed/components/FeedView.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { useRef } from 'react'
-import { useIntersectionLoad } from '../../../hooks/useIntersectionLoad.ts'
-import { Post } from '../posts/posts.ts'
-import PostItem from './PostItem.tsx'
-
-interface FeedViewProps {
- pages: Post[][]
- onLoadMore: () => Promise
-}
-
-export default function FeedView({ pages, onLoadMore }: FeedViewProps) {
- const sentinelRef = useRef(null)
- const posts = pages.flat()
-
- useIntersectionLoad(onLoadMore, sentinelRef)
-
- return (
-
-
-
- {posts.map((post) => (
-
- ))}
-
-
-
-
+
+
+
+
+
+
@@ -196,7 +198,15 @@ async function optimizeImageSize(
dstCanvas.width = width
dstCanvas.height = height
- await pica.resize(srcCanvas, dstCanvas)
+ try {
+ // TODO resistFingerprinting in FF and other causes this to break.
+ // knowing this, i would still rather be able to post from other browsers for now
+ // and will hopefully find a better solution
+ await pica.resize(srcCanvas, dstCanvas)
+ } catch (e) {
+ console.error('cant resize image', e)
+ return file
+ }
let blob = await pica.toBlob(dstCanvas, outputType, quality)
diff --git a/src/app/feed/components/PostItem.tsx b/src/app/feed/components/PostItem.tsx
index 582e05b..db766f6 100644
--- a/src/app/feed/components/PostItem.tsx
+++ b/src/app/feed/components/PostItem.tsx
@@ -1,12 +1,24 @@
-import { Post, PostMedia } from '../posts/posts.ts'
-import { Link } from 'react-router-dom'
+import { PostMedia, PostReaction } from '../posts/posts.ts'
import { useEffect, useState } from 'react'
+import { Link } from 'react-router-dom'
+import { PostInfo } from '../posts/usePostViewModel.ts'
+import { useUserStore } from '../../user/user.ts'
interface PostItemProps {
- post: Post
+ post: PostInfo
+ reactions: PostReaction[]
+ addReaction: (emoji: string) => void
+ clearReaction: (emoji: string) => void
+ hideViewButton?: boolean
}
-export default function PostItem({ post }: PostItemProps) {
+export default function PostItem({
+ post,
+ reactions,
+ addReaction,
+ clearReaction,
+ hideViewButton = false,
+}: PostItemProps) {
const formattedDate = post.createdAt.toLocaleString('en-US', {
year: 'numeric',
month: 'short',
@@ -29,10 +41,15 @@ export default function PostItem({ post }: PostItemProps) {
return (
+ {post.possibleReactions.map((emoji) => {
+ const count = reactions.filter((r) => r.emoji === emoji).length
+ const didReact = reactions.some((r) => r.emoji == emoji && r.authorName == username)
+ const onClick = () => {
+ if (didReact) {
+ clearReaction(emoji)
+ } else {
+ addReaction(emoji)
+ }
+ }
+
+ return (
+
+ )
+ })}
+