thowitz-work/tremor-tracker
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Added earthquake code validation to warehouse log modal

Browse Source
This commit is contained in:
Tim Howitz 2025-06-03 15:55:56 +01:00
parent 051b5e002d
commit 5ae30b4178
1 changed files with 22 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

33
src/app/warehouse/page.tsx
View File

@ -10,6 +10,12 @@ import { ExtendedArtefact } from "@appTypes/ApiTypes";
import { fetcher } from "@utils/axiosHelpers"; import { fetcher } from "@utils/axiosHelpers";
// Function to validate earthquake code format
const validateEarthquakeCode = (code: string): boolean => {
const pattern = /^E[A-Z]-[0-9]\.[0-9]-[A-Za-z]+-[0-9]{5}$/;
return pattern.test(code);
};
// Filter Component // Filter Component
function FilterInput({ function FilterInput({
value, value,
@ -33,14 +39,13 @@ function FilterInput({
> >
<IoFilter <IoFilter
className={`cursor-pointer text-neutral-500 font-bold group-hover:text-blue-600 className={`cursor-pointer text-neutral-500 font-bold group-hover:text-blue-600
${!showSelectedFilter && value && "text-blue-600"} ${!showSelectedFilter && value && "text-blue-600"}`}
`}
/> />
</div> </div>
<div <div
className={`absolute z-50 mt-2 w-48 bg-white border border-neutral-300 rounded-md shadow-lg p-2 opacity-0 group-hover:opacity-100 group-hover:visible transition-opacity duration-200 pointer-events-none group-hover:pointer-events-auto className={`absolute z-50 mt-2 w-48 bg-white border border-neutral-300 rounded-md shadow-lg p-2 opacity-0 group-hover:opacity-100 group-hover:visible transition-opacity duration-200 pointer-events-none group-hover:pointer-events-auto
${type === "date" ? "-right-1/2" : "-left-1/2"} ${type === "date" ? "-right-1/2" : "-left-1/2"}
`} `}
> >
{options ? ( {options ? (
<div className="max-h-32 overflow-y-auto"> <div className="max-h-32 overflow-y-auto">
@ -96,6 +101,10 @@ function LogModal({ onClose }: { onClose: () => void }) {
setError("All fields are required."); setError("All fields are required.");
return; return;
} }
if (!validateEarthquakeCode(earthquakeCode)) {
setError("Earthquake Code must be in format: EX-M.M-Country-##### (e.g., EC-3.9-Belgium-05467)");
return;
}
setIsSubmitting(true); setIsSubmitting(true);
try { try {
await axios.post("/api/warehouse/log", { await axios.post("/api/warehouse/log", {
@ -107,7 +116,6 @@ function LogModal({ onClose }: { onClose: () => void }) {
warehouseLocation, warehouseLocation,
}); });
// todo replace with better alert
alert(`Logged ${name} to storage: ${warehouseLocation}`); alert(`Logged ${name} to storage: ${warehouseLocation}`);
onClose(); onClose();
} catch { } catch {
@ -137,7 +145,7 @@ function LogModal({ onClose }: { onClose: () => void }) {
/> />
<input <input
type="text" type="text"
placeholder="Type (e.g., Lava, Tephra, Ash" placeholder="Type (e.g., Lava, Tephra, Ash)"
value={type} value={type}
onChange={(e) => setType(e.target.value)} onChange={(e) => setType(e.target.value)}
className="w-full p-2 border border-neutral-300 rounded-md placeholder-neutral-400 focus:ring-2 focus:ring-blue-500" className="w-full p-2 border border-neutral-300 rounded-md placeholder-neutral-400 focus:ring-2 focus:ring-blue-500"
@ -163,9 +171,8 @@ function LogModal({ onClose }: { onClose: () => void }) {
/> />
<input <input
type="text" type="text"
placeholder="Earthquake Code" placeholder="Earthquake Code (e.g., EC-3.9-Belgium-05467)"
value={earthquakeCode} value={earthquakeCode}
// todo check code is correct format
onChange={(e) => setEarthquakeCode(e.target.value)} onChange={(e) => setEarthquakeCode(e.target.value)}
className="w-full p-2 border border-neutral-300 rounded-md placeholder-neutral-400 focus:ring-2 focus:ring-blue-500" className="w-full p-2 border border-neutral-300 rounded-md placeholder-neutral-400 focus:ring-2 focus:ring-blue-500"
aria-label="Earthquake ID" aria-label="Earthquake ID"
@ -259,7 +266,6 @@ function BulkLogModal({ onClose }: { onClose: () => void }) {
warehouseLocation, warehouseLocation,
}); });
// todo replace with better alert
alert(`Logged bulk pallet to storage: ${warehouseLocation}`); alert(`Logged bulk pallet to storage: ${warehouseLocation}`);
onClose(); onClose();
} catch { } catch {
@ -362,8 +368,13 @@ function EditModal({ artefact, onClose }: { artefact: ExtendedArtefact; onClose:
setError("All fields are required."); setError("All fields are required.");
return; return;
} }
if (!validateEarthquakeCode(earthquakeCode)) {
setError("Earthquake Code must be in format: XX-M.M-Country-##### (e.g., EC-3.9-Belgium-05467)");
return;
}
setIsSubmitting(true); setIsSubmitting(true);
try { try {
// todo add api route
await new Promise((resolve) => setTimeout(resolve, 500)); // Simulated API call await new Promise((resolve) => setTimeout(resolve, 500)); // Simulated API call
alert(`Updated artefact ${name}`); alert(`Updated artefact ${name}`);
onClose(); onClose();
@ -430,7 +441,7 @@ function EditModal({ artefact, onClose }: { artefact: ExtendedArtefact; onClose:
type="checkbox" type="checkbox"
checked={isSold} checked={isSold}
onChange={(e) => setIsSold(e.target.checked)} onChange={(e) => setIsSold(e.target.checked)}
className="h-4 w-4 text-blue-600 border-neutral-300 rounded focus:ring-blue-500" className="w-4 h-4 text-blue-600 border-neutral-300 rounded focus:ring-blue-500"
aria-label="Sold Artefact" aria-label="Sold Artefact"
disabled={isSubmitting} disabled={isSubmitting}
/> />
@ -483,7 +494,7 @@ function EditModal({ artefact, onClose }: { artefact: ExtendedArtefact; onClose:
<path <path
className="opacity-75" className="opacity-75"
fill="currentColor" fill="currentColor"
d="M4 12a8 8 0 018-8V723C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"
></path> ></path>
</svg> </svg>
Saving... Saving...