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

Do not use and mutate global array

Browse Source
This commit is contained in:
schroda
2023-06-23 00:05:33 +02:00
parent 5c0dcf1f6c
commit 67b4bbbdcf
1 changed files with 28 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
src/screens/Extensions.tsx
View File

@@ -35,10 +35,11 @@ import ExtensionCard from '@/components/ExtensionCard';
const LANGUAGE = 0; const LANGUAGE = 0;
const EXTENSIONS = 1; const EXTENSIONS = 1;
const allLangs: string[] = []; function getExtensionsInfo(extensions: IExtension[]): {
allLangs: string[];
function getExtensionsInfo(extensions: IExtension[]): GroupedExtensionsResult { groupedExtensions: GroupedExtensionsResult;
allLangs.length = 0; // empty the array } {
const allLangs: string[] = [];
const sortedExtensions: GroupedExtensions = { const sortedExtensions: GroupedExtensions = {
[ExtensionState.OBSOLETE]: [], [ExtensionState.OBSOLETE]: [],
[ExtensionState.INSTALLED]: [], [ExtensionState.INSTALLED]: [],
@@ -82,7 +83,10 @@ function getExtensionsInfo(extensions: IExtension[]): GroupedExtensionsResult {
const langExt: GroupedExtensionsResult = allLangs.map((lang) => [lang, sortedExtensions[lang]]); const langExt: GroupedExtensionsResult = allLangs.map((lang) => [lang, sortedExtensions[lang]]);
return (result as GroupedExtensionsResult).concat(langExt); return {
allLangs,
groupedExtensions: (result as GroupedExtensionsResult).concat(langExt),
};
} }
export default function MangaExtensions() { export default function MangaExtensions() {
@@ -96,19 +100,6 @@ export default function MangaExtensions() {
const isMobile = useMediaQuery(theme.breakpoints.down('sm')); const isMobile = useMediaQuery(theme.breakpoints.down('sm'));
const [query] = useQueryParam('query', StringParam); const [query] = useQueryParam('query', StringParam);
useEffect(() => {
setTitle(t('extension.title'));
setAction(
<>
<AppbarSearch />
<IconButton onClick={() => inputRef.current?.click()} size="large">
<AddIcon />
</IconButton>
<LangSelect shownLangs={shownLangs} setShownLangs={setShownLangs} allLangs={allLangs} />
</>,
);
}, [t, shownLangs]);
const { data: allExtensions, mutate, isLoading } = requestManager.useGetExtensionList(); const { data: allExtensions, mutate, isLoading } = requestManager.useGetExtensionList();
const filteredExtensions = useMemo( const filteredExtensions = useMemo(
@@ -121,15 +112,17 @@ export default function MangaExtensions() {
[allExtensions, showNsfw, query], [allExtensions, showNsfw, query],
); );
const groupedExtensions = useMemo( const { allLangs, groupedExtensions } = useMemo(() => getExtensionsInfo(filteredExtensions), [filteredExtensions]);
const filteredGroupedExtensions = useMemo(
() => () =>
getExtensionsInfo(filteredExtensions) groupedExtensions
.filter((group) => group[EXTENSIONS].length > 0) .filter((group) => group[EXTENSIONS].length > 0)
.filter((group) => isExtensionStateOrLanguage(group[LANGUAGE]) || shownLangs.includes(group[LANGUAGE])), .filter((group) => isExtensionStateOrLanguage(group[LANGUAGE]) || shownLangs.includes(group[LANGUAGE])),
[shownLangs, filteredExtensions], [shownLangs, groupedExtensions],
); );
const flatRenderItems: (IExtension | string)[] = groupedExtensions.flat(2); const flatRenderItems: (IExtension | string)[] = filteredGroupedExtensions.flat(2);
const [toasts, makeToast] = makeToaster(useState<React.ReactElement[]>([])); const [toasts, makeToast] = makeToaster(useState<React.ReactElement[]>([]));
@@ -152,6 +145,19 @@ export default function MangaExtensions() {
} }
}; };
useEffect(() => {
setTitle(t('extension.title'));
setAction(
<>
<AppbarSearch />
<IconButton onClick={() => inputRef.current?.click()} size="large">
<AddIcon />
</IconButton>
<LangSelect shownLangs={shownLangs} setShownLangs={setShownLangs} allLangs={allLangs} />
</>,
);
}, [t, shownLangs]);
useEffect(() => { useEffect(() => {
const dropHandler = async (e: Event) => { const dropHandler = async (e: Event) => {
e.preventDefault(); e.preventDefault();