GPT

Example Components

import { useDocument, useDocumentMutation } from '../hooks/firebase'; interface User { id: string; name: string; email: string; bio: string; } function UserProfile({ userId }: { userId: string }) { const { data: u

Prompt text

Original English text. Replace placeholders with your own details.

import { useDocument, useDocumentMutation } from '../hooks/firebase';

interface User {
 id: string;
 name: string;
 email: string;
 bio: string;
}

function UserProfile({ userId }: { userId: string }) {
 const { data: user, isLoading, error } = useDocument<User>('users', userId);
 const mutation = useDocumentMutation<User>('users');

 if (isLoading) return <div>Loading...</div>;
 if (error) return <div>Error: {error.message}</div>;
 if (!user) return <div>User not found</div>;

 const handleUpdate = async (newData: Partial<User>) => {
 try {
 await mutation.mutateAsync({
 id: userId,
 data: { ...user, ...newData }
 });
 } catch (error) {
 console.error('Failed to update user:', error);
 }
 };

 return (
 <div>
 <h1>{user.name}</h1>
 <p>{user.email}</p>
 <p>{user.bio}</p>
 <button
 onClick={() => handleUpdate({ bio: 'Updated bio' })}
 disabled={mutation.isPending}
 >
 Update Bio
 </button>
 </div>
 );
}

Source & attribution

Instructa AI Prompts · Instructa AI Prompts

Source-listed license: CC-BY-4.0. Prompt text is preserved; titles and previews may be shortened for display. Source examples are not NexGateHub test results.

View original source ↗ · Source credits & licenses

Explore more prompts →