Mirrors/notesnook
1
0
Fork 0
mirror of https://github.com/streetwriters/notesnook.git synced 2025-12-23 06:59:31 +01:00
Code Issues Packages Projects Releases Wiki Activity

web: improve item flash animation when revealing item in list

Browse Source 
this also fixes a potential memory leak due to event listener not unsubscribing
This commit is contained in:
Abdullah Atta
2025-03-27 13:48:25 +05:00
parent f0fd20051e
commit 174bb9a935
2 changed files with 5 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
apps/web/src/app.css
View File

@@ -206,7 +206,7 @@ textarea,
} }
.flash { .flash {
animation: flash 0.5s; animation: flash 1s;
} }
@keyframes flash { @keyframes flash {

7
apps/web/src/components/list-container/index.tsx
View File

@@ -112,7 +112,7 @@ function ListContainer(props: ListContainerProps) {
let flashStartTimeout: NodeJS.Timeout; let flashStartTimeout: NodeJS.Timeout;
let flashEndTimeout: NodeJS.Timeout; let flashEndTimeout: NodeJS.Timeout;
AppEventManager.subscribe( const event = AppEventManager.subscribe(
AppEvents.revealItemInList, AppEvents.revealItemInList,
async (id?: string) => { async (id?: string) => {
if (!id || !listRef.current) return; if (!id || !listRef.current) return;
@@ -133,16 +133,17 @@ function ListContainer(props: ListContainerProps) {
noteItem.classList.add("flash"); noteItem.classList.add("flash");
flashEndTimeout = setTimeout(() => { flashEndTimeout = setTimeout(() => {
noteItem.classList.remove("flash"); noteItem.classList.remove("flash");
}, 1000); }, 2000);
}, 500); }, 500);
} }
); );
return () => { return () => {
event.unsubscribe();
clearTimeout(flashStartTimeout); clearTimeout(flashStartTimeout);
clearTimeout(flashEndTimeout); clearTimeout(flashEndTimeout);
}; };
}, []); }, [items]);
useEffect(() => { useEffect(() => {
return () => { return () => {