change USDC to Wands

example/src/components/header.tsx

@@ -39,8 +39,8 @@ const Header = () => {
       href: '/cashout',
     },
     {
-      title: 'USDC',
-      href: '/usdc',
+      title: 'Wands',
+      href: '/wands',
     },
   ];
 
@@ -92,9 +92,9 @@ const Header = () => {
             Cashout
           </Link>
         </NavbarItem>
-        <NavbarItem isActive={location.pathname === '/usdc'}>
-          <Link className="text-gray-600 hover:text-gray-900" to="/usdc">
-            USDC
+        <NavbarItem isActive={location.pathname === '/wands'}>
+          <Link className="text-gray-600 hover:text-gray-900" to="/wands">
+            Wands
           </Link>
         </NavbarItem>
       </NavbarContent>

example/src/main.tsx

@@ -9,7 +9,7 @@ import Marketplace from './routes/kyc';
 import Header from './components/header';
 import Layout from './components/layout';
 import Kyc from './routes/kyc';
-import USDC from './routes/usdc';
+import Wands from './routes/wands';
 
 import Payout from './routes/payout';
 import { NextUIProvider } from '@nextui-org/react';
@@ -49,10 +49,10 @@ const router = createHashRouter([
     ),
   },
   {
-    path: '/usdc',
+    path: '/wands',
     element: (
       <Layout>
-        <USDC />
+        <Wands />
       </Layout>
     ),
   },

example/src/routes/usdc.tsx → example/src/routes/wands.tsx

@@ -1,8 +1,8 @@
 import { useState } from 'react';
-import { NoRampUSDC } from '../../../src';
+import { NoRampWands } from '../../../src';
 import ThemeSwitcher from '../components/ui/theme-switcher/theme-switcher';
 
-const USDC = () => {
+const Wands = () => {
   const [theme, setTheme] = useState<'light' | 'dark'>('dark');
 
   const handleThemeChange = (checked: boolean) => {
@@ -13,19 +13,19 @@ const USDC = () => {
     <div className="container flex mx-auto my-0 ">
       <div className="flex flex-col items-center w-full ">
         <div className="flex items-center justify-between w-full max-w-4xl">
-          <p className="my-4 text-2xl font-bold">USDC Widget</p>
+          <p className="my-4 text-2xl font-bold">Wands Widget</p>
 
           <div className="">
             <ThemeSwitcher onChange={handleThemeChange} />
           </div>
         </div>
 
         <div className="w-full max-w-4xl overflow-auto ">
-          <NoRampUSDC />
+          <NoRampWands />
         </div>
       </div>
     </div>
   );
 };
 
-export default USDC;
+export default Wands;

src/components/noramp-usdc/usdc.tsx → src/components/noramp-wands/wands.tsx

@@ -1,11 +1,11 @@
 import React from 'react';
 import NoRampLogo from '../NoRampLogo';
-import { NoRampUSDCProps } from '../../types';
+import { NoRampWandsProps } from '../../types';
 
 export const NoRampUSDC = ({
   height = '440',
   width = '440',
-}: NoRampUSDCProps) => {
+}: NoRampWandsProps) => {
   let src = `https://usdc.noramp.io/swap`;
 
   const [openWidget, setOpenWidget] = React.useState(false);

src/index.tsx

@@ -2,7 +2,7 @@ export { NoRampCheckout } from './components/noramp-checkout/checkout';
 export { NoRampPayout } from './components/noramp-payout/payout';
 export { NoRampKyc } from './components/noramp-kyc/kyc';
 export { NoRampCashout } from './components/noramp-cashout/cashout';
-export { NoRampUSDC } from './components/noramp-usdc/usdc';
+export { NoRampWands } from './components/noramp-wands/wands';
 export { useNoRampModal } from './hooks/useNoRampModal';
 // export { NoRampConnect } from './components/noramp-connect/connect';
 // export { NoRampConnectProvider } from './components/noramp-connect-provider/connect-provider';

src/types.ts

@@ -28,7 +28,7 @@ export type NoRampConfig = {
   userCanEditWalletAddress?: string;
 };
 
-export type NoRampUSDCProps = {
+export type NoRampWandsProps = {
   theme?: 'light' | 'dark' | null;
   height?: string;
   width?: string;