Decouple UI from business logic

The following component couples UI rendering directly with business logic, making it difficult to test either in isolation: [Paste code]. Extract the business logic into a dedicated service layer or custom hook, leaving the component responsible solely for rendering and event delegation. Show the refactored component and the extracted logic as separate files, and demonstrate how the logic can now be unit-tested without mounting the component.