Migrate to Vite + other updates (#345)

* Functional

* Updated workflows

* Fix

* Fix PR preview

* Fix path

* Tweak charts

* Cleanup

* Update routes

* More cleanup

* Fix

* Fixes

Author: quietbits

.eslintrc.js

@@ -1,10 +1,24 @@
 module.exports = {
-  extends: ["@stellar/eslint-config"],
+  env: {
+    browser: true,
+    es2021: true,
+    node: true,
+  },
+  extends: ["eslint:recommended", "prettier"],
+  parser: "@typescript-eslint/parser",
+  parserOptions: {
+    ecmaVersion: 12,
+    sourceType: "module",
+  },
+  plugins: ["@typescript-eslint"],
   rules: {
     "no-console": "off",
-    "import/no-unresolved": "off",
-    "no-await-in-loop": "off",
     "no-constant-condition": "off",
-    "@typescript-eslint/naming-convention": ["warn"],
+    "@typescript-eslint/no-unused-vars": ["warn", { argsIgnorePattern: "^_" }],
+    "no-unused-vars": ["error", { argsIgnorePattern: "^_" }],
+    "prefer-const": "warn",
+    "no-var": "warn",
+    eqeqeq: "warn",
   },
+  ignorePatterns: ["node_modules/", "dist/", "*.min.js"],
 };

.github/workflows/codeql.yml

@@ -1,12 +1,12 @@
-name: "CodeQL"
+name: "CodeQL Security Analysis"
 
 on:
   push:
-    branches: [ "master" ]
+    branches: ["master", "main"]
   pull_request:
-    branches: [ "master" ]
+    branches: ["master", "main"]
   schedule:
-    - cron: '26 17 * * 6'
+    - cron: "26 17 * * 6"
 
 jobs:
   analyze:
@@ -16,26 +16,31 @@ jobs:
     permissions:
       # required for all workflows
       security-events: write
+      # required to fetch internal or private CodeQL packs
+      packages: read
+      # only required for workflows in private repositories
+      actions: read
+      contents: read
 
     strategy:
       fail-fast: false
       matrix:
         include:
-        - language: javascript-typescript
-          build-mode: none
-        
+          - language: javascript-typescript
+            build-mode: none
+
     steps:
-    - name: Checkout repository
-      uses: actions/checkout@v4
+      - name: Checkout repository
+        uses: actions/checkout@v4
 
-    # Initializes the CodeQL tools for scanning.
-    - name: Initialize CodeQL
-      uses: github/codeql-action/init@v3
-      with:
-        languages: ${{ matrix.language }}
-        build-mode: ${{ matrix.build-mode }}
+      # Initializes the CodeQL tools for scanning.
+      - name: Initialize CodeQL
+        uses: github/codeql-action/init@v3
+        with:
+          languages: ${{ matrix.language }}
+          build-mode: ${{ matrix.build-mode }}
 
-    - name: Perform CodeQL Analysis
-      uses: github/codeql-action/analyze@v3
-      with:
-        category: "/language:${{matrix.language}}"
+      - name: Perform CodeQL Analysis
+        uses: github/codeql-action/analyze@v3
+        with:
+          category: "/language:${{matrix.language}}"

.github/workflows/test-build.yml

@@ -1,29 +1,55 @@
-name: Test and build
+name: Test and Build
+
 on:
   push:
     branches:
-    - master
+      - master
+      - main
   pull_request:
 
 jobs:
-  build:
+  test-and-build:
     runs-on: ubuntu-latest
+
     services:
       redis:
-        image: redis
+        image: redis:7-alpine
         # Set health checks to wait until redis has started
         options: >-
-          --health-cmd "redis-cli ping"
-          --health-interval 10s
-          --health-timeout 5s
-          --health-retries 5
+          --health-cmd "redis-cli ping" --health-interval 10s --health-timeout
+          5s --health-retries 5
         ports:
-        - 6379:6379
+          - 6379:6379
+
     steps:
-      - uses: actions/checkout@v2
-      - uses: actions/setup-node@v2
+      - name: Checkout code
+        uses: actions/checkout@v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@v4
+        with:
+          node-version: "22"
+          cache: "npm"
+
+      - name: Install dependencies
+        run: npm install --legacy-peer-deps
+        # Note: Using --legacy-peer-deps due to muicss package compatibility with React 18
+
+      - name: Run linter
+        run: npx eslint backend/ --ext .ts
+
+      - name: Run tests
+        run: npm test
+        env:
+          DEV: true
+
+      - name: Build application
+        run: npm run build
+
+      - name: Upload build artifacts
+        uses: actions/upload-artifact@v4
+        if: success()
         with:
-          node-version: 16
-      - run: yarn install
-      - run: yarn test
-      - run: yarn build
+          name: build-files
+          path: dist/
+          retention-days: 7

.gitignore

@@ -1,6 +1,10 @@
 /node_modules
-/.tmp
 /dist
 *.eslintcache
 *service-account.json
 *.env
+/.vscode
+/.idea
+/.kiro
+/.cursor
+dump.rdb

.prettierignore

@@ -1 +1 @@
-.tmp
+

Dockerfile

@@ -1,4 +1,4 @@
-FROM ubuntu:22.04
+FROM ubuntu:24.04
 
 MAINTAINER SDF Ops Team <ops@stellar.org>
 
@@ -8,16 +8,20 @@ WORKDIR /app/src
 RUN apt-get update && DEBIAN_FRONTEND=noninteractive apt-get install --no-install-recommends -y \
     gpg curl ca-certificates git apt-transport-https && \
     curl -sSL https://deb.nodesource.com/gpgkey/nodesource-repo.gpg.key|gpg --dearmor >/etc/apt/trusted.gpg.d/nodesource-key.gpg && \
-    echo "deb https://deb.nodesource.com/node_16.x nodistro main" | tee /etc/apt/sources.list.d/nodesource.list && \
-    curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg |gpg --dearmor >/etc/apt/trusted.gpg.d/yarnpkg.gpg && \
-    echo "deb https://dl.yarnpkg.com/debian/ stable main" | tee /etc/apt/sources.list.d/yarn.list && \
-    apt-get update && DEBIAN_FRONTEND=noninteractive apt-get install -y nodejs yarn && \
-    yarn install && /app/src/node_modules/gulp/bin/gulp.js build
+    echo "deb https://deb.nodesource.com/node_22.x nodistro main" | tee /etc/apt/sources.list.d/nodesource.list && \
+    apt-get update && DEBIAN_FRONTEND=noninteractive apt-get install -y nodejs && \
+    npm ci --legacy-peer-deps && npm run build
 
 ENV PORT=80 UPDATE_DATA=false
 EXPOSE 80
 
 RUN node_modules/typescript/bin/tsc
 
+# Copy common directory to dist for runtime access
+RUN cp -r common dist/
+
+# Change working directory to dist for runtime
+WORKDIR /app/src/dist
+
 ENTRYPOINT ["/usr/bin/node"]
 CMD ["./backend/app.js"]

Procfile

@@ -1 +1 @@
-web: node app.js
+web: npx tsx backend/app.ts

README.md

@@ -4,19 +4,19 @@
 
 To build this project, you must have the following dependencies installed:
 
-- node 10.16.3
-- yarn
+- Node v22
+- NPM
 
 ## Installation
 
 ```sh
-yarn
+npm install
 ```
 
 ## Developing
 
 ```sh
-yarn start
+npm run dev
 ```
 
 ### If you wish to use backend server API, you need to have redis running locally on port 6379 (default for redis)
@@ -27,7 +27,7 @@ yarn start
 brew install redis
 ```
 
-(Other install directions can be found here: https://redis.io/download)
+(Other install directions can be found [here](https://redis.io/download))
 
 Make sure it's running
 
@@ -38,17 +38,25 @@ brew services start redis
 Once you have redis installed, start this command
 
 ```sh
-yarn run start:backend
+npm run start:backend
 ```
 
 It will create a proxy to `browser-sync` server started by gulp at
 `http://localhost:5000`
 
 ### Connecting to Big Query
-Connecting to Big Query is not required for running the backend (if you run with UPDATE_DATA=false), but is required for things like catching up ledger data in redis.
 
-This project is pulling from SDF's `crypto-stellar` public data set, so no special credentials are required. However you will need a Google Cloud Platform project with a service account to be able to access Big Query.
+Connecting to Big Query is not required for running the backend (if you run with
+UPDATE_DATA=false), but is required for things like catching up ledger data in
+redis.
 
-Directions for creating a service account [can be found here](https://cloud.google.com/docs/authentication/getting-started).
+This project is pulling from SDF's `crypto-stellar` public data set, so no
+special credentials are required. However you will need a Google Cloud Platform
+project with a service account to be able to access Big Query.
 
-Once you've created a service account, add the service account key json file to the `gcloud` folder under the name `service-account.json`. An example json file shows what the file structure should look like.
+Directions for creating a service account
+[can be found here](https://cloud.google.com/docs/authentication/getting-started).
+
+Once you've created a service account, add the service account key json file to
+the `gcloud` folder under the name `service-account.json`. An example json file
+shows what the file structure should look like.

backend/app.ts

@@ -1,8 +1,3 @@
-// need to manually import regeneratorRuntime for babel w/ async
-// https://github.com/babel/babel/issues/9849#issuecomment-487040428
-// require("regenerator-runtime/runtime");
-import "regenerator-runtime/runtime";
-
 import "dotenv/config";
 
 // Run backend with cache updates.

backend/ledgers.ts

@@ -1,4 +1,4 @@
-import stellarSdk from "stellar-sdk";
+import { Horizon } from "@stellar/stellar-sdk";
 import { findIndex } from "lodash";
 import { Response, NextFunction } from "express";
 
@@ -64,7 +64,7 @@ export async function updateLedgers() {
 
   await catchup(REDIS_LEDGER_KEY, pagingToken, REDIS_PAGING_TOKEN_KEY, 0);
 
-  const horizon = new stellarSdk.Server("https://horizon.stellar.org");
+  const horizon = new Horizon.Server("https://horizon.stellar.org");
   horizon
     .ledgers()
     .cursor(CURSOR_NOW)
@@ -82,7 +82,7 @@ export async function catchup(
   pagingTokenKey: string,
   limit: number, // if 0, catchup until now
 ) {
-  const horizon = new stellarSdk.Server("https://horizon.stellar.org");
+  const horizon = new Horizon.Server("https://horizon.stellar.org");
   let ledgers: LedgerRecord[] = [];
   let total = 0;
   let pagingToken = pagingTokenStart;