From 4a1b8061829b61c1d300bcb50ab12a5c74b81eb6 Mon Sep 17 00:00:00 2001
From: Stevan Freeborn <65925598+StevanFreeborn@users.noreply.github.com>
Date: Mon, 11 Sep 2023 16:18:01 -0500
Subject: [PATCH] feat: add placeholder content to post page for user profile

---
 src/components/Post.tsx      |  1 +
 src/components/UserPosts.tsx | 19 +++++++++++++++++++
 2 files changed, 20 insertions(+)

diff --git a/src/components/Post.tsx b/src/components/Post.tsx
index b4f1bd3..d067f7a 100644
--- a/src/components/Post.tsx
+++ b/src/components/Post.tsx
@@ -42,6 +42,7 @@ export default function Post({ post }: { post: PostWithUserDto }) {
         </div>
         <div></div>
       </div>
+      <div></div>
     </div>
   );
 }
diff --git a/src/components/UserPosts.tsx b/src/components/UserPosts.tsx
index 9ee43c9..d3eff33 100644
--- a/src/components/UserPosts.tsx
+++ b/src/components/UserPosts.tsx
@@ -2,6 +2,7 @@
 
 import { UserDto } from '@/app/types';
 import { usePaginatedQuery } from 'convex/react';
+import Link from 'next/link';
 import { api } from '../../convex/_generated/api';
 import Post from './Post';
 import SpinningLoader from './SpinningLoader';
@@ -18,6 +19,24 @@ export default function UserPosts({ user }: { user: UserDto }) {
 
   const postsWithUser = pager.results.map(post => ({ ...post, user }));
 
+  if (postsWithUser.length == 0) {
+    return (
+      <div className='flex flex-col items-center justify-center border-t border-gray-600 w-full h-full'>
+        <div className='flex flex-col items-center gap-2'>
+          <h2 className='text-xl font-semibold'>
+            Hmm...it doesn&apos;t look like you&apos;ve posted anything.
+          </h2>
+          <Link
+            href='/posts/add'
+            className='inline-flex max-w-max items-center justify-center px-3 py-1 bg-primary-accent rounded-md text-white'
+          >
+            Make a post
+          </Link>
+        </div>
+      </div>
+    );
+  }
+
   return (
     <div className='flex flex-col items-center w-full h-full'>
       {postsWithUser.map(post => (