fix client error

src/app/[locale]/(main)/community/[communityId]/page.client.tsx

@@ -6,14 +6,33 @@ import { addFollow } from '@/utils/actions/community/addFollow'
 import { removeFollow } from '@/utils/actions/community/removeFollow'
 import { account } from '@/app/appwrite-client'
 import { getIsFollowingCommunity } from '@/utils/server-api/community-followers/getIsFollowingCommunity'
+import { getUser } from '@/utils/server-api/account/user'
 
-export function FollowerButton({ displayName, communityId }) {
+export function FollowerButton({ userSelf, displayName, communityId }) {
   const { toast } = useToast()
   const [isFollowingState, setIsFollowingState] = useState(false)
-  const [userId, setUserId] = useState(null)
+
+  const getUserId = async () => {
+    try {
+      const isFollowing = await getIsFollowingCommunity(
+        userSelf?.$id,
+        communityId
+      )
+      if (isFollowing.documents.length > 0) {
+        setIsFollowingState(true)
+      }
+    } catch (error) {
+      // Do nothing
+    }
+  }
+
+  useEffect(() => {
+    getUserId().then()
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [communityId])
 
   const handleFollow = async () => {
-    const data = await addFollow(userId, communityId)
+    const data = await addFollow(userSelf?.$id, communityId)
     if (data.code === 401) {
       return toast({
         title: 'Error',
@@ -36,7 +55,7 @@ export function FollowerButton({ displayName, communityId }) {
   }
 
   const handleUnfollow = async () => {
-    const data = await removeFollow(userId, communityId)
+    const data = await removeFollow(userSelf?.$id, communityId)
     if (data.code === 401) {
       return toast({
         title: 'Error',

src/app/[locale]/(main)/community/[communityId]/page.tsx

@@ -20,6 +20,7 @@ import { Separator } from '@/components/ui/separator'
 import ContextMenuProfile from '@/components/user/contextMenuProfile'
 import { FollowerButton } from '@/app/[locale]/(main)/community/[communityId]/page.client'
 import { getCommunityFollowers } from '@/utils/server-api/community-followers/getCommunityFollowers'
+import { getUser } from '@/utils/server-api/account/user'
 
 export const runtime = 'edge'
 
@@ -51,6 +52,12 @@ export default async function Page({
 }) {
   const community = await getCommunity(communityId)
   const followers = await getCommunityFollowers(communityId)
+  let userSelf = null
+  try {
+    userSelf = await getUser()
+  } catch (error) {
+    // Do nothing
+  }
 
   return (
     <PageLayout title={community.name || 'Community'}>
@@ -114,6 +121,7 @@ export default async function Page({
                       {community.name}
                     </CardTitle>
                     <FollowerButton
+                      userSelf={userSelf}
                       displayName={community.name}
                       communityId={communityId}
                     />