- Fix all TypeScript compilation errors (40+ fixes) - Add missing type definitions (TransactionRequest, SafeInfo) - Fix TransactionRequestStatus vs TransactionStatus confusion - Fix import paths and provider type issues - Fix test file errors and mock providers - Implement comprehensive security features - AES-GCM encryption with PBKDF2 key derivation - Input validation and sanitization - Rate limiting and nonce management - Replay attack prevention - Access control and authorization - Add comprehensive test suite - Integration tests for transaction flow - Security validation tests - Wallet management tests - Encryption and rate limiter tests - E2E tests with Playwright - Add extensive documentation - 12 numbered guides (setup, development, API, security, etc.) - Security documentation and audit reports - Code review and testing reports - Project organization documentation - Update dependencies - Update axios to latest version (security fix) - Update React types to v18 - Fix peer dependency warnings - Add development tooling - CI/CD workflows (GitHub Actions) - Pre-commit hooks (Husky) - Linting and formatting (Prettier, ESLint) - Security audit workflow - Performance benchmarking - Reorganize project structure - Move reports to docs/reports/ - Clean up root directory - Organize documentation - Add new features - Smart wallet management (Gnosis Safe, ERC4337) - Transaction execution and approval workflows - Balance management and token support - Error boundary and monitoring (Sentry) - Fix WalletConnect configuration - Handle missing projectId gracefully - Add environment variable template
102 lines
3.1 KiB
TypeScript
102 lines
3.1 KiB
TypeScript
"use client";
|
|
|
|
import "@rainbow-me/rainbowkit/styles.css";
|
|
|
|
import { CacheProvider } from "@chakra-ui/next-js";
|
|
import { ChakraProvider } from "@chakra-ui/react";
|
|
import {
|
|
connectorsForWallets,
|
|
RainbowKitProvider,
|
|
darkTheme,
|
|
} from "@rainbow-me/rainbowkit";
|
|
import {
|
|
metaMaskWallet,
|
|
walletConnectWallet,
|
|
rainbowWallet,
|
|
} from "@rainbow-me/rainbowkit/wallets";
|
|
import { configureChains, createConfig, WagmiConfig } from "wagmi";
|
|
import { mainnet, optimism, base, arbitrum } from "wagmi/chains";
|
|
import { publicProvider } from "wagmi/providers/public";
|
|
|
|
import theme from "@/style/theme";
|
|
import { SafeInjectProvider } from "@/contexts/SafeInjectContext";
|
|
import { SmartWalletProvider } from "@/contexts/SmartWalletContext";
|
|
import { TransactionProvider } from "@/contexts/TransactionContext";
|
|
import ErrorBoundary from "@/components/ErrorBoundary";
|
|
import { monitoring } from "@/utils/monitoring";
|
|
|
|
// Initialize error tracking if Sentry is available
|
|
if (typeof window !== "undefined" && process.env.NEXT_PUBLIC_SENTRY_DSN) {
|
|
try {
|
|
// Dynamic import to avoid bundling Sentry in client if not needed
|
|
import("@sentry/nextjs").then((Sentry) => {
|
|
monitoring.initErrorTracking(Sentry);
|
|
}).catch(() => {
|
|
// Sentry not available, continue without it
|
|
console.warn("Sentry not available, continuing without error tracking");
|
|
});
|
|
} catch (error) {
|
|
console.warn("Failed to initialize Sentry:", error);
|
|
}
|
|
}
|
|
|
|
const { chains, publicClient } = configureChains(
|
|
// the first chain is used by rainbowWallet to determine which chain to use
|
|
[mainnet, optimism, base, arbitrum],
|
|
[publicProvider()]
|
|
);
|
|
|
|
// WalletConnect projectId - required for WalletConnect v2
|
|
// Get one from https://cloud.walletconnect.com/
|
|
const projectId = process.env.NEXT_PUBLIC_WC_PROJECT_ID || "demo-project-id";
|
|
|
|
// Only include WalletConnect wallets if projectId is set (not demo)
|
|
const wallets = projectId && projectId !== "demo-project-id"
|
|
? [
|
|
metaMaskWallet({ projectId, chains }),
|
|
walletConnectWallet({ projectId, chains }),
|
|
rainbowWallet({ projectId, chains }),
|
|
]
|
|
: [
|
|
metaMaskWallet({ projectId: "demo-project-id", chains }),
|
|
];
|
|
|
|
const connectors = connectorsForWallets([
|
|
{
|
|
groupName: "Recommended",
|
|
wallets,
|
|
},
|
|
]);
|
|
|
|
export const wagmiConfig = createConfig({
|
|
autoConnect: false,
|
|
connectors,
|
|
publicClient,
|
|
});
|
|
|
|
export const Providers = ({ children }: { children: React.ReactNode }) => {
|
|
return (
|
|
<CacheProvider>
|
|
<ChakraProvider theme={theme}>
|
|
<WagmiConfig config={wagmiConfig}>
|
|
<RainbowKitProvider
|
|
chains={chains}
|
|
theme={darkTheme()}
|
|
modalSize={"compact"}
|
|
>
|
|
<ErrorBoundary>
|
|
<SafeInjectProvider>
|
|
<SmartWalletProvider>
|
|
<TransactionProvider>
|
|
{children}
|
|
</TransactionProvider>
|
|
</SmartWalletProvider>
|
|
</SafeInjectProvider>
|
|
</ErrorBoundary>
|
|
</RainbowKitProvider>
|
|
</WagmiConfig>
|
|
</ChakraProvider>
|
|
</CacheProvider>
|
|
);
|
|
};
|