feat: add version to bottom of settings

src/components/layout/ExternalLink.tsx

@@ -3,9 +3,9 @@ import { ParentComponent } from "solid-js";
 export const ExternalLink: ParentComponent<{ href: string }> = (props) => {
     return (
         <a target="_blank" rel="noopener noreferrer" href={props.href}>
-            {props.children}{" "}
+            {props.children}
             <svg
-                class="inline-block"
+                class="inline-block pl-0.5"
                 width="16"
                 height="16"
                 fill="none"

src/i18n/en/translations.ts

@@ -188,6 +188,7 @@ export default {
         debug_tools: "DEBUG TOOLS",
         danger_zone: "Danger zone",
         general: "General",
+        version: "Version:",
         admin: {
             title: "Admin Page",
             caption: "Our internal debug tools. Use wisely!",

src/routes/settings/index.tsx

@@ -5,10 +5,12 @@ import forward from "~/assets/icons/forward.svg";
 import {
     BackLink,
     DefaultMain,
+    ExternalLink,
     LargeHeader,
     NavBar,
     SafeArea,
     SettingsCard,
+    TinyText,
     VStack
 } from "~/components";
 import { useI18n } from "~/i18n/context";
@@ -62,6 +64,12 @@ function SettingsLinkList(props: {
 export default function Settings() {
     const i18n = useI18n();
     const [state, _actions] = useMegaStore();
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    const RELEASE_VERSION = import.meta.env.__RELEASE_VERSION__;
+    // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+    // @ts-ignore
+    const COMMIT_HASH = import.meta.env.__COMMIT_HASH__;
 
     return (
         <SafeArea>
@@ -151,6 +159,16 @@ export default function Settings() {
                         ]}
                     />
                 </VStack>
+                <div class="flex justify-center">
+                    <TinyText>
+                        {i18n.t("settings.version")} {RELEASE_VERSION}{" "}
+                        <ExternalLink
+                            href={`https://github.com/MutinyWallet/mutiny-web/commits/${COMMIT_HASH}`}
+                        >
+                            {COMMIT_HASH}
+                        </ExternalLink>
+                    </TinyText>
+                </div>
             </DefaultMain>
             <NavBar activeTab="settings" />
         </SafeArea>

vite.config.ts

@@ -6,6 +6,9 @@ import autoprefixer from "autoprefixer";
 import tailwindcss from "tailwindcss";
 
 import * as path from "path";
+import * as child from "child_process";
+
+const commitHash = child.execSync("git rev-parse --short HEAD").toString().trim();
 
 const pwaOptions: Partial<VitePWAOptions> = {
     base: "/",
@@ -49,6 +52,10 @@ export default defineConfig({
         }
     },
     plugins: [wasm(), solid({ ssr: false }), VitePWA(pwaOptions)],
+    define: {
+        "import.meta.env.__COMMIT_HASH__": JSON.stringify(commitHash),
+        "import.meta.env.__RELEASE_VERSION__": JSON.stringify(process.env.npm_package_version)
+    },
     resolve: {
         alias: [{ find: "~", replacement: path.resolve(__dirname, "./src") }]
     },