Feature Active Row

### Highlight booking row when clicked

**Instructions:**

Within the `` component or its child components, add an `onClick` handler to each row in the table (hint: on the `` element). When clicked, the row is "selected" and highlighted with a different colour. When clicked again, the row is unselected and the coloured highlighting is removed.

**Hint:** Use a new state variable for each row to record if the row is selected or not, and use this value to set a class to the `className` prop of the row.

**Test:**

- [ ] Verify that each row of your table can be highlighted (on and off) independently when being clicked.

Start in the SearchResults component and inspect its child components for the table row rendered as . Trace how each row is produced, then verify that clicking each row independently toggles its highlighted state and that clicking it again removes the highlighting. Use the issue's manual test checklist to confirm the finished behavior.

Written by the indexing model from the issue text.