knee-cola/evidencija-rezija
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

(refactor) LocationEditForm: update scope wrapped in fieldset

Browse Source
This commit is contained in:
Knee Cola
2025-11-18 11:50:44 +01:00
parent 63096be133
commit 6a4c869fa3
3 changed files with 58 additions and 41 deletions
Download Patch File Download Diff File Expand all files Collapse all files

77
app/ui/LocationEditForm.tsx
View File

@@ -66,17 +66,18 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
<TrashIcon className="h-[1em] w-[1em] text-error text-2xl" />
</Link>
}
<input id="locationName" name="locationName" type="text" placeholder={t("location-name-placeholder")} className="input input-bordered w-full" defaultValue={location?.name ?? ""} />
<div id="status-error" aria-live="polite" aria-atomic="true">
{state.errors?.locationName &&
state.errors.locationName.map((error: string) => (
<p className="mt-2 text-sm text-red-500" key={error}>
{error}
</p>
))}
</div>
<textarea id="locationNotes" name="locationNotes" className="textarea textarea-bordered my-1 w-full block h-[8em]" placeholder={t("notes-placeholder")} defaultValue={location?.notes ?? ""}></textarea>
<fieldset className="fieldset mt-2 p-2">
<legend className="fieldset-legend font-semibold uppercase">{t("location-name-legend")}</legend>
<input id="locationName" name="locationName" type="text" placeholder={t("location-name-placeholder")} className="input input-bordered w-full placeholder:text-gray-600" defaultValue={location?.name ?? ""} />
<div id="status-error" aria-live="polite" aria-atomic="true">
{state.errors?.locationName &&
state.errors.locationName.map((error: string) => (
<p className="mt-2 text-sm text-red-500" key={error}>
{error}
</p>
))}
</div>
</fieldset>
<div id="status-error" aria-live="polite" aria-atomic="true">
{state.errors?.locationNotes &&
state.errors.locationNotes.map((error: string) => (
@@ -86,7 +87,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
))}
</div>
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold">{t("tenant-2d-code-legend")}</legend>
<legend className="fieldset-legend font-semibold uppercase">{t("tenant-2d-code-legend")}</legend>
<InfoBox className="p-1 mb-1">{t("tenant-2d-code-info")}</InfoBox>
@@ -156,7 +157,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold">{t("auto-utility-bill-forwarding-legend")}</legend>
<legend className="fieldset-legend font-semibold uppercase">{t("auto-utility-bill-forwarding-legend")}</legend>
<InfoBox className="p-1 mb-1">{t("auto-utility-bill-forwarding-info")}</InfoBox>
<div className="form-control">
@@ -184,7 +185,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
</fieldset>
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold">{t("auto-rent-notification-legend")}</legend>
<legend className="fieldset-legend font-semibold uppercase">{t("auto-rent-notification-legend")}</legend>
<InfoBox className="p-1 mb-1">{t("auto-rent-notification-info")}</InfoBox>
<div className="form-control">
@@ -214,7 +215,7 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
{(autoBillFwd || rentDueNotification) && (
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold">{t("tenant-email-legend")}</legend>
<legend className="fieldset-legend font-semibold uppercase">{t("tenant-email-legend")}</legend>
<input
id="tenantEmail"
name="tenantEmail"
@@ -235,24 +236,34 @@ export const LocationEditForm: FC<LocationEditFormProps> = ({ location, yearMont
</fieldset>
)}
{/* Show different options for add vs edit operations */}
{!location ? (
<div className="form-control">
<label className="label cursor-pointer">
<span className="label-text">{t("add-to-subsequent-months")}</span>
<input type="checkbox" name="addToSubsequentMonths" className="toggle toggle-primary" />
</label>
</div>
) : (
<fieldset className="fieldset mt-2 p-2">
<legend className="fieldset-legend">{t("update-scope")}</legend>
<select defaultValue="current" className="select input-bordered w-full" name="updateScope">
<option value="current">{t("update-current-month")}</option>
<option value="subsequent">{t("update-subsequent-months")}</option>
<option value="all">{t("update-all-months")}</option>
</select>
</fieldset>
)}
<fieldset className="fieldset bg-base-200 border-base-300 rounded-box w-xs border p-4 pb-2 mt-4">
<legend className="fieldset-legend font-semibold uppercase">{t("scope-legend")}</legend>
{!location ? (
<div className="form-control">
<label className="label cursor-pointer justify-start gap-3">
<input
type="checkbox"
name="addToSubsequentMonths"
className="toggle toggle-primary"
/>
<span className="label-text">{t("add-to-subsequent-months")}</span>
</label>
</div>
) : (
<>
<InfoBox className="p-1 mb-1">{t("update-scope-info")}</InfoBox>
<fieldset className="fieldset mt-2 p-2">
<legend className="fieldset-legend">{t("update-scope-legend")}</legend>
<select defaultValue="current" className="select input-bordered w-full" name="updateScope">
<option value="current">{t("update-current-month")}</option>
<option value="subsequent">{t("update-subsequent-months")}</option>
<option value="all">{t("update-all-months")}</option>
</select>
</fieldset>
</>
)}
</fieldset>
<div id="status-error" aria-live="polite" aria-atomic="true">
{