gaschz/trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-10-21 15:49:00 +02:00
Code Issues Actions 17 Packages Projects Releases Wiki Activity

fix(client/dialogs): shrink images checked when it shouldn't (closes #6930)

Browse Source
This commit is contained in:
Elian Doran 2025-09-12 13:50:06 +03:00
parent 60ea415361
commit 1b711e2c08
No known key found for this signature in database
3 changed files with 8 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/client/src/stylesheets/style.css
View File

@ -161,7 +161,8 @@ textarea,
color: var(--muted-text-color); color: var(--muted-text-color);
} }
.form-group.disabled { .form-group.disabled,
.form-checkbox.disabled {
opacity: 0.5; opacity: 0.5;
pointer-events: none; pointer-events: none;
} }

8
apps/client/src/widgets/dialogs/import.tsx
View File

@ -8,15 +8,16 @@ import FormGroup, { FormMultiGroup } from "../react/FormGroup";
import Modal from "../react/Modal"; import Modal from "../react/Modal";
import RawHtml from "../react/RawHtml"; import RawHtml from "../react/RawHtml";
import importService, { UploadFilesOptions } from "../../services/import"; import importService, { UploadFilesOptions } from "../../services/import";
import { useTriliumEvent } from "../react/hooks"; import { useTriliumEvent, useTriliumOptionBool } from "../react/hooks";
export default function ImportDialog() { export default function ImportDialog() {
const [ compressImages ] = useTriliumOptionBool("compressImages");
const [ parentNoteId, setParentNoteId ] = useState<string>(); const [ parentNoteId, setParentNoteId ] = useState<string>();
const [ noteTitle, setNoteTitle ] = useState<string>(); const [ noteTitle, setNoteTitle ] = useState<string>();
const [ files, setFiles ] = useState<FileList | null>(null); const [ files, setFiles ] = useState<FileList | null>(null);
const [ safeImport, setSafeImport ] = useState(true); const [ safeImport, setSafeImport ] = useState(true);
const [ explodeArchives, setExplodeArchives ] = useState(true); const [ explodeArchives, setExplodeArchives ] = useState(true);
const [ shrinkImages, setShrinkImages ] = useState(true); const [ shrinkImages, setShrinkImages ] = useState(compressImages);
const [ textImportedAsText, setTextImportedAsText ] = useState(true); const [ textImportedAsText, setTextImportedAsText ] = useState(true);
const [ codeImportedAsCode, setCodeImportedAsCode ] = useState(true); const [ codeImportedAsCode, setCodeImportedAsCode ] = useState(true);
const [ replaceUnderscoresWithSpaces, setReplaceUnderscoresWithSpaces ] = useState(true); const [ replaceUnderscoresWithSpaces, setReplaceUnderscoresWithSpaces ] = useState(true);
@ -69,7 +70,8 @@ export default function ImportDialog() {
/> />
<FormCheckbox <FormCheckbox
name="shrink-images" hint={t("import.shrinkImagesTooltip")} label={t("import.shrinkImages")} name="shrink-images" hint={t("import.shrinkImagesTooltip")} label={t("import.shrinkImages")}
currentValue={shrinkImages} onChange={setShrinkImages} currentValue={compressImages && shrinkImages} onChange={setShrinkImages}
disabled={!compressImages}
/> />
<FormCheckbox <FormCheckbox
name="text-imported-as-text" label={t("import.textImportedAsText")} name="text-imported-as-text" label={t("import.textImportedAsText")}

6
apps/client/src/widgets/react/FormCheckbox.tsx
View File

@ -22,7 +22,6 @@ const FormCheckbox = memo(({ name, disabled, label, currentValue, onChange, hint
const labelRef = useRef<HTMLLabelElement>(null); const labelRef = useRef<HTMLLabelElement>(null);
const id = useUniqueName(name); const id = useUniqueName(name);
// Fix: Move useEffect outside conditional
useEffect(() => { useEffect(() => {
if (!hint || !labelRef.current) return; if (!hint || !labelRef.current) return;
@ -34,22 +33,19 @@ const FormCheckbox = memo(({ name, disabled, label, currentValue, onChange, hint
return () => tooltipInstance?.dispose(); return () => tooltipInstance?.dispose();
}, [hint]); // Proper dependency }, [hint]); // Proper dependency
// Memoize style object
const labelStyle = useMemo(() => const labelStyle = useMemo(() =>
hint ? { textDecoration: "underline dotted var(--main-text-color)" } : undefined, hint ? { textDecoration: "underline dotted var(--main-text-color)" } : undefined,
[hint] [hint]
); );
// Memoize onChange handler
const handleChange = useCallback((e: Event) => { const handleChange = useCallback((e: Event) => {
onChange((e.target as HTMLInputElement).checked); onChange((e.target as HTMLInputElement).checked);
}, [onChange]); }, [onChange]);
// Memoize title attribute
const titleText = useMemo(() => hint ? escapeQuotes(hint) : undefined, [hint]); const titleText = useMemo(() => hint ? escapeQuotes(hint) : undefined, [hint]);
return ( return (
<div className="form-checkbox" style={containerStyle}> <div className={`form-checkbox ${disabled ? "disabled" : ""}`} style={containerStyle}>
<label <label
className="form-check-label tn-checkbox" className="form-check-label tn-checkbox"
style={labelStyle} style={labelStyle}