feat(bridge-ui-v2): dynamic import of NFT data via API (#14928)

packages/bridge-ui-v2/.env.example

@@ -9,6 +9,7 @@ export PUBLIC_WALLETCONNECT_PROJECT_ID=""
 
 # Enable NFT Bridge ("true" or "false")
 export PUBLIC_NFT_BRIDGE_ENABLED=""
+PUBLIC_NFT_BATCH_TRANSFERS_ENABLED=""
 
 # Sentry
 export PUBLIC_SENTRY_DSN=https://
@@ -20,4 +21,5 @@ export SENTRY_AUTH_TOKEN=
 export CONFIGURED_BRIDGES=
 export CONFIGURED_CHAINS=
 export CONFIGURED_CUSTOM_TOKEN=
-export CONFIGURED_RELAYER=
+export CONFIGURED_RELAYER=
+export CONFIGURED_EVENT_INDEXER=

packages/bridge-ui-v2/config/sample/configuredEventIndexer.example

@@ -0,0 +1,12 @@
+{
+ "configuredEventIndexer": [
+ {
+ "chainIds": [123456, 654321],
+ "url": "https://some/url.example"
+ },
+ {
+ "chainIds": [1, 11155111],
+ "url": "https://some/other/url.example"
+ }
+ ]
+}

packages/bridge-ui-v2/config/schemas/configuredEventIndexer.schema.json

@@ -0,0 +1,25 @@
+{
+ "$id": "configuredEventIndexer.json",
+ "type": "object",
+ "properties": {
+ "configuredEventIndexer": {
+ "type": "array",
+ "items": {
+ "type": "object",
+ "properties": {
+ "chainIds": {
+ "type": "array",
+ "items": {
+ "type": "integer"
+ }
+ },
+ "url": {
+ "type": "string"
+ }
+ },
+ "required": ["chainIds", "url"]
+ }
+ }
+ },
+ "required": ["configuredEventIndexer"]
+}

packages/bridge-ui-v2/scripts/exportJsonToEnv.js

@@ -13,11 +13,12 @@ const bridgesPath = 'config/configuredBridges.json';
 const chainsPath = 'config/configuredChains.json';
 const tokensPath = 'config/configuredCustomToken.json';
 const relayerPath = 'config/configuredRelayer.json';
+const eventIndexerPath = 'config/configuredEventIndexer.json';
 
 // Create a backup of the existing .env file
 fs.copyFileSync(envFile, `${envFile}.bak`);
 
-const jsonFiles = [bridgesPath, chainsPath, tokensPath, relayerPath];
+const jsonFiles = [bridgesPath, chainsPath, tokensPath, relayerPath, eventIndexerPath];
 
 jsonFiles.forEach((jsonFile) => {
  if (fs.existsSync(jsonFile)) {

packages/bridge-ui-v2/scripts/vite-plugins/generateEventIndexerConfig.ts

@@ -0,0 +1,141 @@
+/* eslint-disable no-console */
+import dotenv from 'dotenv';
+import { promises as fs } from 'fs';
+import path from 'path';
+import { Project, SourceFile, VariableDeclarationKind } from 'ts-morph';
+
+import configuredEventIndexerSchema from '../../config/schemas/configuredEventIndexer.schema.json';
+import type { ConfiguredEventIndexer, EventIndexerConfig } from '../../src/libs/eventIndexer/types';
+import { decodeBase64ToJson } from './../utils/decodeBase64ToJson';
+import { formatSourceFile } from './../utils/formatSourceFile';
+import { PluginLogger } from './../utils/PluginLogger';
+import { validateJsonAgainstSchema } from './../utils/validateJson';
+
+dotenv.config();
+
+const pluginName = 'generateEventIndexerConfig';
+const logger = new PluginLogger(pluginName);
+
+const skip = process.env.SKIP_ENV_VALDIATION || false;
+
+const currentDir = path.resolve(new URL(import.meta.url).pathname);
+
+const outputPath = path.join(path.dirname(currentDir), '../../src/generated/eventIndexerConfig.ts');
+
+export function generateEventIndexerConfig() {
+ return {
+ name: pluginName,
+ async buildStart() {
+ logger.info('Plugin initialized.');
+ let configuredEventIndexerConfigFile;
+
+ if (!skip) {
+ if (!process.env.CONFIGURED_EVENT_INDEXER) {
+ throw new Error(
+ 'CONFIGURED_EVENT_INDEXER is not defined in environment. Make sure to run the export step in the documentation.',
+ );
+ }
+
+ // Decode base64 encoded JSON string
+ configuredEventIndexerConfigFile = decodeBase64ToJson(process.env.CONFIGURED_EVENT_INDEXER || '');
+
+ // Valide JSON against schema
+ const isValid = validateJsonAgainstSchema(configuredEventIndexerConfigFile, configuredEventIndexerSchema);
+ if (!isValid) {
+ throw new Error('encoded configuredBridges.json is not valid.');
+ }
+ } else {
+ configuredEventIndexerConfigFile = '';
+ }
+ // Path to where you want to save the generated Typ eScript file
+ const tsFilePath = path.resolve(outputPath);
+
+ const project = new Project();
+ const notification = `// Generated by ${pluginName} on ${new Date().toLocaleString()}`;
+ const warning = `// WARNING: Do not change this file manually as it will be overwritten`;
+
+ let sourceFile = project.createSourceFile(tsFilePath, `${notification}\n${warning}\n`, { overwrite: true });
+
+ // Create the TypeScript content
+ sourceFile = await storeTypesAndEnums(sourceFile);
+ sourceFile = await buildEventIndexerConfig(sourceFile, configuredEventIndexerConfigFile);
+
+ await sourceFile.save();
+
+ const formatted = await formatSourceFile(tsFilePath);
+ console.log('formatted', tsFilePath);
+
+ // Write the formatted code back to the file
+ await fs.writeFile(tsFilePath, formatted);
+ logger.info(`Formatted config file saved to ${tsFilePath}`);
+ },
+ };
+}
+
+async function storeTypesAndEnums(sourceFile: SourceFile) {
+ logger.info(`Storing types...`);
+ // RelayerConfig
+ sourceFile.addImportDeclaration({
+ namedImports: ['EventIndexerConfig'],
+ moduleSpecifier: '$libs/eventIndexer',
+ isTypeOnly: true,
+ });
+
+ logger.info('Types stored.');
+ return sourceFile;
+}
+
+async function buildEventIndexerConfig(
+ sourceFile: SourceFile,
+ configuredEventIndexerConfigFile: ConfiguredEventIndexer,
+) {
+ logger.info('Building event indexer config...');
+
+ const indexer: ConfiguredEventIndexer = configuredEventIndexerConfigFile;
+
+ if (!skip) {
+ if (!indexer.configuredEventIndexer || !Array.isArray(indexer.configuredEventIndexer)) {
+ console.error(
+ 'configuredEventIndexer is not an array. Please check the content of the configuredEventIndexerConfigFile.',
+ );
+ throw new Error();
+ }
+ // Create a constant variable for the configuration
+ const eventIndexerConfigVariable = {
+ declarationKind: VariableDeclarationKind.Const,
+ declarations: [
+ {
+ name: 'configuredEventIndexer',
+ initializer: _formatObjectToTsLiteral(indexer.configuredEventIndexer),
+ type: 'EventIndexerConfig[]',
+ },
+ ],
+ isExported: true,
+ };
+ sourceFile.addVariableStatement(eventIndexerConfigVariable);
+ } else {
+ const emptyEventIndexerConfigVariable = {
+ declarationKind: VariableDeclarationKind.Const,
+ declarations: [
+ {
+ name: 'configuredEventIndexer',
+ initializer: '[]',
+ type: 'EventIndexerConfig[]',
+ },
+ ],
+ isExported: true,
+ };
+ sourceFile.addVariableStatement(emptyEventIndexerConfigVariable);
+ }
+
+ logger.info('EventIndexer config built.');
+ return sourceFile;
+}
+
+const _formatEventIndexerConfigToTsLiteral = (config: EventIndexerConfig): string => {
+ return `{chainIds: [${config.chainIds ? config.chainIds.join(', ') : ''}], url: "${config.url}"}`;
+};
+
+const _formatObjectToTsLiteral = (indexer: EventIndexerConfig[]): string => {
+ return `[${indexer.map(_formatEventIndexerConfigToTsLiteral).join(', ')}]`;
+};

packages/bridge-ui-v2/src/components/Bridge/AddressInput/AddressInput.svelte

@@ -21,6 +21,7 @@
  };
 
  export const clearAddress = () => {
+ state = State.Default;
  if (input) input.value = '';
  validateEthereumAddress('');
  };