54 lines
1.8 KiB
TypeScript
54 lines
1.8 KiB
TypeScript
import { AlertColor, Container, Typography } from '@mui/material';
|
|
import { v4 as uuidv4 } from 'uuid';
|
|
import { EditableEntityList, ActionOutcome } from '../components/EditableEntityList';
|
|
import { useDatabase } from '../context/DBProvider';
|
|
import { useAreas } from '../hooks/dataHooks';
|
|
|
|
const ManageAreasScreen = () => {
|
|
const db = useDatabase();
|
|
const areas = useAreas();
|
|
|
|
const addArea = async (name: string): Promise<ActionOutcome> => {
|
|
await db.areas.add({ id: uuidv4(), name, created_at: Date.now(), updated_at: Date.now() });
|
|
return { text: 'Area added.', severity: 'success' };
|
|
};
|
|
|
|
const saveArea = async (areaId: string, updatedName: string): Promise<ActionOutcome> => {
|
|
await db.areas.update(areaId, { name: updatedName, updated_at: Date.now() });
|
|
return { text: 'Area updated.', severity: 'success' };
|
|
};
|
|
|
|
const deleteArea = async (areaId: string): Promise<ActionOutcome> => {
|
|
const usageCount = await db.pickLists.where('area_id').equals(areaId).count();
|
|
if (usageCount > 0) {
|
|
return {
|
|
text: `Cannot delete this area while ${usageCount} pick list(s) use it. Remove those lists first.`,
|
|
severity: 'error' satisfies AlertColor,
|
|
success: false,
|
|
};
|
|
}
|
|
|
|
await db.areas.delete(areaId);
|
|
return { text: 'Area deleted.', severity: 'success' };
|
|
};
|
|
|
|
return (
|
|
<Container sx={{ py: 4 }}>
|
|
<Typography variant="h5" gutterBottom>
|
|
Manage Areas
|
|
</Typography>
|
|
<EditableEntityList
|
|
nameLabel="Area name"
|
|
addButtonLabel="Add"
|
|
entityLabel="Area"
|
|
entities={areas.map((area) => ({ id: area.id, name: area.name }))}
|
|
onAdd={addArea}
|
|
onUpdate={saveArea}
|
|
onDelete={(areaId) => deleteArea(areaId)}
|
|
/>
|
|
</Container>
|
|
);
|
|
};
|
|
|
|
export default ManageAreasScreen;
|