# Refactoring Progress and To-Do List This document tracks the ongoing effort to refactor the codebase to improve its quality, maintainability, and adherence to modern best practices like the Single Responsibility Principle (SRP) and DRY (Don't Repeat Yourself). ## Progress ### 1. Separation of Data and UI Logic We have established a clear architectural pattern for separating data-fetching and state management from UI rendering logic. This makes components cleaner, easier to test, and more maintainable. - **`OrganizationPage` Refactor:** - Created `useOrganizationData` hook to handle all data fetching and Zod validation for a single organization. - Simplified the `useOrganizationPage` hook to focus exclusively on UI state and user interaction logic. - Broke down the main component into smaller, focused components like `OrganizationContent`. - **`MapView` Refactor:** - Created `useMapData` hook to centralize fetching, filtering, and Zod validation of map-related data (organizations and landmarks). - Refactored the monolithic `MapViewContext` into several smaller, more focused contexts (`MapViewportContext`, `MapInteractionContext`, etc.) for better state management. ### 2. Component Decomposition and Reusability - **`PartnershipHub` Decomposition:** The `PartnershipHub` component was broken down into smaller sub-components (`AIAnalysisTab`, `WebIntelTab`), each responsible for a single tab's content. - **`MapSidebar` Decomposition:** The `MapSidebar`'s content rendering logic was extracted into a dedicated `SidebarContent` component. - **`AddOrganizationWizard` Decomposition:** The `AddOrganizationWizard` component was refactored to delegate its rendering logic to new `WizardContent` and `WizardFooter` components, improving SRP. - **Reusable `IconButton`:** A new `IconButton` component was created to standardize the look and feel of icon-only buttons, reducing code duplication. ### 3. Added Critical Unit Tests To improve the reliability of our business logic, we have added Vitest unit tests for the following critical functions: - `calculateSymbioticConnections` in `lib/analytics.ts` - `findSimilarOrgs` in `lib/organizationUtils.ts` ## To-Do List - [x] **Refactor `AddOrganizationWizard`:** - This is a large, multi-step component that manages a lot of state. It should be broken down into smaller sub-components for each step of the wizard. - The state management for the wizard should be extracted into a dedicated `useAddOrganizationWizard` hook to simplify the main component. - [x] **Refactor `useAppContext`:** - The `useAppContext` hook was refactored to only contain navigation logic and was renamed to `useNavigation`. - [ ] **Add more unit tests:** - Identify other critical business logic in the `lib` directory and add unit tests for it. - Consider adding tests for the data transformation and filtering logic in the `useMapData` and `useOrganizationData` hooks. - [ ] **Create a reusable `FormField` component:** - The forms in the `AddOrganizationWizard` have a lot of repeated code for rendering labels, inputs, and error messages. - Create a generic `FormField` component to encapsulate this logic and reduce duplication. - [ ] **Refactor `Chatbot` component:** - The `Chatbot` component has a lot of state and logic. - Extract the state management into a `useChatbot` hook and break down the component into smaller pieces. - [ ] **Create a `Card` component with variants:** - The `Card` component is used in many places with slightly different styles. - Add variants to the `Card` component to handle these different styles and reduce the need for custom CSS. - [ ] **Refactor `OrganizationTable`:** - The `OrganizationTable` component has a lot of logic for filtering and sorting. - Extract this logic into a `useOrganizationTable` hook. - [ ] **Create a `PageHeader` component:** - The `AdminPage` and `OrganizationPage` have similar page headers. - Create a reusable `PageHeader` component to reduce duplication. - [x] **Add tests for `useOrganizationFilter` hook:** - The `useOrganizationFilter` hook contains critical filtering logic that should be tested. - [ ] **Refactor `LiveActivity` component:** - The `LiveActivity` component has some data transformation logic that could be extracted into a hook.