ChoChoX/suwayomi-material-you-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix/library title size info initial render flickering (#350)

Browse Source 
* Rename variable

* Hide size tag until tabs data was loaded

The wrong loading state (mangas) was being used to check if the size tag can be shown.
This commit is contained in:
schroda
2023-06-05 01:24:56 +02:00
committed by GitHub
parent 00e403ce09
commit 1ec6d77598
1 changed files with 4 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
src/screens/Library.tsx
View File

@@ -35,7 +35,7 @@ export default function Library() {
const { options } = useLibraryOptionsContext(); const { options } = useLibraryOptionsContext();
const [lastLibraryUpdate, setLastLibraryUpdate] = useState(Date.now()); const [lastLibraryUpdate, setLastLibraryUpdate] = useState(Date.now());
const { data: tabsData, error: tabsError, isLoading } = requestManager.useGetCategories(); const { data: tabsData, error: tabsError, isLoading: areCategoriesLoading } = requestManager.useGetCategories();
const tabs = tabsData ?? []; const tabs = tabsData ?? [];
const librarySize = useMemo(() => tabs.map((tab) => tab.size).reduce((prev, curr) => prev + curr, 0), [tabs]); const librarySize = useMemo(() => tabs.map((tab) => tab.size).reduce((prev, curr) => prev + curr, 0), [tabs]);
@@ -55,7 +55,7 @@ export default function Library() {
const navBarTitle = ( const navBarTitle = (
<TitleWithSizeTag> <TitleWithSizeTag>
{title} {title}
{mangaLoading || !options.showTabSize ? null : <TitleSizeTag label={librarySize} />} {areCategoriesLoading || !options.showTabSize ? null : <TitleSizeTag label={librarySize} />}
</TitleWithSizeTag> </TitleWithSizeTag>
); );
setTitle(navBarTitle, title); setTitle(navBarTitle, title);
@@ -70,7 +70,7 @@ export default function Library() {
setTitle(''); setTitle('');
setAction(null); setAction(null);
}; };
}, [t, librarySize, mangaLoading, options]); }, [t, librarySize, areCategoriesLoading, options]);
const handleTabChange = (newTab: number) => { const handleTabChange = (newTab: number) => {
setTabSearchParam(newTab === 0 ? undefined : newTab); setTabSearchParam(newTab === 0 ? undefined : newTab);
@@ -85,7 +85,7 @@ export default function Library() {
); );
} }
if (isLoading) { if (areCategoriesLoading) {
return <LoadingPlaceholder />; return <LoadingPlaceholder />;
} }