פירוק קוד מונוליטי לשירותים קטנים (Refactoring)

I have a massive React/Next.js "God File" that contains everything.
Your mission is to refactor it into a clean, modular folder structure.

REFACTORING RULES:
1. Extract all business logic/external API calls into a 'services/' directory.
2. Extract all reusable Typescript interfaces into 'types/index.ts'.
3. Break the UI into several small, specialized components (under 150 lines each).
4. Use Absolute Imports (e.g. '@/components/...') instead of relative paths.

Show only the final file structure and the code for the 3 most important extracted files.