feat: display GeoStyler version

and change language menu
geostyler · Jun 18, 2024 · 092e5d5 · 092e5d5
1 parent 5399327
commit 092e5d5
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 11 deletions.
diff --git a/src/App.tsx b/src/App.tsx
@@ -91,7 +91,7 @@ export const App: React.FC = () => {
     const qgisStyleParser = new QgisStyleParser();
 
     const ctx: GeoStylerContextInterface = {
-        locale
+        locale,
     };
 
     return (
@@ -139,6 +139,12 @@ export const App: React.FC = () => {
                 </div>
 
                 <footer className="gs-footer">
+                    <span className="geostyler-version">
+                        <a href={`https://github.com/geostyler/geostyler/releases/tag/v${GEOSTYLER_VERSION}`}>
+                            GeoStyler v{GEOSTYLER_VERSION}
+                        </a>
+                    </span>
+
                     <Form layout="inline" className="lang-form">
                         <Form.Item label={locale.language}>
                             <Select
@@ -149,23 +155,23 @@ export const App: React.FC = () => {
                                 }}
                                 options={[
                                     {
-                                        label: '🇨🇳 Chinese (中文)',
+                                        label: '🇨🇳 中文',
                                         value: 'ch-zn',
                                     },
                                     {
                                         label: '🇺🇸 English',
                                         value: 'en',
                                     },
                                     {
-                                        label: '🇩🇪 German',
+                                        label: '🇩🇪 Deutsch',
                                         value: 'de',
                                     },
                                     {
-                                        label: '🇪🇸 Spanish',
+                                        label: '🇪🇸 Español',
                                         value: 'es',
                                     },
                                     {
-                                        label: '🇫🇷 French',
+                                        label: '🇫🇷 Français',
                                         value: 'fr',
                                     },
                                 ]}

diff --git a/src/assets/styles/App.scss b/src/assets/styles/App.scss
@@ -4,7 +4,9 @@
     font-style: normal;
     font-weight: 400;
     src: url('../fonts/aldrich/aldrich-v8-latin-regular.eot'); /* IE9 Compat Modes */
-    src: local('Aldrich Regular'), local('Aldrich-Regular'),
+    src:
+        local('Aldrich Regular'),
+        local('Aldrich-Regular'),
         url('../fonts/aldrich/aldrich-v8-latin-regular.eot?#iefix') format('embedded-opentype'),
         /* IE6-IE8 */ url('../fonts/aldrich/aldrich-v8-latin-regular.woff2') format('woff2'),
         /* Super Modern Browsers */ url('../fonts/aldrich/aldrich-v8-latin-regular.woff') format('woff'),
@@ -66,12 +68,16 @@ header.gs-header {
 }
 
 footer.gs-footer {
+    grid-area: footer;
+    min-height: 42px;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
     background-color: #bec4e3;
     border-top: 3px solid #162162;
-    min-height: 42px;
-    padding: 0.6em;
+    font-family: 'Aldrich', sans-serif;
 
-    form.lang-form {
-        float: right;
+    .geostyler-version {
+        margin: 0 10px;
     }
 }
diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts
@@ -1 +1,3 @@
 /// <reference types="vite/client" />
+
+declare const GEOSTYLER_VERSION: string;
diff --git a/vite.config.ts b/vite.config.ts
@@ -1,7 +1,11 @@
 import react from '@vitejs/plugin-react';
 import { defineConfig } from 'vite';
+import packageLockJson from './package-lock.json';
 
 // https://vitejs.dev/config/
 export default defineConfig({
-    plugins: [react()]
+    plugins: [react()],
+    define: {
+        GEOSTYLER_VERSION: JSON.stringify(packageLockJson.packages['node_modules/geostyler'].version),
+    }
 });
Original file line number	Diff line number	Diff line change
		@@ -1 +1,3 @@
		/// <reference types="vite/client" />

		declare const GEOSTYLER_VERSION: string;