diff --git a/src/components/HomePageFeed.tsx b/src/components/HomePageFeed.tsx
index a503c93..924dee4 100644
--- a/src/components/HomePageFeed.tsx
+++ b/src/components/HomePageFeed.tsx
@@ -1,19 +1,21 @@
-import { Avatar } from '@/ui'
+import { Avatar, Menu } from '@/ui'
import {
ChatCenteredDots,
+ DotsThreeOutlineVertical,
Gear,
+ Pencil,
RocketLaunch,
- ShareNetwork,
ThumbsUp,
+ Trash,
UserCircle,
Users,
} from 'phosphor-react'
import * as React from 'react'
import { HomePageFeedUpdateType } from 'src/pages'
import { DateTime } from 'luxon'
-import { useMutation, useQuery } from 'react-query'
+import { useMutation, useQuery, useQueryClient } from 'react-query'
import classNames from 'classnames'
-import { useEffect, useReducer, useState } from 'react'
+import { useState, useRef } from 'react'
import { signIn, useSession } from 'next-auth/client'
import { User } from 'src/pages/members'
import useFollowUser from './profile/useFollowUser'
@@ -31,33 +33,15 @@ import {
UpdateCommentsList,
FollowModal,
LikeModal,
+ useLikes,
+ EditUpdate,
+ Goal,
} from '@/components'
-import { Goal } from './goals'
import type { GoalResponse } from 'src/pages/[username]'
import { scrollToContentWithId } from 'src/utils'
-import { IconBrandDiscord } from 'tabler-icons'
-
-type LikeData = {
- count: number
- hasLiked: boolean
-}
-const initialState: LikeData = { count: 0, hasLiked: false }
-
-function reducer(state: LikeData, action: { type: string; payload?: any }) {
- switch (action.type) {
- case 'toggle':
- return {
- hasLiked: !state.hasLiked,
- count: state.hasLiked
- ? Number(state.count) - 1
- : Number(state.count) + 1,
- }
- case 'set':
- return { count: action.payload.count, hasLiked: action.payload.hasLiked }
- default:
- throw new Error()
- }
-}
+import { IconBrandDiscord, IconBug } from 'tabler-icons'
+import toast, { Toaster } from 'react-hot-toast'
+import ListModal from './modal/ListModal'
export function HomePageFeedUpdate({
update,
@@ -66,172 +50,270 @@ export function HomePageFeedUpdate({
update: HomePageFeedUpdateType
setGoalId: () => void
}) {
+ const queryClient = useQueryClient()
+ const [isInEditMode, setIsInEditMode] = useState(false)
const [isLikeModalOpen, setIsLikeModalOpen] = useState(false)
const [session] = useSession()
const [showComments, setShowComments] = useState(false)
const { postedBy, createdAt: createdAtInMillis, goal, description } = update
const createdAt = DateTime.fromMillis(createdAtInMillis)
- const { isLoading, isError, data } = useQuery(
- ['api/fauna/has-liked', update.id],
+ const toastId = useRef('')
+
+ const { mutate: deleteUpdate } = useMutation(
() => {
- return fetch(`/api/fauna/has-liked`, {
+ return fetch(`/api/fauna/goals/delete-update`, {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({
- updateId: update.id,
+ id: update.id,
}),
- }).then((res) => res.json())
+ }).then((res) => {
+ if (!res.ok) {
+ throw new Error('something went wrong!!!')
+ }
+ return res.json()
+ })
+ },
+ {
+ onSuccess: (data, variables, context) => {
+ toast.success('Deleted your update!!', {
+ id: toastId.current,
+ icon:
,
+ })
+
+ if (queryClient.getQueryState('/api/fauna/all-updates')) {
+ queryClient.setQueryData<{ updates: HomePageFeedUpdateType[] }>(
+ '/api/fauna/all-updates',
+ (oldData) => ({
+ updates: oldData.updates.filter(
+ (_update) => _update.id !== update.id
+ ),
+ })
+ )
+ }
+
+ if (queryClient.getQueryState(['/api/fauna/recent-updates', goal.id])) {
+ queryClient.setQueryData<{ response: GoalResponse }>(
+ ['/api/fauna/recent-updates', goal.id],
+ (oldData) => ({
+ response: {
+ ...oldData.response,
+ updates: {
+ data: oldData.response.updates.data.filter(
+ (_update) => _update.id !== update.id
+ ),
+ },
+ },
+ })
+ )
+ }
+ },
+ onError: () => {
+ toast.error('Something went wrong!!!', {
+ id: toastId.current,
+ })
+ },
}
)
- const { mutate } = useMutation(() => {
- return fetch(`/api/fauna/toggle-like`, {
- method: 'POST',
- headers: {
- 'Content-Type': 'application/json',
- },
- body: JSON.stringify({
+
+ const { count: likesCount, hasLiked, toggleLike } = useLikes({
+ initialCount: update.likes.data.length,
+ initialHasLiked: update.hasLiked,
+ updateId: update.id,
+ type: 'UPDATE_LIKE',
+ mutation: {
+ endpoint: '/api/fauna/toggle-update-like',
+ body: {
updateId: update.id,
- }),
- }).then((res) => {
- if (!res.ok) {
- throw new Error('something went wrong!!!')
- }
- return res.json()
- })
+ },
+ },
})
- const [{ count: likesCount, hasLiked }, dispatch] = useReducer(
- reducer,
- initialState
- )
-
- useEffect(() => {
- if (!isLoading && !isError) {
- dispatch({
- type: 'set',
- payload: { hasLiked: data.liked, count: update.likes.data },
- })
- }
- }, [data?.liked, isError, isLoading, update.likes.data])
+ const [isOpen, setIsOpen] = useState(false)
return (
-
-
-
-
-
-
-
-
- 🚀 Goal: {goal.title}
-
-
-
-
-
-
-
-
-
-
-
-
-
-
+
+
+
- {showComments && (
- <>
-
-
- {update.comments.data.map((comment, index) => (
-
- {comment.description}
-
- ))}
-
- {session && }
-
-
- )}
-
+
+
+
+
+
+
+
+
+
+
+ 🚀 Goal: {goal.title}
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
)
}
@@ -249,6 +331,7 @@ export default function HomePageFeed({
}) {
const [session, loading] = useSession()
const [goalId, setgoalId] = useState('')
+ const [isGoalPreviewOpen, setIsGoalPreviewOpen] = useState(false)
return (
@@ -296,7 +379,10 @@ export default function HomePageFeed({
setgoalId(update.goal.id)}
+ setGoalId={() => {
+ setIsGoalPreviewOpen(true)
+ setgoalId(update.goal.id)
+ }}
/>
))}
@@ -304,7 +390,11 @@ export default function HomePageFeed({