Enable trade chart

.env.development

@@ -1,9 +1,13 @@
 VITE_PROVIDER_URL=wss://basilisk-rococo-rpc.play.hydration.cloud
 VITE_DOMAIN_URL=https://testnet-app.basilisk.cloud
 VITE_INDEXER_URL=https://basilisk-rococo-explorer.play.hydration.cloud/graphql
+VITE_GRAFANA_URL=https://grafana-api.play.hydration.cloud/api/ds/query
+VITE_GRAFANA_DSN=5
 VITE_USD_PEGGED_ASSET_NAME=USDT
 VITE_USD_PEGGED_ASSET_ID=19
 VITE_FF_XCM_ENABLED=true
 VITE_ENV=rococo
 VITE_WC_PROJECT_ID=8acb5f70a756a0a3bea40322364949c1
 VITE_BSX_CAIP_ID=polkadot:a85cfb9b9fd4d622a5b28289a02347af
+VITE_GRAFANA_URL=https://grafana-api.play.hydration.cloud/api/ds/query
+VITE_GRAFANA_DSN=11

.env.production

@@ -1,10 +1,11 @@
 VITE_PROVIDER_URL=wss://rpc.basilisk.cloud
 VITE_DOMAIN_URL=https://app.basilisk.cloud
 VITE_INDEXER_URL=https://basilisk-explorer.play.hydration.cloud/graphql
+VITE_GRAFANA_URL=https://grafana-api.play.hydration.cloud/api/ds/query
+VITE_GRAFANA_DSN=5
 VITE_USD_PEGGED_ASSET_NAME=USDT
 VITE_USD_PEGGED_ASSET_ID=14
 VITE_FF_XCM_ENABLED=true
 VITE_ENV=production
-
 VITE_WC_PROJECT_ID=8acb5f70a756a0a3bea40322364949c1
 VITE_BSX_CAIP_ID=polkadot:a85cfb9b9fd4d622a5b28289a02347af

.env.rococo

@@ -1,6 +1,8 @@
 VITE_PROVIDER_URL=wss://basilisk-rococo-rpc.play.hydration.cloud
 VITE_DOMAIN_URL=https://rococo-app.basilisk.cloud
 VITE_INDEXER_URL=https://basilisk-rococo-explorer.play.hydration.cloud/graphql
+VITE_GRAFANA_URL=https://grafana-api.play.hydration.cloud/api/ds/query
+VITE_GRAFANA_DSN=5
 VITE_USD_PEGGED_ASSET_NAME=USDT
 VITE_USD_PEGGED_ASSET_ID=19
 VITE_FF_XCM_ENABLED=false

package.json

@@ -26,12 +26,12 @@
     "@emotion/react": "^11.10.4",
     "@emotion/styled": "^11.10.4",
     "@galacticcouncil/api-augment": "^0.0.3",
-    "@galacticcouncil/apps": "3.3.0",
+    "@galacticcouncil/apps": "3.3.3",
     "@galacticcouncil/math-lbp": "^0.1.3",
     "@galacticcouncil/math-liquidity-mining": "^0.1.3",
     "@galacticcouncil/math-xyk": "^0.1.3",
     "@galacticcouncil/sdk": "^1.1.11",
-    "@galacticcouncil/ui": "^3.0.4",
+    "@galacticcouncil/ui": "^3.1.2",
     "@galacticcouncil/xcm-cfg": "^1.10.4",
     "@galacticcouncil/xcm-sdk": "^2.3.1",
     "@lit-labs/react": "^1.1.0",
@@ -92,6 +92,8 @@
   },
   "scripts": {
     "dev": "vite",
+    "dev:rococo": "vite -m rococo",
+    "dev:production": "vite -m production",
     "build": "vite build && cp ./build/index.html ./build/404.html",
     "preview": "vite preview",
     "postinstall": "patch-package",

src/sections/trade/TradePage.tsx

@@ -37,14 +37,16 @@ type SearchGenerics = MakeGenerics<{
   Search: z.infer<typeof TradeAppSearch>
 }>
 
+const grafanaUrl = import.meta.env.VITE_GRAFANA_URL
+const grafanaDsn = import.meta.env.VITE_GRAFANA_DSN
+
 export function TradePage() {
   const { api } = useApiPromise()
   const { account } = useAccountStore()
   const { createTransaction } = useStore()
   const preference = useProviderRpcUrlStore()
   const rpcUrl = preference.rpcUrl ?? import.meta.env.VITE_PROVIDER_URL
 
-  const ref = React.useRef<Apps.TradeApp>(null)
   const rawSearch = useSearch<SearchGenerics>()
   const usdAssetId = import.meta.env.VITE_USD_PEGGED_ASSET_ID
   const search = TradeAppSearch.safeParse(rawSearch)
@@ -84,20 +86,32 @@ export function TradePage() {
     )
   }
 
+  // TODO: Revert when Kusama stable coin asset
+  const assetIn =
+    search.success && search.data.assetIn ? search.data.assetIn : "1" //kusama
+  const assetOut =
+    search.success && search.data.assetOut ? search.data.assetOut : "0" // basilsik
+
   return (
     <Page>
       <SContainer>
         <TradeApp
-          ref={ref}
+          ref={(r) => {
+            if (r) {
+              r.setAttribute("chart", "")
+            }
+          }}
           onTxNew={(e) => handleSubmit(e)}
           ecosystem={Ecosystem.Kusama}
           accountName={account?.name}
           accountProvider={account?.provider}
           accountAddress={account?.address}
           apiAddress={rpcUrl}
+          grafanaUrl={grafanaUrl}
+          grafanaDsn={grafanaDsn}
           stableCoinAssetId={usdAssetId}
-          assetIn={search.success ? search.data.assetIn : undefined}
-          assetOut={search.success ? search.data.assetOut : undefined}
+          assetIn={assetIn}
+          assetOut={assetOut}
         />
       </SContainer>
     </Page>

yarn.lock

@@ -1547,10 +1547,10 @@
   resolved "https://registry.yarnpkg.com/@galacticcouncil/api-augment/-/api-augment-0.0.3.tgz#b787c779ccd1455efb219d67bae43822a89396e4"
   integrity sha512-evxZy6ipHr3Y7B/V+aCSh4sJmG773qy1fDnIHIhk0uIhSB1pe7Fp0+Bpgu9T3xOPbMIuOdOV6aHEwQeZ5Xt5mg==
 
-"@galacticcouncil/apps@3.3.0":
-  version "3.3.0"
-  resolved "https://registry.yarnpkg.com/@galacticcouncil/apps/-/apps-3.3.0.tgz#07af0b46aee94a09cf03e448fa39ddc919483465"
-  integrity sha512-vVY1Qvf/3fFq55dfIaepoSgioRQZQMECvf4JSgt1DPeT685dPnLWT2dFxQ15iBD3zF+0MKm/SiueFqX0AcpfzA==
+"@galacticcouncil/apps@3.3.3":
+  version "3.3.3"
+  resolved "https://registry.yarnpkg.com/@galacticcouncil/apps/-/apps-3.3.3.tgz#68b77b7f78f6868e645b476281d728eaa2cb1597"
+  integrity sha512-GW92c/OjfZnqSn57zJdJXwDhCphVeGJ4XidlDTHu8wAlirXWwZlh7Uqz5YdDxvYEtFhsSLuiu6kLr9PznkTvcg==
   dependencies:
     "@cfx-kit/wallet-avatar" "0.0.5"
     "@talismn/connect-wallets" "^1.2.1"
@@ -1613,10 +1613,10 @@
     bignumber.js "^9.1.0"
     lodash.clonedeep "^4.5.0"
 
-"@galacticcouncil/ui@^3.0.4":
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/@galacticcouncil/ui/-/ui-3.1.0.tgz#e91975a898427904c0ad7fa5a13a36ab3bf5afe6"
-  integrity sha512-H+AuuJHuSR+fnbN0jLd59DXD5mvsadSGseKj5tZDuTaXOSVDGlZ1rj37Ejk+T9SZXvFli9dzsSj7gZVkg9V45Q==
+"@galacticcouncil/ui@^3.1.2":
+  version "3.1.2"
+  resolved "https://registry.yarnpkg.com/@galacticcouncil/ui/-/ui-3.1.2.tgz#9d67c92155d80177af4bfa8a24a5009ae2b7471c"
+  integrity sha512-qa5bd+eO84qp7EzBpI4Vi+9KU1Vzkj8mLP+lptStWDrTMUzn8RJi8va0Vj9YV4C1e9Em2hJRIAwaaGEtLMd5TA==
   dependencies:
     "@floating-ui/dom" "^1.5.1"
     "@lit/reactive-element" "^1.0.0"