feat: verschieben, Ordner, Adressvorlagen, API-Seite mit Export
VERSCHIEBEN. Dateien in einen anderen Ordner legen -- mit einer Warnung, die
OBEN steht und nicht im Kleingedruckten: der Pfad IST die oeffentliche Adresse,
nach dem Verschieben fuehrt die alte URL ins Leere. Das ist kein Fehler,
sondern der Preis vorhersagbarer Adressen; man muss es nur vorher wissen.
Der Umzug ist ein `rename` und kein Kopieren-dann-Loeschen: auf derselben
Platte ist das unteilbar. Die Vorschau zieht mit, sonst zeigte die Galerie am
neuen Ort nichts und am alten das Bild einer Datei, die dort nicht mehr liegt.
Eine belegte Zieladresse wird NICHT still ueberschrieben -- da verschwaende
sonst eine fremde Datei, und der Verlauf zeigte nur einen Umzug.
Der Verlauf kennt dafuer eine neue Spalte `von` und eine neue Art `move`; ohne
sie stuende dort nur das Ziel und die Frage "wo war die vorher" waere nicht
mehr zu beantworten.
ORDNER anlegen und entfernen. Leere Ordner gibt es sonst nicht -- sie sind der
Teil eines Pfades vor dem letzten Schraegstrich, mehr nicht. Jetzt sind sie ein
echtes Verzeichnis, und /folders liest Tabelle und Platte zusammen. Ein Ordner
MIT Inhalt wird nicht mitgeloescht: das waere ein Knopf, der hunderte Dateien
wegraeumt, ohne sie zu zeigen.
ADRESSVORLAGEN. Der Bauplan einer oeffentlichen Adresse, benannt und
gespeichert (vehicles/{model}.webp). Sie werden auf der Startseite und der
API-Seite mit ausgefuellter Adresse gezeigt. Ohne Platzhalter oder mit ".." im
Muster wird abgelehnt -- beides nachgemessen.
API-SEITE. Anleitung fuer die eigenen Skripte, und der Punkt daran: die
Beispiele stehen MIT DER ECHTEN ADRESSE drin statt mit example.com. Wer
abschreibt, schreibt keinen Tippfehler ab. Dazu Export in drei Formen -- JSON,
CSV (Semikolon und CRLF, sonst steht in Excel alles in einer Spalte) und eine
fertige Lua-Tabelle Name -> Adresse, die man in eine Resource legt.
DREI FEHLER BEIM MESSEN GEFUNDEN:
- rm mit recursive:false wirft bei einem Verzeichnis EISDIR und sagt damit
etwas ganz anderes, als der Fall ist. rmdir scheitert von selbst, wenn der
Ordner nicht leer ist -- genau das gewuenschte Verhalten.
- In der Lua-Ausgabe war "\'" gemeint und "\'" geschrieben: in JavaScript ist
das schlicht ein Apostroph, der Backslash faellt weg. Ein Modellname mit
Apostroph haette die erzeugte Datei zerlegt.
- Der Export mit Ordnerfilter antwortete mit einem NACKTEN 500 (kaputtes
ESCAPE in der SQL-Zeile). Ausgerechnet das.
Deshalb hat der Dienst jetzt eine AUFFANGLINIE: app.onError gibt einen Text
statt "Internal Server Error". Wir haben das bisher an den bekannten Stellen
einzeln abgefangen -- und prompt hat ein Tippfehler die Luecke gefunden. Eine
Stelle schliesst sie fuer alles, woran heute niemand denkt.
Dazu: die Verlaufstabelle hat feste Spaltenbreiten (colgroup) und ueberall
dieselben Abstaende -- vorher hatten Kopf und Koerper verschiedene, und der
Pfad wurde abgeschnitten, obwohl daneben Platz frei war. Und die Anmeldeseite
hat zwei weiche Lichter statt einer leeren Flaeche.
Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
This commit is contained in:
Claude Opus 5
@@ -0,0 +1,117 @@
|
||||
import { useEffect, useState } from 'react'
|
||||
import { Link2, Plus, Trash2 } from 'lucide-react'
|
||||
import { api, type Vorlage } from '../api'
|
||||
import { run, useStore } from '../store'
|
||||
import { Feld, Karte, Knopf } from './Bausteine'
|
||||
|
||||
/** Adressvorlagen verwalten.
|
||||
*
|
||||
* Eine Vorlage ist der Bauplan einer öffentlichen Adresse:
|
||||
* `vehicles/{model}.webp` wird zu `https://…/f/vehicles/adder.webp`.
|
||||
*
|
||||
* Wozu speichern? Weil genau diese Zeichenkette auf der anderen Seite
|
||||
* gebraucht wird — im Handy, im Skript, im Fotostudio — und weil sie sich
|
||||
* sonst jemand aus Ordnername plus Endung zusammenreimt. Einmal falsch
|
||||
* zusammengereimt heißt: das Bild fehlt, und gesucht wird an der falschen
|
||||
* Stelle. */
|
||||
export function VorlagenKarte({ publicUrl, filePrefix }: { publicUrl: string; filePrefix: string }) {
|
||||
const note = useStore((s) => s.note)
|
||||
const [liste, setListe] = useState<Vorlage[] | null>(null)
|
||||
const [speichert, setSpeichert] = useState(false)
|
||||
const [name, setName] = useState('')
|
||||
const [muster, setMuster] = useState('')
|
||||
|
||||
useEffect(() => {
|
||||
api.einstellungen()
|
||||
.then((e) => setListe(e.vorlagen))
|
||||
.catch((err) => note('fehler', err instanceof Error ? err.message : 'Unbekannt'))
|
||||
}, [note])
|
||||
|
||||
async function sichern(neu: Vorlage[]) {
|
||||
setSpeichert(true)
|
||||
const r = await run(() => api.vorlagenSpeichern(neu), 'Vorlagen gespeichert.')
|
||||
setSpeichert(false)
|
||||
if (r) setListe(r.vorlagen)
|
||||
return Boolean(r)
|
||||
}
|
||||
|
||||
if (!liste) return null
|
||||
|
||||
return (
|
||||
<Karte titel="Adressvorlagen">
|
||||
<div className="flex flex-col gap-3">
|
||||
{liste.length === 0 ? (
|
||||
<p className="text-sm text-schrift-leise">
|
||||
Noch keine. Eine Vorlage sagt, wie die öffentliche Adresse aussieht —
|
||||
etwa <code className="font-mono">vehicles/{model}.webp</code>.
|
||||
</p>
|
||||
) : (
|
||||
<ul className="flex flex-col gap-2">
|
||||
{liste.map((v, i) => (
|
||||
<li
|
||||
key={i}
|
||||
className="flex items-center gap-2 rounded-md border border-rand bg-grund px-3 py-2"
|
||||
>
|
||||
<Link2 size={14} className="shrink-0 text-schrift-leise" />
|
||||
<span className="w-32 shrink-0 truncate text-sm">{v.name}</span>
|
||||
<code className="min-w-0 flex-1 truncate font-mono text-xs text-schrift-leise">
|
||||
{publicUrl}
|
||||
{filePrefix}/{v.muster}
|
||||
</code>
|
||||
<button
|
||||
onClick={() =>
|
||||
void sichern(liste.filter((_, j) => j !== i))
|
||||
}
|
||||
className="shrink-0 rounded border border-rand px-2 py-1 text-schrift-leise hover:bg-schlecht/15 hover:text-schlecht"
|
||||
aria-label={`${v.name} entfernen`}
|
||||
>
|
||||
<Trash2 size={13} />
|
||||
</button>
|
||||
</li>
|
||||
))}
|
||||
</ul>
|
||||
)}
|
||||
|
||||
<div className="flex flex-wrap items-end gap-2 border-t border-rand pt-3">
|
||||
<Feld
|
||||
label="Name"
|
||||
value={name}
|
||||
placeholder="Fahrzeuge"
|
||||
className="w-40"
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
/>
|
||||
<Feld
|
||||
label="Muster"
|
||||
value={muster}
|
||||
placeholder="vehicles/{model}.webp"
|
||||
hinweis="Ein Platzhalter in geschweiften Klammern ist Pflicht."
|
||||
className="min-w-56 flex-1"
|
||||
onChange={(e) => setMuster(e.target.value)}
|
||||
/>
|
||||
<Knopf
|
||||
art="haupt"
|
||||
wartet={speichert}
|
||||
disabled={!name.trim() || !muster.trim()}
|
||||
onClick={async () => {
|
||||
if (
|
||||
await sichern([
|
||||
...liste,
|
||||
{ name: name.trim(), muster: muster.trim() },
|
||||
])
|
||||
) {
|
||||
setName('')
|
||||
setMuster('')
|
||||
}
|
||||
}}
|
||||
kind={
|
||||
<>
|
||||
<Plus size={15} />
|
||||
Hinzufügen
|
||||
</>
|
||||
}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</Karte>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user