Improve toolbox reorder and checklist editing UX
All checks were successful
Deploy Sokko G / deploy (push) Successful in 8s

This commit is contained in:
Shinuwa 2026-08-02 22:12:33 +02:00
parent 1e4ac4259b
commit 8eb622e05d
11 changed files with 695 additions and 140 deletions

View file

@ -1,6 +1,7 @@
// Rôle : fournit l'outil liens avec ajout manuel et import texte.
import { useCallback, useState } from "react";
import { Icon } from "../../../components/Icon.jsx";
import { useDraftForm } from "../../../hooks/useDraftForm.js";
import { moveItem, useGroupedReorder } from "../../../hooks/useGroupedReorder.js";
import { TextImportModal } from "./TextImportModal.jsx";
import { parseColonImportLines } from "./textImport.js";
@ -8,8 +9,7 @@ import { parseColonImportLines } from "./textImport.js";
export function LinksModule({ toolboxId, moduleId, context, editing }) {
const data = context.normalizeLinksData(context.getModuleData(toolboxId, moduleId, { links: [] }));
const textContent = context.moduleText?.links || {};
const [title, setTitle] = useState("");
const [url, setUrl] = useState("");
const linkDraft = useDraftForm({ title: "", url: "" });
const [textImport, setTextImport] = useState("");
const [importOpen, setImportOpen] = useState(false);
const [copiedId, setCopiedId] = useState("");
@ -34,20 +34,20 @@ export function LinksModule({ toolboxId, moduleId, context, editing }) {
}
function addLink(event) {
event.preventDefault();
const cleanUrl = context.normalizeUrl(url);
if (!cleanUrl) return;
linkDraft.handleSubmit(event, (draft, { reset }) => {
const cleanUrl = context.normalizeUrl(draft.url);
if (!cleanUrl) return;
save([
...data.links,
{
id: context.uid("link"),
title: title.trim(),
url: cleanUrl
}
]);
setTitle("");
setUrl("");
save([
...data.links,
{
id: context.uid("link"),
title: draft.title.trim(),
url: cleanUrl
}
]);
reset();
});
}
function importLinks(event) {
@ -79,8 +79,8 @@ export function LinksModule({ toolboxId, moduleId, context, editing }) {
{editing && (
<div className="module-add-panel">
<form className="inline-form links-add-form" onSubmit={addLink}>
<input name="title" placeholder={textContent.titlePlaceholder || "Nom du lien"} value={title} onChange={(event) => setTitle(event.target.value)} />
<input name="url" placeholder={textContent.urlPlaceholder || "https://..."} value={url} onChange={(event) => setUrl(event.target.value)} />
<input {...linkDraft.getFieldProps("title", { placeholder: textContent.titlePlaceholder || "Nom du lien" })} />
<input {...linkDraft.getFieldProps("url", { placeholder: textContent.urlPlaceholder || "https://..." })} />
<button className="primary">{textContent.addButton || "Ajouter"}</button>
</form>
<div className="text-import-actions">