ai-generated junk tool for migrating atproto identities in-browser
diddyfo.id
[migration] create initial process pages, add pds selection and new account creation (non-functional) to migration process
1import { createContext, useContext, useState, ReactNode, useEffect } from 'react';
2
3interface AvatarContextType {
4 avatarUrl: string;
5 setAvatarUrl: (url: string) => void;
6}
7
8const AvatarContext = createContext<AvatarContextType | undefined>(undefined);
9
10export function AvatarProvider({ children }: { children: ReactNode }) {
11 const [avatarUrl, setAvatarUrl] = useState<string>('');
12
13 useEffect(() => {
14 const handleClearAvatar = () => {
15 setAvatarUrl('');
16 };
17
18 const contextElement = document.querySelector('[data-avatar-context]');
19 if (contextElement) {
20 contextElement.addEventListener('clearAvatar', handleClearAvatar);
21 return () => {
22 contextElement.removeEventListener('clearAvatar', handleClearAvatar);
23 };
24 }
25 }, []);
26
27 return (
28 <div data-avatar-context>
29 <AvatarContext.Provider value={{ avatarUrl, setAvatarUrl }}>
30 {children}
31 </AvatarContext.Provider>
32 </div>
33 );
34}
35
36export function useAvatar() {
37 const context = useContext(AvatarContext);
38 if (context === undefined) {
39 throw new Error('useAvatar must be used within an AvatarProvider');
40 }
41 return context;
42}