Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 | 30x 30x 30x 1004x 1004x | import {
createContext,
ReactNode,
useCallback,
useContext,
useEffect,
useRef,
useState,
} from "react";
interface ProfileSheetContextType {
openProfileSheet: (userId: number) => void;
closeProfileSheet: () => void;
goBackProfile: () => void;
openProfileUserId: number | null;
profileHistory: number[];
openGroupChatId: number | null;
openGroupChat: (groupChatId: number) => void;
closeGroupChat: () => void;
selectedBadgeId: string | null;
openBadge: (badgeId: string) => void;
closeBadge: () => void;
}
const ProfileSheetContext = createContext<ProfileSheetContextType | null>(null);
export function ProfileSheetProvider({ children }: { children: ReactNode }) {
const [openProfileUserId, setOpenProfileUserId] = useState<number | null>(
null,
);
const [profileHistory, setProfileHistory] = useState<number[]>([]);
const [openGroupChatId, setOpenGroupChatId] = useState<number | null>(null);
const [selectedBadgeId, setSelectedBadgeId] = useState<string | null>(null);
// Ref so openProfileSheet can read the current userId without being recreated on every change
const openProfileUserIdRef = useRef(openProfileUserId);
useEffect(() => {
openProfileUserIdRef.current = openProfileUserId;
}, [openProfileUserId]);
const openProfileSheet = useCallback((userId: number) => {
const currentId = openProfileUserIdRef.current;
setProfileHistory(currentId !== null ? (h) => [...h, currentId] : []);
setOpenProfileUserId(userId);
setOpenGroupChatId(null);
setSelectedBadgeId(null);
}, []);
const goBackProfile = useCallback(() => {
setProfileHistory((prev) => {
const next = [...prev];
const previousId = next.pop();
if (previousId !== undefined) {
setOpenProfileUserId(previousId);
}
return next;
});
}, []);
const closeProfileSheet = useCallback(() => {
setOpenProfileUserId(null);
setOpenGroupChatId(null);
setSelectedBadgeId(null);
setProfileHistory([]);
}, []);
const openGroupChat = useCallback((groupChatId: number) => {
setOpenGroupChatId(groupChatId);
}, []);
const closeGroupChat = useCallback(() => {
setOpenGroupChatId(null);
}, []);
const openBadge = useCallback((badgeId: string) => {
setSelectedBadgeId(badgeId);
}, []);
const closeBadge = useCallback(() => {
setSelectedBadgeId(null);
}, []);
return (
<ProfileSheetContext.Provider
value={{
openProfileSheet,
closeProfileSheet,
goBackProfile,
openProfileUserId,
profileHistory,
openGroupChatId,
openGroupChat,
closeGroupChat,
selectedBadgeId,
openBadge,
closeBadge,
}}
>
{children}
</ProfileSheetContext.Provider>
);
}
const noopProfileSheet: ProfileSheetContextType = {
openProfileSheet: () => {},
closeProfileSheet: () => {},
goBackProfile: () => {},
openProfileUserId: null,
profileHistory: [],
openGroupChatId: null,
openGroupChat: () => {},
closeGroupChat: () => {},
selectedBadgeId: null,
openBadge: () => {},
closeBadge: () => {},
};
export function useProfileSheet() {
return useContext(ProfileSheetContext) ?? noopProfileSheet;
}
|