Before anything else, make sure you all the necessary dependency by running

npm install

To make life simpler, I have installed concurrently so that all you have to do to start development is run:

npm run dev

Under the hood is just running the following commands for you

# new terminal (server)
cd server && npm start

# new terminal (app)
npm start

I spun up a local Apollo Server in the /server directory to work with the provided mock data using GraphQL. This gave me a realistic way to test queries and mutations while keeping everything self-contained.

I kicked things off with a simple create-react-app setup, and from there followed the suggested folder structure. After writing out the GraphQL queries and mutations, I created a context and a custom hook for managing incident data. This let me access and update the data from any component wrapped in the context provider.

I tried to break components out in a way that felt clean and reusable, within the time I had. Once everything was working — adding, editing, and deleting incidents — I moved on to styling. I went with SASS (.scss) and CSS Modules since that’s what I’ve been using more recently, and it was faster than setting up a CSS-in-JS solution.

I also had a bit of time to tackle one of the bonus items, and I thought filtering was the most useful one to add.