/ ├── app/ # Next.js App Router │ ├── (staking)/ # Optional: Route group for staking features │ │ ├── stake/ │ │ │ └── page.tsx # Page for staking tokens │ │ ├── unstake/ │ │ │ └── page.tsx # Page for unstaking tokens │ │ ├── rewards/ │ │ │ └── page.tsx # Page to view/claim rewards │ │ └── layout.tsx # Layout specific to the staking section │ ├── api/ # API routes (if needed for backend logic) │ │ └── (solana)/ # Solana related backend endpoints │ │ └── ... │ ├── globals.css │ ├── layout.tsx # Root layout │ └── page.tsx # Homepage ├── components/ # Reusable UI components │ ├── layout/ # General layout components (e.g., Navbar, Footer) │ │ ├── Navbar.tsx │ │ └── Footer.tsx │ ├── staking/ # UI components specific to staking │ │ ├── StakeForm.tsx │ │ ├── UnstakeModal.tsx │ │ └── StakingStats.tsx │ └── ui/ # Generic UI elements (Button, Input, Card) │ ├── Button.tsx │ └── Card.tsx ├── solana/ # Core Solana logic │ ├── utils/ # Utility functions (e.g., connection, wallet helpers, transaction signers) │ │ ├── connection.ts # Solana connection setup │ │ └── wallet.ts # Wallet adapter integration/helpers │ ├── instructions/ # Functions to create transaction instructions for your staking program │ │ ├── stakeTokens.ts │ │ └── claimRewards.ts │ ├── accounts/ # Logic for fetching and parsing on-chain account data │ │ └── stakingPool.ts │ ├── constants.ts # Solana program IDs, RPC endpoints, etc. │ └── pda.ts # Functions for deriving Program Derived Addresses (PDAs) ├── hooks/ # Custom React hooks │ ├── useSolanaWallet.ts # Hook for wallet state and actions │ ├── useStakingProgram.ts # Hook for interacting with your staking program │ └── useTokenBalance.ts # Hook for fetching token balances ├── contexts/ # React Context for global state management │ └── WalletContextProvider.tsx # Context for Solana wallet connection ├── lib/ # General utility functions, helpers, or configurations │ └── utils.ts ├── public/ # Static assets (images, fonts) ├── types/ # TypeScript type definitions │ ├── solana.ts # Types related to your staking program or Solana interactions │ └── index.ts ├── .env.local # Environment variables (RPC URL, program IDs - remember to .gitignore) ├── next.config.mjs ├── package.json ├── postcss.config.mjs ├── tailwind.config.ts └── tsconfig.json