create-sbc-app 0.4.4 → 0.4.5

package/README.md

@@ -135,7 +135,7 @@ npx create-sbc-app my-app --template react-dynamic
 npx create-sbc-app my-app --template react-para
 ```
 
-**Supported Chains:** Base Sepolia, Base (Radius Testnet not supported)
+**Supported Chains:** Base Sepolia, Base, Radius Testnet, Radius
 
 **Features:**
 - Para wallet integration

package/bin/cli.js

@@ -105,7 +105,7 @@ Available Chains:
         }
     }
     // Validate template + chain compatibility
-    if (['react-dynamic', 'react-para', 'react-turnkey'].includes(template) && (chain === 'radiusTestnet' || chain === 'radius')) {
+    if (['react-dynamic', 'react-turnkey'].includes(template) && (chain === 'radiusTestnet' || chain === 'radius')) {
         console.log(`\nError: The ${template} template does not support ${chain}.`);
         console.log('Please use baseSepolia or base chain instead.\n');
         process.exit(1);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-sbc-app",
-  "version": "0.4.4",
+  "version": "0.4.5",
   "description": "Scaffold a new SBC App Kit project with one command.",
   "bin": {
     "create-sbc-app": "bin/cli.js"

package/templates/react-para/.env.template

@@ -2,6 +2,6 @@
 VITE_SBC_API_KEY={{apiKey}}
 # Get your Para API Key at https://developer.getpara.com/
 VITE_PARA_API_KEY=your_para_api_key
-# Supported chains: "baseSepolia" | "base"
+# Supported chains: "baseSepolia" | "base" | "radiusTestnet" | "radius"
 VITE_CHAIN={{chain}}
 VITE_RPC_URL=

package/templates/react-para/src/App.tsx.template

@@ -81,10 +81,14 @@ const permitAbi = [
 const chainExplorer = (c: Chain) => {
   if (c.id === baseSepolia.id) return 'https://sepolia.basescan.org';
   if (c.id === base.id) return 'https://basescan.org';
-  if (c.id === radiusTestnet.id) return 'https://testnet.radiustech.xyz/testnet/explorer';
+  if (c.id === radiusTestnet.id) return 'https://testnet.radiustech.xyz';
+  if (c.id === radius.id) return 'https://network.radiustech.xyz';
   return '';
 };
 
+const isRadiusChain = (c: Chain) => c.id === radiusTestnet.id || c.id === radius.id;
+const nativeCurrencyLabel = (c: Chain) => isRadiusChain(c) ? 'RUSD' : 'ETH';
+
 function SmartAccountInfo({ account, refreshAccount, isLoadingAccount, accountError }: any) {
   const [sbcBalance, setSbcBalance] = useState<string | null>(null);
   useEffect(() => {
@@ -119,7 +123,7 @@ function SmartAccountInfo({ account, refreshAccount, isLoadingAccount, accountEr
         <div className="flex justify-between"><span className="text-purple-700">Smart Account Address:</span><span className="font-mono text-xs text-purple-600 break-all">{account.address}</span></div>
         <div className="flex justify-between"><span className="text-purple-700">Deployed:</span><span className="text-purple-600">{account.isDeployed ? '✅ Yes' : '⏳ On first transaction'}</span></div>
         <div className="flex justify-between"><span className="text-purple-700">Nonce:</span><span className="text-purple-600">{account.nonce}</span></div>
-        <div className="flex justify-between"><span className="text-purple-700">ETH Balance:</span><span className="text-purple-600 font-mono text-xs">{fmtEth(account.balance)} ETH</span></div>
+        <div className="flex justify-between"><span className="text-purple-700">{nativeCurrencyLabel(chain)} Balance:</span><span className="text-purple-600 font-mono text-xs">{fmtEth(account.balance)} {nativeCurrencyLabel(chain)}</span></div>
         <div className="flex justify-between"><span className="text-purple-700">{getTokenSymbol(chain)} Balance:</span><span className="text-purple-600 font-mono text-xs">{fmtSbc(sbcBalance)} {getTokenSymbol(chain)}</span></div>
       </div>
       {accountError && <p className="mt-2 text-xs text-red-600">{String(accountError)}</p>}