jcoffey-dev
3f4b33cb51
The 143 the codemod refused turned out to be two different things, and only
one of them needed a person.
A third were phrases sitting next to an icon -- `<Plus /> New rule`. The
refusal rule was "has siblings", which is broader than the danger: what breaks
a translation is a sibling that renders *text*, splitting a sentence into
fragments no one can reorder. An element beside a phrase does not. Narrowing
the rule to text-producing siblings let the codemod take 73 more.
The rest were real sentences with values in the middle, rebuilt by hand as
named placeholders -- "Your active script “{name}” was written by hand",
"Waiting on the server — goes out {when}." Named rather than positional
because a translator moves the parts around; counted things go through
plural() so Russian and Ukrainian get their three forms rather than English's
two.
Sentences with an element inside them needed something new. `Open <code>mailto:
</code> links in ihasmail` has two obvious treatments and both are wrong:
splitting it into two t() calls hands over fragments that cannot be reordered,
and dropping the <code> keeps the sentence whole but loses the monospace that
said "this is a literal". tNode() keeps the sentence whole and makes the
element a named hole in it, so a translator sees one sentence and can put the
hole where their language wants it. The German test asserts exactly that: the
same call renders the code first when the catalogue says so.
The coverage number was also lying, and it is worth saying how. It counted
text inside <code> and inside translate="no" as untranslated work, and
placeholders like "123456" and "+1 555 0100" -- a one-time code and a phone
format. None of those will ever be translated, so the report sat at 21 with 6
real items left. A number with an unreachable floor is something to argue with
rather than act on, so the tool now applies the same rules the codemod does.
596 wrapped, nothing remaining. Verified in the browser across 15 views, which
is where the last bulk pass hid a bug the tests could not see: no entities, no
unfilled placeholders, no raw t( in rendered text, and the toggle switches that
looked like emptied labels are text-free by design.
90 lines
5.2 KiB
TypeScript
90 lines
5.2 KiB
TypeScript
import { useSettings } from "@/store/settings";
|
|
import { ColorSwatches, CALENDAR_COLORS } from "@/ui/misc";
|
|
import { promptDialog } from "@/ui/dialog";
|
|
import { Plus, Trash2 } from "lucide-react";
|
|
import { t } from "@/lib/i18n";
|
|
|
|
export function CalendarSettings() {
|
|
const s = useSettings((st) => st.settings);
|
|
const update = useSettings((st) => st.update);
|
|
return (
|
|
<div>
|
|
<h1>{t("Calendar & contacts")}</h1>
|
|
<p className="lead">{t("Defaults for the calendar views and new events.")}</p>
|
|
<div className="field-row">
|
|
<div className="field">
|
|
<label>{t("Default view")}</label>
|
|
<select className="select" value={s.calendarDefaultView} onChange={(e) => update({ calendarDefaultView: e.target.value as typeof s.calendarDefaultView })}>
|
|
<option value="day">{t("Day")}</option>
|
|
<option value="week">{t("Week")}</option>
|
|
<option value="month">{t("Month")}</option>
|
|
<option value="agenda">{t("Agenda")}</option>
|
|
</select>
|
|
</div>
|
|
<div className="field">
|
|
<label>{t("Default event length")}</label>
|
|
<select className="select" value={String(s.defaultEventDuration)} onChange={(e) => update({ defaultEventDuration: Number(e.target.value) })}>
|
|
<option value="15">{t("15 minutes")}</option>
|
|
<option value="30">{t("30 minutes")}</option>
|
|
<option value="45">{t("45 minutes")}</option>
|
|
<option value="60">{t("1 hour")}</option>
|
|
<option value="90">{t("1.5 hours")}</option>
|
|
<option value="120">{t("2 hours")}</option>
|
|
</select>
|
|
</div>
|
|
<div className="field">
|
|
<label>{t("Default reminder")}</label>
|
|
<select className="select" value={String(s.defaultAlertMinutes)} onChange={(e) => update({ defaultAlertMinutes: Number(e.target.value) })}>
|
|
<option value="-1">{t("None")}</option>
|
|
<option value="0">{t("At time of event")}</option>
|
|
<option value="5">{t("5 minutes before")}</option>
|
|
<option value="10">{t("10 minutes before")}</option>
|
|
<option value="15">{t("15 minutes before")}</option>
|
|
<option value="30">{t("30 minutes before")}</option>
|
|
<option value="60">{t("1 hour before")}</option>
|
|
<option value="1440">{t("1 day before")}</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
<h2>{t("Colour categories")}</h2>
|
|
<p className="hint">{t("Outlook-style categories you can assign to events from the right-click menu or the event editor. The category name is stored on the event, so it syncs to other clients.")}</p>
|
|
{s.eventCategories.map((c, i) => (
|
|
<div key={c.name} className="card">
|
|
<div className="card-head">
|
|
<span className="label-dot" style={{ background: c.color, width: 14, height: 14 }} />
|
|
<h3>{c.name}</h3>
|
|
<button className="icon-btn sm" title={t("Rename")} onClick={async () => { const n = await promptDialog({ title: "Rename category", defaultValue: c.name }); if (n?.trim()) update({ eventCategories: s.eventCategories.map((x, j) => (j === i ? { ...x, name: n.trim() } : x)) }); }}>✎</button>
|
|
<button className="icon-btn sm danger" aria-label={t("Delete category")} onClick={() => update({ eventCategories: s.eventCategories.filter((_, j) => j !== i) })}><Trash2 size={16} /></button>
|
|
</div>
|
|
<div style={{ marginTop: 8 }}><ColorSwatches value={c.color} onChange={(col) => update({ eventCategories: s.eventCategories.map((x, j) => (j === i ? { ...x, color: col } : x)) })} /></div>
|
|
</div>
|
|
))}
|
|
<button className="btn mb-16" onClick={async () => { const n = await promptDialog({ title: "New category", placeholder: "Name" }); if (n?.trim() && !s.eventCategories.some((c) => c.name.toLowerCase() === n.trim().toLowerCase())) update({ eventCategories: [...s.eventCategories, { name: n.trim(), color: CALENDAR_COLORS[s.eventCategories.length % CALENDAR_COLORS.length]! }] }); }}><Plus size={16} /> {t("New category")}</button>
|
|
|
|
<h2>{t("Working hours")}</h2>
|
|
<div className="field-row">
|
|
<div className="field">
|
|
<label>{t("Working hours start")}</label>
|
|
<select className="select" value={String(s.workDayStart)} onChange={(e) => update({ workDayStart: Number(e.target.value) })}>
|
|
{[...Array(24)].map((_, h) => <option key={h} value={h}>{`${h}:00`}</option>)}
|
|
</select>
|
|
</div>
|
|
<div className="field">
|
|
<label>{t("Working hours end")}</label>
|
|
<select className="select" value={String(s.workDayEnd)} onChange={(e) => update({ workDayEnd: Number(e.target.value) })}>
|
|
{[...Array(25)].map((_, h) => <option key={h} value={h}>{`${h}:00`}</option>)}
|
|
</select>
|
|
</div>
|
|
<div className="field">
|
|
<label>{t("Week starts on")}</label>
|
|
<select className="select" value={String(s.weekStart)} onChange={(e) => update({ weekStart: Number(e.target.value) as 0 | 1 | 6 })}>
|
|
<option value="1">{t("Monday")}</option>
|
|
<option value="0">{t("Sunday")}</option>
|
|
<option value="6">{t("Saturday")}</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|