nyne/nysoure
1
0
Fork 0
mirror of https://github.com/wgh136/nysoure.git synced 2025-09-27 20:27:23 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add customizable tag separator option in tag input

Browse Source
This commit is contained in:
nyne
2025-05-31 16:33:30 +08:00
parent 03876d106a
commit f5c14917f9
2 changed files with 22 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

21
frontend/src/components/tag_input.tsx
View File

@@ -156,12 +156,14 @@ export function QuickAddTagDialog({ onAdded }: { onAdded: (tags: Tag[]) => void
const [error, setError] = useState<string | null>(null)
const [separator, setSeparator] = useState<string>(",")
const handleSubmit = async () => {
if (text.trim().length === 0) {
return
}
setError(null)
const names = text.split(",").filter((n) => n.length > 0)
const names = text.split(separator).filter((n) => n.length > 0)
const res = await network.getOrCreateTags(names, type)
if (!res.success) {
setError(res.message)
@@ -184,12 +186,27 @@ export function QuickAddTagDialog({ onAdded }: { onAdded: (tags: Tag[]) => void
<div className="modal-box">
<h3 className="font-bold text-lg">{t('Add Tags')}</h3>
<p className="py-2 text-sm">
{t("Input tags separated by commas.")}
{t("Input tags separated by separator.")}
<br/>
{t("If the tag does not exist, it will be created automatically.")}
<br/>
{t("Optionally, you can specify a type for the new tags.")}
</p>
<p className={"flex my-2"}>
<span className={"flex-1"}>{t("Separator")}:</span>
<label className="label text-sm mx-2">
<input type="radio" name="radio-1" className="radio radio-primary" checked={separator == ","} onChange={() => setSeparator(",")}/>
Comma
</label>
<label className="label text-sm mx-2">
<input type="radio" name="radio-2" className="radio radio-primary" checked={separator == ";"} onChange={() => setSeparator(";")}/>
Semicolon
</label>
<label className="label text-sm mx-2">
<input type="radio" name="radio-3" className="radio radio-primary" checked={separator == " "} onChange={() => setSeparator(" ")}/>
Space
</label>
</p>
<TextArea value={text} onChange={(e) => setText(e.target.value)} label={"Tags"}/>
<Input value={type} onChange={(e) => setType(e.target.value)} label={"Type"}/>
{error && <ErrorAlert className={"mt-2"} message={error}/>}