feat: zkstack integration

.gitignore

@@ -52,5 +52,8 @@ lerna-debug.log*
 !.vscode/launch.json
 !.vscode/extensions.json
 
-#Allure
-/allure-results/
+# Allure
+/allure-results/
+
+# App hyperchain config
+hyperchain.json

README.md

@@ -55,11 +55,25 @@ $ npm install
 
 ## ⚙️ Setting up env variables
 
-Make sure you have set up all the necessary env variables. Follow [Setting up env variables for Worker](./packages/worker#setting-up-env-variables) and [Setting up env variables for API](./packages/api#setting-up-env-variables) for instructions.
+### Manually set up env variables
+Make sure you have set up all the necessary env variables. Follow [Setting up env variables for Worker](./packages/worker#setting-up-env-variables) and [Setting up env variables for API](./packages/api#setting-up-env-variables) for instructions. For the [App](./packages/app) package you might want to edit environment config, see [Environment configs](./packages/app#environment-configs).
+
+### Build env variables based on your [zksync-era](https://github.com/matter-labs/zksync-era) local repo setup
+Make sure you have [zksync-era](https://github.com/matter-labs/zksync-era) repo set up locally. You must have your environment variables files present in the [zksync-era](https://github.com/matter-labs/zksync-era) repo at `/etc/env/*.env` for the build envs script to work.
+
+The following script sets `.env` files for [Worker](./packages/worker) and [API](./packages/api) packages as well as environment configuration file for [App](./packages/app) package based on your local [zksync-era](https://github.com/matter-labs/zksync-era) repo setup.
+```bash
+$ npm run hyperchain:configure
+```
+You can review and edit generated files if you need to change any settings.
 
 ## 👨‍💻 Running locally
 
 Before running the solution, make sure you have a database server up and running, you have created a database and set up all the required environment variables.
+To create a database run the following command:
+```bash
+$ npm run db:create
+```
 
 To run all the packages (`Worker`, `API` and front-end `App`) in `development` mode run the following command from the root directory.
 ```bash
@@ -81,6 +95,9 @@ docker-compose up
 ```
 It will run local Ethereum node, ZkSync Era, Postgres DB and all Block Explorer services.
 
+## ⛓️ Connection to your Hyperchain
+To get block-explorer connected to your ZK Stack Hyperchain you need to set up all the the necessary environment and configuration files with your Hyperchain settings. You can use a script to build them. See [Setting up env variables](#setting-up-env-variables).
+
 ## 🔍 Verify Block Explorer is up and running
 
 To verify front-end `App` is running open http://localhost:3010 in your browser. `API` should be available at http://localhost:3020. `Worker` - http://localhost:3001.

package.json

@@ -18,15 +18,18 @@
     "test:e2e": "lerna run test:e2e",
     "dev": "lerna run dev",
     "build": "lerna run build",
-    "start": "lerna run start"
+    "start": "lerna run start",
+    "db:create": "lerna run db:create",
+    "db:drop": "lerna run db:drop",
+    "hyperchain:configure": "ts-node scripts/setup-hyperchain-config"
   },
   "devDependencies": {
     "@commitlint/cli": "^17.1.2",
     "@commitlint/config-conventional": "^17.1.0",
     "@matterlabs/prettier-config": "^1.0.2",
     "@semantic-release/changelog": "^6.0.3",
-    "@semantic-release/exec": "^6.0.3",
     "@semantic-release/commit-analyzer": "^9.0.2",
+    "@semantic-release/exec": "^6.0.3",
     "@semantic-release/github": "^8.0.2",
     "@semantic-release/npm": "^9.0.0",
     "@semantic-release/release-notes-generator": "^10.0.3",
@@ -36,7 +39,10 @@
     "lerna": "^7.2.0",
     "prettier": "2.8.4",
     "semantic-release": "^21.1.1",
-    "typescript": "4.7.4"
+    "typescript": "4.7.4",
+    "enquirer": "2.3.6",
+    "dotenv": "16.1.4",
+    "pg-connection-string": "2.6.2"
   },
   "engines": {
     "npm": ">=9.0.0",

packages/app/src/composables/useEnvironmentConfig.ts

@@ -4,9 +4,21 @@ import type { EnvironmentConfig, NetworkConfig } from "@/configs";
 
 const config = ref<EnvironmentConfig | null>(null);
 
+const HYPERCHAIN_CONFIG_NAME = "hyperchain";
+const LOCAL_CONFIG_NAME = "local";
+
 export async function loadEnvironmentConfig(appEnvironment: string): Promise<void> {
-  const { default: envConfig } = await import(`../configs/${appEnvironment}.config.ts`);
-  config.value = envConfig as EnvironmentConfig;
+  let envConfig: EnvironmentConfig;
+  if (appEnvironment === "default") {
+    try {
+      envConfig = (await import(`../configs/${HYPERCHAIN_CONFIG_NAME}.config.json`)).default;
+    } catch {
+      envConfig = (await import(`../configs/${LOCAL_CONFIG_NAME}.config.json`)).default;
+    }
+  } else {
+    envConfig = (await import(`../configs/${appEnvironment}.config.json`)).default;
+  }
+  config.value = envConfig;
 }
 
 export default () => {

packages/app/src/composables/useRuntimeConfig.ts

@@ -29,6 +29,6 @@ export default (): {
   return {
     version: import.meta.env?.VITE_VERSION || "localhost",
     sentryDSN: runtimeConfig?.sentryDSN || import.meta.env?.VITE_SENTRY_DSN,
-    appEnvironment: runtimeConfig?.appEnvironment || import.meta.env?.VITE_APP_ENVIRONMENT || "local",
+    appEnvironment: runtimeConfig?.appEnvironment || import.meta.env?.VITE_APP_ENVIRONMENT || "default",
   };
 };