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

Extensions cleanup (#257)

Browse Source 
* [Cleanup] Add enums and types

* Extract "default languages" from ISOLanguages

The "default languages" will also be translated depending on which language the user selected
This commit is contained in:
schroda
2023-04-21 00:27:42 +02:00
committed by GitHub
parent c81189a9ed
commit 0a56a2f6d4
8 changed files with 101 additions and 42 deletions
Download Patch File Download Diff File Expand all files Collapse all files

49
src/screens/Extensions.tsx
View File

@@ -5,7 +5,7 @@
* License, v. 2.0. If a copy of the MPL was not distributed with this
* file, You can obtain one at https://mozilla.org/MPL/2.0/. */
import React, { useContext, useEffect, useState, useMemo, useRef } from 'react';
import React, { useContext, useEffect, useMemo, useRef, useState } from 'react';
import { fromEvent } from 'file-selector';
import IconButton from '@mui/material/IconButton';
import AddIcon from '@mui/icons-material/Add';
@@ -14,28 +14,37 @@ import NavbarContext from 'components/context/NavbarContext';
import client, { useQuery } from 'util/client';
import useLocalStorage from 'util/useLocalStorage';
import LangSelect from 'components/navbar/action/LangSelect';
import { extensionDefaultLangs, langCodeToName, langSortCmp } from 'util/language';
import { extensionDefaultLangs, DefaultLanguage, langSortCmp } from 'util/language';
import { makeToaster } from 'components/util/Toast';
import LoadingPlaceholder from 'components/util/LoadingPlaceholder';
import AppbarSearch from 'components/util/AppbarSearch';
import { useQueryParam, StringParam } from 'use-query-params';
import { StringParam, useQueryParam } from 'use-query-params';
import { Virtuoso } from 'react-virtuoso';
import { Typography, useMediaQuery, useTheme } from '@mui/material';
import { IExtension } from 'typings';
import { useTranslation } from 'react-i18next';
import {
ExtensionState,
GroupedExtensions,
GroupedExtensionsResult,
isExtensionStateOrLanguage,
translateExtensionLanguage,
} from 'screens/util/Extensions';
const LANGUAGE = 0;
const EXTENSIONS = 1;
const allLangs: string[] = [];
interface GroupedExtension {
[key: string]: IExtension[];
}
function groupExtensions(extensions: IExtension[]) {
function groupExtensions(extensions: IExtension[]): GroupedExtensionsResult {
allLangs.length = 0; // empty the array
const sortedExtenions: GroupedExtension = { installed: [], 'updates pending': [], all: [] };
const sortedExtenions: GroupedExtensions = {
[ExtensionState.INSTALLED]: [],
[ExtensionState.UPDATE_PENDING]: [],
[DefaultLanguage.ALL]: [],
[DefaultLanguage.OTHER]: [],
[DefaultLanguage.LOCAL_SOURCE]: [],
};
extensions.forEach((extension) => {
if (sortedExtenions[extension.lang] === undefined) {
sortedExtenions[extension.lang] = [];
@@ -45,9 +54,9 @@ function groupExtensions(extensions: IExtension[]) {
}
if (extension.installed) {
if (extension.hasUpdate) {
sortedExtenions['updates pending'].push(extension);
sortedExtenions[ExtensionState.UPDATE_PENDING].push(extension);
} else {
sortedExtenions.installed.push(extension);
sortedExtenions[ExtensionState.INSTALLED].push(extension);
}
} else {
sortedExtenions[extension.lang].push(extension);
@@ -55,15 +64,17 @@ function groupExtensions(extensions: IExtension[]) {
});
allLangs.sort(langSortCmp);
const result: [string, IExtension[]][] = [
['updates pending', sortedExtenions['updates pending']],
['installed', sortedExtenions.installed],
['all', sortedExtenions.all],
const result: GroupedExtensionsResult<ExtensionState | DefaultLanguage | string> = [
[ExtensionState.UPDATE_PENDING, sortedExtenions[ExtensionState.UPDATE_PENDING]],
[ExtensionState.INSTALLED, sortedExtenions[ExtensionState.INSTALLED]],
[DefaultLanguage.ALL, sortedExtenions[DefaultLanguage.ALL]],
[DefaultLanguage.OTHER, sortedExtenions[DefaultLanguage.OTHER]],
[DefaultLanguage.LOCAL_SOURCE, sortedExtenions[DefaultLanguage.LOCAL_SOURCE]],
];
const langExt: [string, IExtension[]][] = allLangs.map((lang) => [lang, sortedExtenions[lang]]);
const langExt: GroupedExtensionsResult = allLangs.map((lang) => [lang, sortedExtenions[lang]]);
return result.concat(langExt);
return (result as GroupedExtensionsResult).concat(langExt);
}
export default function MangaExtensions() {
@@ -106,7 +117,7 @@ export default function MangaExtensions() {
() =>
groupExtensions(filteredExtensions)
.filter((group) => group[EXTENSIONS].length > 0)
.filter((group) => ['installed', 'updates pending', 'all', ...shownLangs].includes(group[LANGUAGE])),
.filter((group) => isExtensionStateOrLanguage(group[LANGUAGE]) || shownLangs.includes(group[LANGUAGE])),
[shownLangs, filteredExtensions],
);
@@ -196,7 +207,7 @@ export default function MangaExtensions() {
fontWeight: 'bold',
}}
>
{langCodeToName(item)}
{translateExtensionLanguage(item)}
</Typography>
);
}