90 lines
2.4 KiB
JavaScript
90 lines
2.4 KiB
JavaScript
|
import Stack from "@mui/material/Stack";
|
||
|
|
import TextField from "@mui/material/TextField";
|
||
|
|
import { useState } from "react";
|
||
|
|
import { useI18n } from "../../hooks/I18n";
|
||
|
|
import Typography from "@mui/material/Typography";
|
||
|
|
import Accordion from "@mui/material/Accordion";
|
||
|
|
import AccordionSummary from "@mui/material/AccordionSummary";
|
||
|
|
import AccordionDetails from "@mui/material/AccordionDetails";
|
||
|
|
import ExpandMoreIcon from "@mui/icons-material/ExpandMore";
|
||
|
|
import Alert from "@mui/material/Alert";
|
||
|
|
import Box from "@mui/material/Box";
|
||
|
|
import { sites as webfixSites } from "../../libs/webfix";
|
||
|
|
import FormControlLabel from "@mui/material/FormControlLabel";
|
||
|
|
import Switch from "@mui/material/Switch";
|
||
|
|
import { useSetting } from "../../hooks/Setting";
|
||
|
|
|
||
|
|
function ApiFields({ site }) {
|
||
|
|
const { selector, rootSlector } = site;
|
||
|
|
return (
|
||
|
|
<Stack spacing={3}>
|
||
|
|
<TextField
|
||
|
|
size="small"
|
||
|
|
label={"rootSlector"}
|
||
|
|
name="rootSlector"
|
||
|
|
value={rootSlector || "document"}
|
||
|
|
disabled
|
||
|
|
/>
|
||
|
|
<TextField
|
||
|
|
size="small"
|
||
|
|
label={"selector"}
|
||
|
|
name="selector"
|
||
|
|
value={selector}
|
||
|
|
disabled
|
||
|
|
/>
|
||
|
|
</Stack>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
function ApiAccordion({ site }) {
|
||
|
|
const [expanded, setExpanded] = useState(false);
|
||
|
|
|
||
|
|
const handleChange = (e) => {
|
||
|
|
setExpanded((pre) => !pre);
|
||
|
|
};
|
||
|
|
|
||
|
|
return (
|
||
|
|
<Accordion expanded={expanded} onChange={handleChange}>
|
||
|
|
<AccordionSummary expandIcon={<ExpandMoreIcon />}>
|
||
|
|
<Typography>{site.pattern}</Typography>
|
||
|
|
</AccordionSummary>
|
||
|
|
<AccordionDetails>
|
||
|
|
{expanded && <ApiFields site={site} />}
|
||
|
|
</AccordionDetails>
|
||
|
|
</Accordion>
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
export default function Webfix() {
|
||
|
|
const i18n = useI18n();
|
||
|
|
const { setting, updateSetting } = useSetting();
|
||
|
|
return (
|
||
|
|
<Box>
|
||
|
|
<Stack spacing={3}>
|
||
|
|
<Alert severity="info">{i18n("patch_setting_help")}</Alert>
|
||
|
|
|
||
|
|
<FormControlLabel
|
||
|
|
control={
|
||
|
|
<Switch
|
||
|
|
size="small"
|
||
|
|
checked={!!setting.injectWebfix}
|
||
|
|
onChange={() => {
|
||
|
|
updateSetting({
|
||
|
|
injectWebfix: !setting.injectWebfix,
|
||
|
|
});
|
||
|
|
}}
|
||
|
|
/>
|
||
|
|
}
|
||
|
|
label={i18n("inject_webfix")}
|
||
|
|
/>
|
||
|
|
|
||
|
|
<Box>
|
||
|
|
{webfixSites.map((site) => (
|
||
|
|
<ApiAccordion key={site.pattern} site={site} />
|
||
|
|
))}
|
||
|
|
</Box>
|
||
|
|
</Stack>
|
||
|
|
</Box>
|
||
|
|
);
|
||
|
|
}
|