Migrate to OP Sepolia testnet

app/package.json

@@ -15,7 +15,7 @@
     "@radix-ui/react-accordion": "^1.1.2",
     "@radix-ui/react-alert-dialog": "^1.0.4",
     "@radix-ui/react-collapsible": "^1.0.3",
-    "@radix-ui/react-dialog": "^1.0.4",
+    "@radix-ui/react-dialog": "1.0.4",
     "@radix-ui/react-dropdown-menu": "^2.0.5",
     "@radix-ui/react-label": "^2.0.2",
     "@radix-ui/react-scroll-area": "^1.0.4",
@@ -39,8 +39,8 @@
     "server-only": "^0.0.1",
     "tailwind-merge": "^1.12.0",
     "tailwindcss-animate": "^1.0.5",
-    "viem": "~0.3.24",
-    "wagmi": "^1.4.12",
+    "viem": "~1.21.4",
+    "wagmi": "^1.4.13",
     "zod": "^3.22.1"
   },
   "devDependencies": {

app/src/components/bet-card.tsx

@@ -93,7 +93,7 @@ export default function BetCard({
                     <div className="flex items-center">
                       <p>{`${formatEther(
                         prediction.amount ?? BigInt(0),
-                      )} MATIC`}</p>
+                      )} ETH`}</p>
                     </div>
                   ) : gameData.resolved && isPredictionCorrect ? (
                     <div className="flex items-center">
@@ -105,7 +105,7 @@ export default function BetCard({
                       />
                       <p>{`+${formatEther(
                         calculatedWinnings ?? BigInt(0),
-                      )} MATIC`}</p>
+                      )} ETH`}</p>
                     </div>
                   ) : gameData.resolved && !isPredictionCorrect ? (
                     <div className="flex items-center">
@@ -117,7 +117,7 @@ export default function BetCard({
                       />
                       <p>{`-${formatEther(
                         prediction.amount ?? BigInt(0),
-                      )} MATIC`}</p>
+                      )} ETH`}</p>
                     </div>
                   ) : (
                     <div className="flex items-center">
@@ -129,7 +129,7 @@ export default function BetCard({
                       />
                       <p>{`+${formatEther(
                         calculatedWinnings ?? BigInt(0),
-                      )} MATIC`}</p>
+                      )} ETH`}</p>
                     </div>
                   )}
                 </div>
@@ -164,12 +164,12 @@ export default function BetCard({
           )}
           {txHash && (
             <a
-              href={`https://mumbai.polygonscan.com/tx/${txHash}`}
+              href={`https://sepolia-optimism.etherscan.io/tx/${txHash}`}
               target="_blank"
               rel="noreferrer"
             >
               <Button className="w-full border-2 border-border bg-background text-base font-medium leading-4 text-foreground hover:bg-background/90 hover:text-muted-foreground">
-                View Polygonscan
+                View Etherscan
               </Button>
             </a>
           )}

app/src/components/bet-slip-card.tsx

@@ -125,10 +125,10 @@ export default function BetslipCard({
                     <FormControl>
                       <div className="flex space-x-[8px] rounded-[8px] bg-secondary px-4 py-3">
                         <Image
-                          src="/matic.svg"
+                          src="/optimism.svg"
                           width={16}
                           height={16}
-                          alt="matic"
+                          alt="optimism"
                         />
                         <Input
                           disabled={isLoading}
@@ -158,10 +158,10 @@ export default function BetslipCard({
                     <FormControl>
                       <div className="flex space-x-[8px] rounded-[8px] bg-secondary px-4 py-3">
                         <Image
-                          src="/matic.svg"
+                          src="/optimism.svg"
                           width={16}
                           height={16}
-                          alt="matic"
+                          alt="optimism"
                         />
                         <Input
                           disabled

app/src/components/claim-button.tsx

@@ -144,22 +144,22 @@ const ClaimButton = ({
                 <DialogDescription className="font-[450] text-muted-foreground">
                   {`You are transferring ${formatEther(
                     calculatedWinnings,
-                  )} MATIC from Polygon Mumbai to Avalanche Fuji.`}
+                  )} ETH from Optimism Sepolia to Avalanche Fuji.`}
                 </DialogDescription>
               </DialogHeader>
               <div className="flex w-full items-end space-x-4">
                 <div>
                   <span className="mb-4 text-[14px] leading-4">From</span>
                   <div className="flex items-center space-x-[8px] rounded-[8px] bg-primary px-4 py-3">
                     <Image
-                      src="/matic.svg"
+                      src="/optimism.svg"
                       width={24}
                       height={24}
-                      alt="matic"
+                      alt="optimism"
                     />
                     <div className="text-sm font-[450] leading-4">{`${formatEther(
                       calculatedWinnings,
-                    )} MATIC`}</div>
+                    )} ETH`}</div>
                   </div>
                 </div>
                 <Image

app/src/components/main-nav.tsx

@@ -53,7 +53,7 @@ export default function MainNav() {
               </AccordionTrigger>
               <AccordionContent>
                 <p className="text-secondary-foreground">
-                  Built on top of Polygon testnet and Chainlink, this dApp
+                  Built on top of Optimism Sepolia testnet and Chainlink, this dApp
                   enables users to interact with real time sport data, receive
                   automatic payouts, and transfer tokens across chains.
                 </p>
@@ -62,13 +62,13 @@ export default function MainNav() {
           </Accordion>
 
           <a
-            href="https://faucet.polygon.technology"
+            href="https://faucets.chain.link/optimism-sepolia"
             target="_blank"
             rel="noreferrer"
             className="mt-4 flex items-center space-x-[8px] text-base font-bold leading-4 hover:underline hover:brightness-125"
           >
-            <Image src="/polygon.svg" width={16} height={16} alt="polygon" />
-            <span>Get testnet MATIC</span>
+            <Image src="/optimism.svg" width={16} height={16} alt="optimism" />
+            <span>Get testnet ETH</span>
             <Image
               src="/external-link.svg"
               width={12}

app/src/components/place-bet-button.tsx

@@ -40,12 +40,12 @@ export default function PlaceBetButton({
       return
     }
     if (predictions.some((p) => p.wager! < minWager)) {
-      setError(`Minimum bet amount is ${minWager} MATIC`)
+      setError(`Minimum bet amount is ${minWager} ETH`)
       setTimeout(() => setError(null), 3000)
       return
     }
     if (predictions.some((p) => p.wager! > maxWager)) {
-      setError(`Maximum bet amount is ${maxWager} MATIC`)
+      setError(`Maximum bet amount is ${maxWager} ETH`)
       setTimeout(() => setError(null), 3000)
       return
     }

app/src/components/user-balance.tsx

@@ -11,7 +11,7 @@ const UserBalance = () => {
     <div className="font-bold">
       {address ? (
         <div className="flex items-center space-x-[4px]">
-          <Image src="/matic.svg" width={16} height={16} alt="matic" />
+          <Image src="/optimism.svg" width={16} height={16} alt="optimism" />
           <span className="text-xs">{`${data?.formatted.slice(0, 4)} ${
             data?.symbol
           }`}</span>

app/src/wagmi.ts

@@ -1,11 +1,11 @@
 import { getDefaultWallets } from '@rainbow-me/rainbowkit'
 import { configureChains, createConfig } from 'wagmi'
-import { polygonMumbai } from 'wagmi/chains'
+import { optimismSepolia } from 'wagmi/chains'
 import { alchemyProvider } from 'wagmi/providers/alchemy'
 import { publicProvider } from 'wagmi/providers/public'
 
 const { chains, publicClient, webSocketPublicClient } = configureChains(
-  [polygonMumbai],
+  [optimismSepolia],
   [
     alchemyProvider({ apiKey: process.env.NEXT_PUBLIC_ALCHEMY_API_KEY! }),
     publicProvider(),

contracts/README.md

@@ -30,7 +30,7 @@ All required configuration for supported networks is located in the [`networks.j
     2. Use the command `npx env-enc set` to set the required environment variables (see [Environment Variable Management](#environment-variable-management)):
        - _GITHUB_API_TOKEN_ for your Github token obtained from step 3
        - _PRIVATE_KEY_ for your development wallet
-       - _POLYGON_MUMBAI_RPC_URL_, _ETHEREUM_SEPOLIA_RPC_URL_, _AVALANCHE_FUJI_RPC_URL_ for the network that you intend to use
+       - _OPTIMISM_SEPOLIA_RPC_URL_, _AVALANCHE_FUJI_RPC_URL_ for the network that you intend to use
        - _API_KEY_ for the sports results API. Obtain one [here](https://dashboard.api-football.com/register).
     3. If desired, the `<explorer>_API_KEY` can be set in order to verify contracts, along with any values used in the _secrets_ object in _Functions-request-config.js_ such as `COINMARKETCAP_API_KEY`.<br><br>
 4.  Test an end-to-end request and fulfillment locally by simulating it using:<br>`npx hardhat functions-simulate`<br><br>
@@ -45,11 +45,18 @@ All required configuration for supported networks is located in the [`networks.j
       - Your wallet has a sufficient native token balance on both networks for the deployment and transaction fees.
       - Yoyr wallet LINK balance is sufficient to fund the contract so it can pay the CCIP transfer fees. The amount is specified in the `networks.js` file under each network `fundAmount` property.
       - `<explorer>_API_KEY` is set if using `--verify true`, depending on which network is used.<br><br>
-8.  In order for the registered games in the contract to be updated with results from the sports API automatically, the game contract must be registered as an upkeep. Follow the steps at [https://automation.chain.link](https://automation.chain.link).<br>**Note**: Make sure the gas limit is set to 1,000,000.<br><br>
+8.  In order for the registered games in the contract to be updated with results from the sports API automatically, the game contract must be registered as an upkeep. Follow the steps at [https://automation.chain.link](https://automation.chain.link).<br>**Note**: Make sure the gas limit is set to 3,000,000.<br><br>
 
 ## Deployments
 
-Polygon Mumbai
+Optimism Sepolia
+
+- Game contract: [`0x31015944A2719Da19531Ced7ed72e9DD6761A478`](https://sepolia-optimism.etherscan.io/address/0x31015944A2719Da19531Ced7ed72e9DD6761A478)
+- Functions subscription: [`177`](https://functions.chain.link/optimism-sepolia/177)
+- Automation upkeep: [`112557321685295299629771618321084972343709241235617405730580214266603599595202`](https://automation.chain.link/optimism-sepolia/112557321685295299629771618321084972343709241235617405730580214266603599595202)
+- CCIP Token Receiver contract on Avalanche Fuji: [`0xB9bb8BfD3540E44b8eAaC9d5Dfc31B9D8E898C03`](https://testnet.snowtrace.io/address/0xB9bb8BfD3540E44b8eAaC9d5Dfc31B9D8E898C03)
+
+Polygon Mumbai (Deprecated)
 
 - Game contract: [`0x837acF842c9D99004A4b4fa1C250Fe3ca0c3ce63`](https://mumbai.polygonscan.com/address/0x837acF842c9D99004A4b4fa1C250Fe3ca0c3ce63)
 - Functions subscription: [`1328`](https://functions.chain.link/mumbai/1328)

contracts/contracts/ccip/NativeTokenSender.sol

@@ -2,7 +2,7 @@
 pragma solidity ^0.8.0;
 
 import {ProgrammableTokenSender} from "./ProgrammableTokenSender.sol";
-import {ISwapRouter} from "@uniswap/v3-periphery/contracts/interfaces/ISwapRouter.sol";
+import {IV3SwapRouter} from "../interfaces/IV3SwapRouter.sol";
 
 /// @title NativeTokenSender
 /// @notice Sends native token transfer request to another chain
@@ -82,17 +82,16 @@ abstract contract NativeTokenSender is ProgrammableTokenSender {
   /// @param _nativeTokenAmount The amount of native token to swap
   /// @return exchangeTokenAmount The amount of exchange token received
   function _swapNativeToExchangeToken(uint256 _nativeTokenAmount) internal returns (uint256 exchangeTokenAmount) {
-    ISwapRouter.ExactInputSingleParams memory params = ISwapRouter.ExactInputSingleParams({
+    IV3SwapRouter.ExactInputSingleParams memory params = IV3SwapRouter.ExactInputSingleParams({
       tokenIn: weth9Token,
       tokenOut: exchangeToken,
       fee: POOL_FEE,
       recipient: address(this),
-      deadline: block.timestamp,
       amountIn: _nativeTokenAmount,
       amountOutMinimum: 0,
       sqrtPriceLimitX96: 0
     });
-    exchangeTokenAmount = ISwapRouter(uniswapV3Router).exactInputSingle{value: _nativeTokenAmount}(params);
+    exchangeTokenAmount = IV3SwapRouter(uniswapV3Router).exactInputSingle{value: _nativeTokenAmount}(params);
   }
 
   // OWNER