feat: render app version in bottom-left footer

src/App.vue

@@ -3,6 +3,7 @@ import { useRoute } from "vue-router";
 import TopBar from "@/components/TopBar/TopBar.vue";
 import SpinnerComponent from "@/components/ui/SpinnerComponent.vue";
 import ToasterComponent from "@/components/ui/ToasterComponent.vue";
+import VersionFooter from "@/components/ui/VersionFooter.vue";
 import { init, useOnboard } from "@web3-onboard/vue";
 import injectedModule from "@web3-onboard/injected-wallets";
 import { Networks, DEFAULT_NETWORK } from "@/config/networks";
@@ -53,5 +54,6 @@ if (!connectedWallet) {
       </template>
     </RouterView>
     <ToasterComponent :targetNetwork="targetNetwork" />
+    <VersionFooter />
   </main>
 </template>

src/components/ui/VersionFooter.vue

@@ -0,0 +1,13 @@
+<script setup lang="ts">
+const version = typeof __APP_VERSION__ !== "undefined" ? __APP_VERSION__ : "dev";
+</script>
+
+<template>
+  <div
+    class="fixed bottom-2 left-2 text-xs font-mono text-gray-50/40 hover:text-gray-50/80 transition-opacity pointer-events-none select-none z-10"
+    :title="`P2Pix ${version}`"
+    aria-label="Application version"
+  >
+    v{{ version }}
+  </div>
+</template>

vite.config.ts

@@ -6,18 +6,26 @@ import vue from "@vitejs/plugin-vue";
 import vueJsx from "@vitejs/plugin-vue-jsx";
 import svgLoader from "vite-svg-loader";
 
-function getGitTag(): string {
+function sh(cmd: string): string {
   try {
-    const tags = execSync("git tag --sort=-version:refname")
+    return execSync(cmd, { stdio: ["ignore", "pipe", "ignore"] })
       .toString()
-      .trim()
+      .trim();
-      .split("\n");
+  } catch {
-    return tags.length > 0 ? tags[0] : "unknown";
-  } catch (fallbackError) {
     return "";
   }
 }
 
+function getAppVersion(): string {
+  const tag = sh("git tag --sort=-version:refname").split("\n")[0] || "";
+  const shortSha = sh("git rev-parse --short HEAD");
+  const tagSha = tag ? sh(`git rev-list -n 1 ${tag}`) : "";
+  const headSha = sh("git rev-parse HEAD");
+  if (tag && tagSha === headSha) return tag;
+  if (tag && shortSha) return `${tag}+${shortSha}`;
+  return shortSha || "dev";
+}
+
 // https://vitejs.dev/config/
 export default defineConfig({
   base: "./",
@@ -25,7 +33,7 @@ export default defineConfig({
     target: "esnext",
   },
   define: {
-    __APP_VERSION__: JSON.stringify(getGitTag()),
+    __APP_VERSION__: JSON.stringify(getAppVersion()),
   },
   optimizeDeps: {
     esbuildOptions: {