diff --git a/.github/workflows/bridge-ui-v2.yml b/.github/workflows/bridge-ui-v2.yml index 1a53c832d6f..0b7da856a1a 100644 --- a/.github/workflows/bridge-ui-v2.yml +++ b/.github/workflows/bridge-ui-v2.yml @@ -24,6 +24,13 @@ jobs: - name: Install pnpm dependencies uses: ./.github/actions/install-pnpm-dependencies + # This step is needed because the .env file is not committed to the repository + # and the Svelte check complains about not finding the exports from $env/static/public, + # which will be generated based on the .env file when running `svelte-kit sync` + - name: Copy .env.example to .env + working-directory: ./packages/bridge-ui-v2 + run: cp .env.example .env + - name: Svelte check working-directory: ./packages/bridge-ui-v2 run: pnpm svelte:check @@ -37,9 +44,3 @@ jobs: run: pnpm test:unit # TODO: Playwright tests? - - - name: Upload coverage to Codecov - uses: codecov/codecov-action@v3 - with: - directory: ./packages/bridge-ui-v2/coverage - flags: bridge-ui diff --git a/packages/bridge-ui-v2/.env.example b/packages/bridge-ui-v2/.env.example new file mode 100644 index 00000000000..282ca9d172c --- /dev/null +++ b/packages/bridge-ui-v2/.env.example @@ -0,0 +1,66 @@ +# Chain Names +export export PUBLIC_L1_CHAIN_NAME="" +export export PUBLIC_L2_CHAIN_NAME="" +export PUBLIC_L3_CHAIN_NAME="" + + +# Chain Ids +export PUBLIC_L1_CHAIN_ID= +export PUBLIC_L2_CHAIN_ID= +export PUBLIC_L3_CHAIN_ID= + + +# RPC Urls +export PUBLIC_L1_RPC_URL=https:// +export PUBLIC_L2_RPC_URL=https:// +export PUBLIC_L3_RPC_URL=https:// + + +# Explorer Urls +export PUBLIC_L1_EXPLORER_URL=https:// +export PUBLIC_L2_EXPLORER_URL=https:// +export PUBLIC_L3_EXPLORER_URL=https:// + + +# Relayer API +export PUBLIC_RELAYER_URL=https:// + + +# Use the bridge guide Urls +export PUBLIC_GUIDE_URL=https:// + + +# Cross Chain (Taiko) Contract address +export PUBLIC_L1_CROSS_CHAIN_SYNC_ADDRESS=0x +export PUBLIC_L2_CROSS_CHAIN_SYNC_ADDRESS=0x +export PUBLIC_L3_CROSS_CHAIN_SYNC_ADDRESS=0x + + +# Token Vault Contract address +export PUBLIC_L1_TOKEN_VAULT_ADDRESS=0x +export PUBLIC_L2_TOKEN_VAULT_ADDRESS=0x +export PUBLIC_L3_TOKEN_VAULT_ADDRESS=0x + + +# Bridge Contract address +export PUBLIC_L1_BRIDGE_ADDRESS=0x +export PUBLIC_L2_BRIDGE_ADDRESS=0x +export PUBLIC_L3_BRIDGE_ADDRESS=0x + + +# Signal Service Contract address +export PUBLIC_L1_SIGNAL_SERVICE_ADDRESS=0x +export PUBLIC_L2_SIGNAL_SERVICE_ADDRESS=0x +export PUBLIC_L3_SIGNAL_SERVICE_ADDRESS=0x + + +# Test token List +export PUBLIC_TEST_ERC20=[] + + +# Sentry +export PUBLIC_SENTRY_DSN=https:// + +export SENTRY_ORG= +export SENTRY_PROJECT= +export SENTRY_AUTH_TOKEN= diff --git a/packages/bridge-ui-v2/package.json b/packages/bridge-ui-v2/package.json index b7bd0e1e909..d03290e2c23 100644 --- a/packages/bridge-ui-v2/package.json +++ b/packages/bridge-ui-v2/package.json @@ -19,6 +19,7 @@ "devDependencies": { "@playwright/test": "^1.28.1", "@sveltejs/adapter-auto": "^2.0.0", + "@sveltejs/adapter-static": "^2.0.2", "@sveltejs/kit": "^1.5.0", "@typescript-eslint/eslint-plugin": "^5.45.0", "@typescript-eslint/parser": "^5.45.0", @@ -37,6 +38,7 @@ "tslib": "^2.4.1", "typescript": "^5.0.0", "vite": "^4.3.0", + "vite-tsconfig-paths": "^4.2.0", "vitest": "^0.32.2" }, "type": "module", diff --git a/packages/bridge-ui-v2/src/components/SideNavigation/SideNavigation.svelte b/packages/bridge-ui-v2/src/components/SideNavigation/SideNavigation.svelte index b94030f1389..ef59e7520a4 100644 --- a/packages/bridge-ui-v2/src/components/SideNavigation/SideNavigation.svelte +++ b/packages/bridge-ui-v2/src/components/SideNavigation/SideNavigation.svelte @@ -3,13 +3,11 @@
@@ -46,13 +44,13 @@
  • - + Exploreer
  • - + Guide diff --git a/packages/bridge-ui-v2/src/routes/+layout.ts b/packages/bridge-ui-v2/src/routes/+layout.ts index 74938a8fec7..aa0759303be 100644 --- a/packages/bridge-ui-v2/src/routes/+layout.ts +++ b/packages/bridge-ui-v2/src/routes/+layout.ts @@ -2,6 +2,7 @@ * Entry point */ -// Setting this to false turns your app into an SPA +// When setting this to false your entire app will only be rendered on the client, +// which essentially means you turn your app into an SPA. // See https://kit.svelte.dev/docs/page-options#ssr export const ssr = false; diff --git a/packages/bridge-ui-v2/svelte.config.js b/packages/bridge-ui-v2/svelte.config.js index d9776794202..4d177cd46f4 100644 --- a/packages/bridge-ui-v2/svelte.config.js +++ b/packages/bridge-ui-v2/svelte.config.js @@ -1,4 +1,4 @@ -import adapter from '@sveltejs/adapter-auto'; +import adapter from '@sveltejs/adapter-static'; import { vitePreprocess } from '@sveltejs/kit/vite'; /** @type {import('@sveltejs/kit').Config} */ @@ -8,10 +8,10 @@ const config = { preprocess: vitePreprocess(), kit: { - // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list. - // If your environment is not supported or you settled on a specific environment, switch out the adapter. - // See https://kit.svelte.dev/docs/adapters for more information about adapters. - adapter: adapter(), + // https://kit.svelte.dev/docs/single-page-apps + adapter: adapter({ + fallback: 'index.html', + }), }, }; diff --git a/packages/bridge-ui-v2/tailwind.config.js b/packages/bridge-ui-v2/tailwind.config.js index 149aaf731ca..c9c5c38b697 100644 --- a/packages/bridge-ui-v2/tailwind.config.js +++ b/packages/bridge-ui-v2/tailwind.config.js @@ -155,7 +155,7 @@ export default { utils: true, // adds responsive and modifier utility classes rtl: false, // rotate style direction from left-to-right to right-to-left. You also need to add dir="rtl" to your html tag and install `tailwindcss-flip` plugin for Tailwind CSS. prefix: '', // prefix for daisyUI classnames (components, modifiers and responsive class names. Not colors) - logs: true, // Shows info about daisyUI version and used config in the console when building your CSS + logs: false, // Shows info about daisyUI version and used config in the console when building your CSS themes: [ { dark: { diff --git a/packages/bridge-ui-v2/vite.config.ts b/packages/bridge-ui-v2/vite.config.ts index 86857fa0534..83e51c7015b 100644 --- a/packages/bridge-ui-v2/vite.config.ts +++ b/packages/bridge-ui-v2/vite.config.ts @@ -1,8 +1,15 @@ import { sveltekit } from '@sveltejs/kit/vite'; +import tsconfigPaths from 'vite-tsconfig-paths'; import { defineConfig } from 'vitest/config'; export default defineConfig({ - plugins: [sveltekit()], + plugins: [ + sveltekit(), + + // This plugin gives vite the ability to resolve imports using TypeScript's path mapping. + // https://www.npmjs.com/package/vite-tsconfig-paths + tsconfigPaths(), + ], test: { globals: true, include: ['src/**/*.{test,spec}.{js,ts}'], diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 89a08b66b09..0a300d9fa0a 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -224,6 +224,9 @@ importers: '@sveltejs/adapter-auto': specifier: ^2.0.0 version: 2.1.0(@sveltejs/kit@1.20.4) + '@sveltejs/adapter-static': + specifier: ^2.0.2 + version: 2.0.2(@sveltejs/kit@1.20.4) '@sveltejs/kit': specifier: ^1.5.0 version: 1.20.4(svelte@3.59.1)(vite@4.3.9) @@ -278,6 +281,9 @@ importers: vite: specifier: ^4.3.0 version: 4.3.9 + vite-tsconfig-paths: + specifier: ^4.2.0 + version: 4.2.0(typescript@5.1.3)(vite@4.3.9) vitest: specifier: ^0.32.2 version: 0.32.2 @@ -5036,6 +5042,14 @@ packages: import-meta-resolve: 3.0.0 dev: true + /@sveltejs/adapter-static@2.0.2(@sveltejs/kit@1.20.4): + resolution: {integrity: sha512-9wYtf6s6ew7DHUHMrt55YpD1FgV7oWql2IGsW5BXquLxqcY9vjrqCFo0TzzDpo+ZPZkW/v77k0eOP6tsAb8HmQ==} + peerDependencies: + '@sveltejs/kit': ^1.5.0 + dependencies: + '@sveltejs/kit': 1.20.4(svelte@3.59.1)(vite@4.3.9) + dev: true + /@sveltejs/kit@1.20.4(svelte@3.59.1)(vite@4.3.9): resolution: {integrity: sha512-MmAzIuMrP7A+8fqDVbxm6ekGHRHL/+Fk8sQPAzPG4G2TxUDtHdn/WcIxeEqHzARMf0OtGSC+VPyOSFuw2Cy2Mg==} engines: {node: ^16.14 || >=18} @@ -14160,7 +14174,6 @@ packages: /globrex@0.1.2: resolution: {integrity: sha512-uHJgbwAMwNFf5mLst7IWLNg14x1CkeqglJb/K3doi4dw6q2IvAAmM/Y81kevy83wP+Sst+nutFTYOGg3d1lsxg==} - dev: false /globule@1.3.4: resolution: {integrity: sha512-OPTIfhMBh7JbBYDpa5b+Q5ptmMWKwcNcFSR/0c6t8V4f3ZAVBEsKNY37QdVqmLRYSMhOUGYrY0QhSoEpzGr/Eg==} @@ -23275,6 +23288,19 @@ packages: yn: 3.1.1 dev: true + /tsconfck@2.1.1(typescript@5.1.3): + resolution: {integrity: sha512-ZPCkJBKASZBmBUNqGHmRhdhM8pJYDdOXp4nRgj/O0JwUwsMq50lCDRQP/M5GBNAA0elPrq4gAeu4dkaVCuKWww==} + engines: {node: ^14.13.1 || ^16 || >=18} + hasBin: true + peerDependencies: + typescript: ^4.3.5 || ^5.0.0 + peerDependenciesMeta: + typescript: + optional: true + dependencies: + typescript: 5.1.3 + dev: true + /tsconfig-paths@3.14.1: resolution: {integrity: sha512-fxDhWnFSLt3VuTwtvJt5fpwxBHg5AdKWMsgcPOOIilyjymcYVZoCQF8fvFRezCNfblEXmi+PcM1eYHeOAgXCOQ==} dependencies: @@ -24077,6 +24103,23 @@ packages: vite: 3.2.4 dev: true + /vite-tsconfig-paths@4.2.0(typescript@5.1.3)(vite@4.3.9): + resolution: {integrity: sha512-jGpus0eUy5qbbMVGiTxCL1iB9ZGN6Bd37VGLJU39kTDD6ZfULTTb1bcc5IeTWqWJKiWV5YihCaibeASPiGi8kw==} + peerDependencies: + vite: '*' + peerDependenciesMeta: + vite: + optional: true + dependencies: + debug: 4.3.4 + globrex: 0.1.2 + tsconfck: 2.1.1(typescript@5.1.3) + vite: 4.3.9 + transitivePeerDependencies: + - supports-color + - typescript + dev: true + /vite@3.2.4: resolution: {integrity: sha512-Z2X6SRAffOUYTa+sLy3NQ7nlHFU100xwanq1WDwqaiFiCe+25zdxP1TfCS5ojPV2oDDcXudHIoPnI1Z/66B7Yw==} engines: {node: ^14.18.0 || >=16.0.0}