Add commit hash to the build

.github/workflows/push.yml

@@ -33,6 +33,10 @@ jobs:
 
       - name: Lint
         run: pnpm lint
+      - name: Set git commit sha
+        id: revparse
+        run: |
+          echo "COMMIT_HASH=$(git rev-parse --short HEAD)" >> $GITHUB_ENV
       - name: Build
         run: pnpm build
 
@@ -93,6 +97,10 @@ jobs:
     if: github.event_name == 'push' && (startsWith(github.event.ref, 'refs/tags/') || startsWith(github.event.ref, 'refs/heads/v0.') || github.event.ref == 'refs/heads/master' || github.event.ref == 'refs/heads/test')
     steps:
       - uses: actions/checkout@v3
+      - name: Set git commit sha
+        id: revparse
+        run: |
+          echo "COMMIT_HASH=$(git rev-parse --short HEAD)" >> $GITHUB_ENV
 
       - name: Cache Docker layers
         uses: actions/cache@v3
@@ -147,6 +155,8 @@ jobs:
           labels: ${{ steps.docker_meta.outputs.labels }}
           cache-from: type=gha
           cache-to: type=gha
+          build-args: |
+            COMMIT_HASH=${{ env.COMMIT_HASH }}
 
       - name: Image digest
         run: echo ${{ steps.docker_build.outputs.digest }}

Dockerfile

@@ -1,3 +1,5 @@
+ARG COMMIT_SHA=""
+
 FROM --platform=$BUILDPLATFORM node:alpine AS builder
 WORKDIR /app
 

package.json

@@ -28,22 +28,22 @@
   "private": true,
   "license": "MIT",
   "dependencies": {
-    "@babel/runtime": "7.20.7",
+    "@babel/runtime": "7.20.13",
-    "@fontsource/roboto-mono": "4.5.8",
+    "@fontsource/roboto-mono": "4.5.10",
     "@reach/menu-button": "0.18.0",
     "@reach/tooltip": "0.18.0",
     "@reach/visually-hidden": "0.18.0",
-    "@tanstack/react-query": "4.22.0",
+    "@tanstack/react-query": "4.24.2",
-    "chart.js": "4.1.2",
+    "chart.js": "4.2.0",
     "clsx": "^1.2.1",
-    "core-js": "3.27.1",
+    "core-js": "3.27.2",
     "date-fns": "2.29.3",
-    "framer-motion": "8.4.6",
+    "framer-motion": "8.5.4",
     "history": "5.3.0",
     "i18next": "22.4.9",
     "i18next-browser-languagedetector": "7.0.1",
     "i18next-http-backend": "2.1.1",
-    "immer": "9.0.18",
+    "immer": "9.0.19",
     "invariant": "^2.2.4",
     "lodash-es": "^4.17.21",
     "memoize-one": "6.0.0",
@@ -54,8 +54,8 @@
     "react-i18next": "12.1.4",
     "react-icons": "4.7.1",
     "react-modal": "3.16.1",
-    "react-router": "6.6.2",
+    "react-router": "6.8.0",
-    "react-router-dom": "6.6.2",
+    "react-router-dom": "6.8.0",
     "react-switch": "^7.0.0",
     "react-table": "7.8.0",
     "react-tabs": "6.0.0",
@@ -64,7 +64,7 @@
     "recoil": "0.7.6",
     "regenerator-runtime": "0.13.11",
     "reselect": "4.1.7",
-    "tslib": "2.4.1",
+    "tslib": "2.5.0",
     "use-asset": "1.0.4",
     "workbox-core": "6.5.4",
     "workbox-expiration": "6.5.4",
@@ -73,27 +73,27 @@
     "workbox-strategies": "6.5.4"
   },
   "devDependencies": {
-    "@fontsource/inter": "4.5.14",
+    "@fontsource/inter": "4.5.15",
     "@types/invariant": "2.2.35",
     "@types/lodash-es": "4.17.6",
-    "@types/react": "18.0.26",
+    "@types/react": "18.0.27",
     "@types/react-dom": "18.0.10",
     "@types/react-modal": "3.13.1",
     "@types/react-window": "1.8.5",
-    "@typescript-eslint/eslint-plugin": "5.48.2",
+    "@typescript-eslint/eslint-plugin": "5.49.0",
-    "@typescript-eslint/parser": "5.48.2",
+    "@typescript-eslint/parser": "5.49.0",
     "@vitejs/plugin-react": "3.0.1",
     "autoprefixer": "10.4.13",
-    "eslint": "8.32.0",
+    "eslint": "8.33.0",
     "eslint-config-airbnb-base": "15.0.0",
     "eslint-config-prettier": "8.6.0",
     "eslint-config-react-app": "7.0.1",
     "eslint-plugin-flowtype": "8.0.3",
     "eslint-plugin-import": "2.27.5",
     "eslint-plugin-jsx-a11y": "6.7.1",
-    "eslint-plugin-react": "7.32.1",
+    "eslint-plugin-react": "7.32.2",
     "eslint-plugin-react-hooks": "4.6.0",
-    "eslint-plugin-simple-import-sort": "^9.0.0",
+    "eslint-plugin-simple-import-sort": "^10.0.0",
     "postcss": "8.4.21",
     "postcss-import": "15.1.0",
     "postcss-simple-vars": "^7.0.1",

src/app.tsx

@@ -50,3 +50,7 @@ swRegistration.register();
 console.log('Checkout the repo: https://github.com/haishanh/yacd');
 // eslint-disable-next-line
 console.log('Version:', __VERSION__);
+if (__COMMIT_HASH__) {
+  // eslint-disable-next-line
+  console.log('Commit hash:', __COMMIT_HASH__);
+}

src/custom.d.ts

@@ -16,12 +16,13 @@ interface Window {
   i18n: any;
 }
 
-// webpack definePlugin replacing variables
 declare const __VERSION__: string;
+declare const __COMMIT_HASH__: string;
 declare const process = {
   env: {
     NODE_ENV: string,
     PUBLIC_URL: string,
+    COMMIT_HASH: string,
   },
 };
 

tsconfig.json

@@ -20,5 +20,5 @@
     "noEmit": true,
     "jsx": "react"
   },
-  "include": ["./src"]
+  "include": ["./src", "vite.config.ts"]
 }

vite.config.ts

@@ -1,39 +1,82 @@
-import { defineConfig } from 'vite';
-import { VitePWA } from 'vite-plugin-pwa';
 import react from '@vitejs/plugin-react'
 import * as path from 'path';
+import { defineConfig } from 'vite';
+import { VitePWA } from 'vite-plugin-pwa';
+
 import * as pkg from './package.json';
 
 // https://vitejs.dev/config/
-export default defineConfig(({ mode }) => ({
+export default defineConfig(async ({ mode }) => {
-  define: {
+  let hash = process.env.COMMIT_HASH;
-    __VERSION__: JSON.stringify(pkg.version),
+  if (!hash) {
-    'process.env.NODE_ENV': JSON.stringify(mode),
+    try {
-    'process.env.PUBLIC_URL': JSON.stringify('./'),
+      hash = await gitHash();
-  },
+    } catch (e) { }
-  base: './',
+  }
-  resolve: {
+  if (!hash) hash = '';
-    alias: {
+
-      $src: path.resolve(__dirname, './src'),
+  return {
-      src: path.resolve(__dirname, './src'),
+    define: {
+      __VERSION__: JSON.stringify(pkg.version),
+      __COMMIT_HASH__: JSON.stringify(hash),
+      'process.env.NODE_ENV': JSON.stringify(mode),
+      'process.env.PUBLIC_URL': JSON.stringify('./'),
     },
-  },
+    base: './',
-  publicDir: 'assets',
+    resolve: {
-  build: {
+      alias: {
-    // sourcemap: true,
+        $src: path.resolve(__dirname, './src'),
-    // the default value is 'dist'
+        src: path.resolve(__dirname, './src'),
-    // which make more sense
+      },
-    // but change this may break other people's tools
+    },
-    outDir: 'public',
+    publicDir: 'assets',
-  },
+    build: {
-  plugins: [
+      // sourcemap: true,
-    react(),
+      // the default value is 'dist'
-    VitePWA({
+      // which make more sense
-      srcDir: 'src',
+      // but change this may break other people's tools
       outDir: 'public',
-      filename: 'sw.ts',
+    },
-      strategies: 'injectManifest',
+    plugins: [
-      base: './',
+      react(),
-    }),
+      VitePWA({
-  ],
+        srcDir: 'src',
-}));
+        outDir: 'public',
+        filename: 'sw.ts',
+        strategies: 'injectManifest',
+        base: './',
+      }),
+    ],
+  }
+});
+
+// non vite stuff
+
+async function gitHash() {
+  try {
+    const mod = await import('node:child_process');
+    return await run(mod.spawn, 'git', ['rev-parse', '--short', 'HEAD']);
+  } catch (e) {
+    return;
+  }
+}
+
+function run(spawn: typeof import('node:child_process').spawn, cmd0: string, args0: string[]): Promise<string> {
+  const cmd = cmd0;
+  const args = args0;
+
+  return new Promise((resolve, reject) => {
+    const proc = spawn(cmd, args);
+    let out = Buffer.from('');
+    proc.stdout.on('data', (data) => {
+      out += data;
+    });
+    proc.on('error', (err) => {
+      reject(err);
+    });
+    proc.on('exit', (code) => {
+      if (code !== 0) reject(code);
+      resolve(out.toString());
+    });
+  });
+}