fix(client): lint and user experience

lareii · Sep 10, 2024 · 2e14f87 · 2e14f87
1 parent c39b33b
commit 2e14f87
Show file tree

Hide file tree

Showing 4 changed files with 25 additions and 8 deletions.
diff --git a/client/app/(auth)/login/page.jsx b/client/app/(auth)/login/page.jsx
@@ -4,7 +4,7 @@ import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useState } from 'react';
 import { zodResolver } from '@hookform/resolvers/zod';
-import { set, useForm } from 'react-hook-form';
+import { useForm } from 'react-hook-form';
 import { z } from 'zod';
 import { LoaderCircle } from 'lucide-react';
 import { Button } from '@/components/ui/button';

diff --git a/client/app/app/explore/layout.jsx b/client/app/app/explore/layout.jsx
@@ -1,4 +1,4 @@
-import LayoutContent from "@/app/app/explore/layout-content";
+import LayoutContent from '@/app/app/explore/layout-content';
 
 export const metadata = {
   title: 'keşfet'

diff --git a/client/components/app/Post/List.jsx b/client/components/app/Post/List.jsx
@@ -8,6 +8,7 @@ export default function PostList({ fetchPosts }) {
   const [posts, setPosts] = useState([]);
   const [offset, setOffset] = useState(10);
   const [hasMorePost, setHasMorePost] = useState(true);
+  const [loading, setLoading] = useState(false);
   const { toast } = useToast();
 
   const handleDelete = (postId) => {
@@ -42,6 +43,7 @@ export default function PostList({ fetchPosts }) {
 
   useEffect(() => {
     const fetchInitialPosts = async () => {
+      setLoading(true);
       const response = await fetchPosts(0);
 
       if (!response) {
@@ -62,14 +64,19 @@ export default function PostList({ fetchPosts }) {
         setPosts(initialPosts);
         setHasMorePost(false);
       }
+
+      setLoading(false);
     };
 
     fetchInitialPosts();
   }, [fetchPosts, toast]);
 
   return (
     <div className='flex flex-col gap-2'>
-      {posts.length > 0 ? (
+      {loading && (
+        <LoaderCircle className='mt-1 w-4 h-4 animate-spin self-center' />
+      )}
+      {!loading && posts.length > 0 ? (
         <>
           {posts.map((post) => (
             <Post key={post.id} post={post} onDelete={handleDelete} />
@@ -81,10 +88,12 @@ export default function PostList({ fetchPosts }) {
           )}
         </>
       ) : (
-        <div className='flex flex-col items-center justify-center text-sm'>
-          buralar şimdilik sessiz.
-        </div>
+        !loading && (
+          <div className='flex flex-col items-center justify-center text-sm'>
+            buralar şimdilik sessiz.
+          </div>
+        )
       )}
     </div>
   );
-}
+}
diff --git a/client/components/app/User/List.jsx b/client/components/app/User/List.jsx
@@ -68,6 +68,14 @@ export default function UserList({ fetchUsers }) {
 
   return (
     <div className='flex flex-col gap-2'>
+      {/* {users.map((user, index) => (
+        <Card key={user.id} index={index} user={user} />
+      ))}
+      {hasMoreUser && (
+        <Button onClick={loadMoreUsers} className='w-full'>
+          daha fazla göster
+        </Button>
+      )} */}
       {users.length > 0 ? (
         <>
           {users.map((user, index) => (
@@ -80,7 +88,7 @@ export default function UserList({ fetchUsers }) {
           )}
         </>
       ) : (
-        <LoaderCircle className='mt-3 w-4 h-4 animate-spin self-center' />
+        <LoaderCircle className='mt-1 w-4 h-4 animate-spin self-center' />
       )}
     </div>
   );