Mirrors/stash
1
0
Fork 0
mirror of https://github.com/stashapp/stash.git synced 2025-12-18 12:54:38 +03:00
Code Issues Packages Projects Releases Wiki Activity

Fix Scene Tagger config blacklist (#4396)

Browse Source 
* Refactoring
* Add item on Enter
* Don't add duplicate items
This commit is contained in:
DingDongSoLong4
2023-12-27 02:02:43 +02:00
committed by GitHub
parent 6ee7e6112b
commit 3e9bd8507f
1 changed files with 36 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
ui/v2.5/src/components/Tagger/scenes/Config.tsx
View File

@@ -23,28 +23,31 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
const intl = useIntl(); const intl = useIntl();
const blacklistRef = useRef<HTMLInputElement | null>(null); const blacklistRef = useRef<HTMLInputElement | null>(null);
const removeBlacklist = (index: number) => { function addBlacklistItem() {
setConfig({
...config,
blacklist: [
...config.blacklist.slice(0, index),
...config.blacklist.slice(index + 1),
],
});
};
const handleBlacklistAddition = () => {
if (!blacklistRef.current) return; if (!blacklistRef.current) return;
const input = blacklistRef.current.value; const input = blacklistRef.current.value;
if (input.length === 0) return; if (!input) return;
// don't add duplicate items
if (!config.blacklist.includes(input)) {
setConfig({
...config,
blacklist: [...config.blacklist, input],
});
}
blacklistRef.current.value = "";
}
function removeBlacklistItem(index: number) {
const newBlacklist = [...config.blacklist];
newBlacklist.splice(index, 1);
setConfig({ setConfig({
...config, ...config,
blacklist: [...config.blacklist, input], blacklist: newBlacklist,
}); });
blacklistRef.current.value = ""; }
};
return ( return (
<Collapse in={show}> <Collapse in={show}>
@@ -61,7 +64,7 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
<FormattedMessage id="component_tagger.config.show_male_label" /> <FormattedMessage id="component_tagger.config.show_male_label" />
} }
checked={config.showMales} checked={config.showMales}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange={(e) =>
setConfig({ ...config, showMales: e.currentTarget.checked }) setConfig({ ...config, showMales: e.currentTarget.checked })
} }
/> />
@@ -75,7 +78,7 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
<FormattedMessage id="component_tagger.config.set_cover_label" /> <FormattedMessage id="component_tagger.config.set_cover_label" />
} }
checked={config.setCoverImage} checked={config.setCoverImage}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange={(e) =>
setConfig({ setConfig({
...config, ...config,
setCoverImage: e.currentTarget.checked, setCoverImage: e.currentTarget.checked,
@@ -95,7 +98,7 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
} }
className="mr-4" className="mr-4"
checked={config.setTags} checked={config.setTags}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange={(e) =>
setConfig({ ...config, setTags: e.currentTarget.checked }) setConfig({ ...config, setTags: e.currentTarget.checked })
} }
/> />
@@ -104,7 +107,7 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
className="col-md-2 col-3 input-control" className="col-md-2 col-3 input-control"
as="select" as="select"
value={config.tagOperation} value={config.tagOperation}
onChange={(e: React.ChangeEvent<HTMLSelectElement>) => onChange={(e) =>
setConfig({ setConfig({
...config, ...config,
tagOperation: e.currentTarget.value as TagOperation, tagOperation: e.currentTarget.value as TagOperation,
@@ -135,7 +138,7 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
as="select" as="select"
className="col-md-2 col-3 input-control" className="col-md-2 col-3 input-control"
value={config.mode} value={config.mode}
onChange={(e: React.ChangeEvent<HTMLSelectElement>) => onChange={(e) =>
setConfig({ setConfig({
...config, ...config,
mode: e.currentTarget.value as ParseMode, mode: e.currentTarget.value as ParseMode,
@@ -182,7 +185,7 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
<FormattedMessage id="component_tagger.config.mark_organized_label" /> <FormattedMessage id="component_tagger.config.mark_organized_label" />
} }
checked={config.markSceneAsOrganizedOnSave} checked={config.markSceneAsOrganizedOnSave}
onChange={(e: React.ChangeEvent<HTMLInputElement>) => onChange={(e) =>
setConfig({ setConfig({
...config, ...config,
markSceneAsOrganizedOnSave: e.currentTarget.checked, markSceneAsOrganizedOnSave: e.currentTarget.checked,
@@ -199,9 +202,18 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
<FormattedMessage id="component_tagger.config.blacklist_label" /> <FormattedMessage id="component_tagger.config.blacklist_label" />
</h5> </h5>
<InputGroup> <InputGroup>
<Form.Control className="text-input" ref={blacklistRef} /> <Form.Control
className="text-input"
ref={blacklistRef}
onKeyPress={(e: React.KeyboardEvent<HTMLInputElement>) => {
if (e.key === "Enter") {
addBlacklistItem();
e.preventDefault();
}
}}
/>
<InputGroup.Append> <InputGroup.Append>
<Button onClick={handleBlacklistAddition}> <Button onClick={() => addBlacklistItem()}>
<FormattedMessage id="actions.add" /> <FormattedMessage id="actions.add" />
</Button> </Button>
</InputGroup.Append> </InputGroup.Append>
@@ -221,7 +233,7 @@ const Config: React.FC<IConfigProps> = ({ show }) => {
{item.toString()} {item.toString()}
<Button <Button
className="minimal ml-2" className="minimal ml-2"
onClick={() => removeBlacklist(index)} onClick={() => removeBlacklistItem(index)}
> >
<Icon icon={faTimes} /> <Icon icon={faTimes} />
</Button> </Button>