mirrors/jellyfin-web
1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00
Code Activity

Unbind event listeners when unmounting

Browse source
This commit is contained in:
gnattu 2024-10-20 22:56:17 +08:00
parent bb17d58536
commit 5b687f6a7d
1 changed files with 11 additions and 22 deletions
Download patch file Download diff file Expand all files Collapse all files

33
src/apps/dashboard/routes/users/parentalcontrol.tsx
View file

@ -70,13 +70,6 @@ const UserParentalControl = () => {
const [ blockedTags, setBlockedTags ] = useState<string[]>([]); const [ blockedTags, setBlockedTags ] = useState<string[]>([]);
const libraryMenu = useMemo(async () => ((await import('../../../../scripts/libraryMenu')).default), []); const libraryMenu = useMemo(async () => ((await import('../../../../scripts/libraryMenu')).default), []);
// The following are meant to be reset on each render.
// These are to prevent multiple callbacks to be added to a single element in one render as useEffect may be executed multiple times in each render.
let allowedTagsPopupCallback: (() => void) | null = null;
let blockedTagsPopupCallback: (() => void) | null = null;
let accessSchedulesPopupCallback: (() => void) | null = null;
let formSubmissionCallback: ((e: Event) => void) | null = null;
const element = useRef<HTMLDivElement>(null); const element = useRef<HTMLDivElement>(null);
const populateRatings = useCallback((allParentalRatings: ParentalRating[]) => { const populateRatings = useCallback((allParentalRatings: ParentalRating[]) => {
@ -314,9 +307,10 @@ const UserParentalControl = () => {
}; };
// The following is still hacky and should migrate to pure react implementation for callbacks in the future // The following is still hacky and should migrate to pure react implementation for callbacks in the future
if (accessSchedulesPopupCallback) { let allowedTagsPopupCallback: (() => void) | null = null;
(page.querySelector('#btnAddSchedule') as HTMLButtonElement).removeEventListener('click', accessSchedulesPopupCallback); let blockedTagsPopupCallback: (() => void) | null = null;
} let accessSchedulesPopupCallback: (() => void) | null = null;
let formSubmissionCallback: ((e: Event) => void) | null = null;
accessSchedulesPopupCallback = function () { accessSchedulesPopupCallback = function () {
showSchedulePopup({ showSchedulePopup({
Id: 0, Id: 0,
@ -327,24 +321,19 @@ const UserParentalControl = () => {
}, -1); }, -1);
}; };
(page.querySelector('#btnAddSchedule') as HTMLButtonElement).addEventListener('click', accessSchedulesPopupCallback); (page.querySelector('#btnAddSchedule') as HTMLButtonElement).addEventListener('click', accessSchedulesPopupCallback);
if (allowedTagsPopupCallback) {
(page.querySelector('#btnAddAllowedTag') as HTMLButtonElement).removeEventListener('click', allowedTagsPopupCallback);
}
allowedTagsPopupCallback = showAllowedTagPopup; allowedTagsPopupCallback = showAllowedTagPopup;
(page.querySelector('#btnAddAllowedTag') as HTMLButtonElement).addEventListener('click', allowedTagsPopupCallback); (page.querySelector('#btnAddAllowedTag') as HTMLButtonElement).addEventListener('click', allowedTagsPopupCallback);
if (blockedTagsPopupCallback) {
(page.querySelector('#btnAddBlockedTag') as HTMLButtonElement).removeEventListener('click', blockedTagsPopupCallback);
}
blockedTagsPopupCallback = showBlockedTagPopup; blockedTagsPopupCallback = showBlockedTagPopup;
(page.querySelector('#btnAddBlockedTag') as HTMLButtonElement).addEventListener('click', blockedTagsPopupCallback); (page.querySelector('#btnAddBlockedTag') as HTMLButtonElement).addEventListener('click', blockedTagsPopupCallback);
if (formSubmissionCallback) {
(page.querySelector('.userParentalControlForm') as HTMLFormElement).removeEventListener('submit', formSubmissionCallback);
}
formSubmissionCallback = onSubmit; formSubmissionCallback = onSubmit;
(page.querySelector('.userParentalControlForm') as HTMLFormElement).addEventListener('submit', formSubmissionCallback); (page.querySelector('.userParentalControlForm') as HTMLFormElement).addEventListener('submit', formSubmissionCallback);
return () => {
(page.querySelector('#btnAddSchedule') as HTMLButtonElement).removeEventListener('click', accessSchedulesPopupCallback);
(page.querySelector('#btnAddAllowedTag') as HTMLButtonElement).removeEventListener('click', allowedTagsPopupCallback);
(page.querySelector('#btnAddBlockedTag') as HTMLButtonElement).removeEventListener('click', blockedTagsPopupCallback);
(page.querySelector('.userParentalControlForm') as HTMLFormElement).removeEventListener('submit', formSubmissionCallback);
}
}, [setAllowedTags, setBlockedTags, loadData, userId]); }, [setAllowedTags, setBlockedTags, loadData, userId]);
const optionMaxParentalRating = () => { const optionMaxParentalRating = () => {