Implement public resource sharing by username under /u/[username] and integrate with ShareModal

app/api/resources/route.ts

@@ -7,12 +7,45 @@ import { indexResource } from '../_utils/resourceIndexer';
 // GET /api/resources - Get the authenticated user's resources
 export async function GET(request: NextRequest) {
   try {
-    const authUser = await requireAuth(request);
     const { searchParams } = new URL(request.url);
-    const collectionId = searchParams.get('collectionId');
+    const username = searchParams.get('username');
+    const isPublicParam = searchParams.get('public') === 'true';
 
     const db = getServerFirestore();
 
+    if (username && isPublicParam) {
+      const usernameQuery = await db.collection('users')
+        .where('username', '==', username.toLowerCase())
+        .get();
+
+      if (usernameQuery.empty) {
+        return NextResponse.json(
+          { error: 'User not found' },
+          { status: 404 }
+        );
+      }
+
+      const targetUid = usernameQuery.docs[0].id;
+      const resourcesQuery = await db.collection('resources')
+        .where('user_id', '==', targetUid)
+        .where('is_public', '==', true)
+        .orderBy('created_at', 'desc')
+        .get();
+
+      const resources = resourcesQuery.docs.map((doc: any) => ({
+        id: doc.id,
+        ...doc.data()
+      }));
+
+      return NextResponse.json({
+        success: true,
+        resources
+      });
+    }
+
+    const authUser = await requireAuth(request);
+    const collectionId = searchParams.get('collectionId');
+
     let query: FirebaseFirestore.Query = db.collection('resources')
       .where('user_id', '==', authUser.uid);
 

app/components/AddResource.tsx

@@ -40,9 +40,27 @@ export function AddResource({ onSuccess }: AddResourceProps) {
   const lastEnrichedLinkRef = useRef<string>('')
   const [showShareModal, setShowShareModal] = useState(false)
   const [sharedResourceData, setSharedResourceData] = useState<{ title: string; note?: string; link: string }>({ title: '', note: '', link: '' })
+  const [username, setUsername] = useState('')
 
   useEffect(() => {
-    if (user) fetchCollections().catch(() => {})
+    if (user) {
+      fetchCollections().catch(() => {})
+
+      const loadProfile = async () => {
+        try {
+          const response = await fetch('/api/user-profile')
+          if (response.ok) {
+            const data = await response.json()
+            if (data.profile?.username) {
+              setUsername(data.profile.username)
+            }
+          }
+        } catch (e) {
+          console.warn('Failed to load profile in AddResource:', e)
+        }
+      }
+      loadProfile()
+    }
   }, [user, fetchCollections])
 
   const enrichResource = async () => {
@@ -330,6 +348,7 @@ export function AddResource({ onSuccess }: AddResourceProps) {
         resourceTitle={sharedResourceData.title}
         resourceNote={sharedResourceData.note}
         resourceLink={sharedResourceData.link}
+        username={username}
       />
     </div>
   )

app/components/ui/ShareModal.tsx

@@ -9,15 +9,18 @@ interface ShareModalProps {
   resourceTitle: string;
   resourceNote?: string;
   resourceLink: string;
+  username?: string;
 }
 
-export function ShareModal({ isOpen, onClose, resourceTitle, resourceNote, resourceLink }: ShareModalProps) {
+export function ShareModal({ isOpen, onClose, resourceTitle, resourceNote, resourceLink, username }: ShareModalProps) {
   const [copied, setCopied] = useState(false);
 
   if (!isOpen) return null;
 
-  // Use the actual resource link if available, fallback to the platform URL
-  const publicLink = resourceLink || `https://dumpit-three.vercel.app/`;
+  // Point to the user's public profile page if username is available, otherwise fallback to the resource's direct URL or the homepage
+  const publicLink = username 
+    ? `https://dumpit-three.vercel.app/u/${username.toLowerCase()}`
+    : (resourceLink || `https://dumpit-three.vercel.app/`);
   const userHandle = '@DumpItApp';
 
   const handleTwitterShare = () => {