Move core files into new folder

2024-10-05 16:09:34 +02:00
parent 996bb62888
commit 23a86a77f0
173 changed files with 514 additions and 481 deletions
--- a/src/modules/core/components/inputs/LangSelect.tsx
+++ b/src/modules/core/components/inputs/LangSelect.tsx
@@ -0,0 +1,122 @@
+/*
+ * Copyright (C) Contributors to the Suwayomi project
+ *
+ * This Source Code Form is subject to the terms of the Mozilla Public
+ * 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, { useState } from 'react';
+import Button from '@mui/material/Button';
+import DialogTitle from '@mui/material/DialogTitle';
+import DialogContent from '@mui/material/DialogContent';
+import DialogActions from '@mui/material/DialogActions';
+import Dialog from '@mui/material/Dialog';
+import Switch from '@mui/material/Switch';
+import IconButton from '@mui/material/IconButton';
+import FilterListIcon from '@mui/icons-material/FilterList';
+import List from '@mui/material/List';
+import ListItemText from '@mui/material/ListItemText';
+import Tooltip from '@mui/material/Tooltip';
+import ListItem from '@mui/material/ListItem';
+import { useTranslation } from 'react-i18next';
+import { cloneObject } from '@/util/cloneObject.tsx';
+import { translateExtensionLanguage } from '@/screens/util/Extensions.ts';
+
+function removeAll(firstList: any[], secondList: any[]) {
+    secondList.forEach((item) => {
+        const index = firstList.indexOf(item);
+        if (index !== -1) {
+            firstList.splice(index, 1);
+        }
+    });
+
+    return firstList;
+}
+
+interface IProps {
+    shownLangs: string[];
+    setShownLangs: (arg0: string[]) => void;
+    allLangs: string[];
+    forcedLangs?: string[];
+}
+
+export function LangSelect(props: IProps) {
+    const { t } = useTranslation();
+
+    const { shownLangs, setShownLangs, allLangs, forcedLangs = [] } = props;
+    // hold a copy and only sate state on parent when OK pressed, improves performance
+    const [mShownLangs, setMShownLangs] = useState(removeAll(cloneObject(shownLangs), forcedLangs));
+    const [open, setOpen] = useState<boolean>(false);
+
+    const handleCancel = () => {
+        setOpen(false);
+    };
+
+    const handleOk = () => {
+        setOpen(false);
+        setShownLangs(mShownLangs);
+    };
+
+    const handleChange = (event: React.ChangeEvent<HTMLInputElement>, lang: string) => {
+        const { checked } = event.target as HTMLInputElement;
+
+        if (checked) {
+            setMShownLangs([...mShownLangs, lang]);
+        } else {
+            const clone = cloneObject(mShownLangs);
+            clone.splice(clone.indexOf(lang), 1);
+            setMShownLangs(clone);
+        }
+    };
+
+    return (
+        <>
+            <Tooltip title={t('settings.title')}>
+                <IconButton
+                    onClick={() => setOpen(true)}
+                    aria-label="display more actions"
+                    edge="end"
+                    color="inherit"
+                    size="large"
+                >
+                    <FilterListIcon />
+                </IconButton>
+            </Tooltip>
+            <Dialog
+                sx={{
+                    '.MuiDialog-paper': {
+                        maxHeight: 435,
+                        width: '80%',
+                    },
+                }}
+                maxWidth="xs"
+                open={open}
+            >
+                <DialogTitle>{t('global.language.title.enabled_languages')}</DialogTitle>
+                <DialogContent dividers sx={{ padding: 0 }}>
+                    <List>
+                        {allLangs.map((lang) => (
+                            <ListItem key={lang}>
+                                <ListItemText primary={translateExtensionLanguage(lang)} />
+
+                                <Switch
+                                    checked={mShownLangs.indexOf(lang) !== -1}
+                                    onChange={(e) => handleChange(e, lang)}
+                                />
+                            </ListItem>
+                        ))}
+                    </List>
+                </DialogContent>
+                <DialogActions>
+                    <Button autoFocus onClick={handleCancel} color="primary">
+                        {t('global.button.cancel')}
+                    </Button>
+                    <Button onClick={handleOk} color="primary">
+                        {t('global.button.ok')}
+                    </Button>
+                </DialogActions>
+            </Dialog>
+        </>
+    );
+}