State Management

Overview

This section outlines our application's state management strategy, utilizing Redux with the Context API. We employ the action-reducer pattern central to Redux and leverage hooks for state selection and dispatching actions. Additionally, we utilize updaters for handling side effects and asynchronous operations.

Data Flow

1. Action Dispatch: An event occurs (e.g., a block number changes), prompting an action to be dispatched.

2. Reducer: The dispatched action is handled by a reducer, which updates the state based on the action's type and payload.

3. Store Update: The store's state is updated, and subscribers (React components) are notified of the change.

4. React Component Rendering: Components using custom hooks re-render based on the new state, maintaining UI consistency.

5. Side Effects: Updaters/Thunks respond to actions by performing any necessary side effects or asynchronous operations.