refactor: implement components and routes lazy loading

[zintarh]

Overview

This pull request introduces lazy (dynamic) imports throughout the Next.js application to optimize loading performance and bundle size. By leveraging dynamic imports, components that are heavy or only needed on the client side are loaded only when required. This results in a faster initial load and a better user experience.

Fixes #609

Types of change

• Feature
• Bug
• Enhancement

1. Configure Contracts Page (/configure)

• The main contract configuration component is now loaded lazily via a client-side wrapper.
• The heavy logic and UI for downloading contracts are only loaded when the user visits the configure page.

2. Debug Contracts Page (/debug)

• The main contract debugging component is now loaded lazily via a client-side wrapper.
• The contract UI and its subcomponents, which are client-heavy, are dynamically imported to ensure they are only loaded when needed.

3. Component Refactors

• Some components with significant client-side logic or those not compatible with server-side rendering are now dynamically imported.

• List of Pages and Components Fixed

• /configure: The page that allows users to configure deployed contracts.

• /debug: The page for debugging deployed contracts.

Component

• ConnectModal
• AddressQRCodeModal
• ContractUI
• ContractWriteMethods

Client Wrappers

• The client wrapper components for both /configure and /debug were introduced to facilitate lazy loading.
• Dynamically Imported Components
• The main contract configuration and debugging components.
• The contract UI component and its write-methods subcomponent.

[metalboyrick]

@zintarh please change base to develop and rebase / merge if needed