feat: User profile update [⭐4xp]

Allow users to change display names and add personal information.

Create a form modal for updating the profile
Implement form using react-hook-form and zod
Update data to firestore

Resources

Sample form modal layout

Lines 66 to 72 in 18623b4

    
           <Modal 
        
             show={openForm} 
        
             handleClose={() => setOpenForm(false)} 
        
             title="Create a Channel" 
        
           > 
        
             <ChannelForm onSuccess={() => setOpenForm(false)} /> 
        
           </Modal>

Sample form implementation in features/Channels/ChannelForm.tsx

Updating to firestore

convoz-chat/src/features/Channels/utils.ts

Lines 37 to 42 in 18623b4

    
           export const editChannel = async (channel: Channel) => { 
        
             const newChannel = validateChannel(channel); 
        
             const docRef = doc(channelsRef, newChannel.id); 
        
             await updateDoc(docRef, newChannel); 
        
           };

	<Modal
	show={openForm}
	handleClose={() => setOpenForm(false)}
	title="Create a Channel"
	>
	<ChannelForm onSuccess={() => setOpenForm(false)} />
	</Modal>

	export const editChannel = async (channel: Channel) => {
	const newChannel = validateChannel(channel);

	const docRef = doc(channelsRef, newChannel.id);
	await updateDoc(docRef, newChannel);
	};