Add UI version to UI via docker. Fixes #263 (#278)

* Add UI version to UI via docker. Fixes #263

* Adding git fetch tags to CI.

.drone.yml

@@ -14,6 +14,7 @@ steps:
       - apk add git
       - git submodule init
       - git submodule update --recursive --remote
+      - git fetch --tags
 
   - name: yarn
     image: node:14-alpine
@@ -110,6 +111,7 @@ steps:
       - apk add git
       - git submodule init
       - git submodule update --recursive --remote
+      - git fetch --tags
     when:
       ref:
         - refs/heads/main

Dockerfile

@@ -16,6 +16,10 @@ COPY generate_translations.js \
 
 COPY lemmy-translations lemmy-translations
 COPY src src
+COPY .git .git
+
+# Set UI version 
+RUN echo "export const VERSION = '$(git describe --tag)';" > "src/shared/version.ts"
 
 RUN yarn
 RUN yarn build:prod

src/shared/components/footer.tsx

@@ -3,6 +3,7 @@ import { Link } from "inferno-router";
 import { i18n } from "../i18next";
 import { repoUrl, joinLemmyUrl, docsUrl } from "../utils";
 import { GetSiteResponse } from "lemmy-js-client";
+import { VERSION } from "../version";
 
 interface FooterProps {
   site: GetSiteResponse;
@@ -19,7 +20,10 @@ export class Footer extends Component<FooterProps, any> {
         <div className="navbar-collapse">
           <ul class="navbar-nav ml-auto">
             <li class="nav-item">
-              <span class="navbar-text">{this.props.site.version}</span>
+              <span class="nav-link">UI: {VERSION}</span>
+            </li>
+            <li class="nav-item">
+              <span class="nav-link">BE: {this.props.site.version}</span>
             </li>
             <li className="nav-item">
               <Link className="nav-link" to="/modlog">

src/shared/components/main.tsx

@@ -263,7 +263,9 @@ export class Main extends Component<any, MainState> {
   get documentTitle(): string {
     return `${
       this.state.siteRes.site_view
-        ? this.state.siteRes.site_view.site.name
+        ? this.state.siteRes.site_view.site.description
+          ? `${this.state.siteRes.site_view.site.name} - ${this.state.siteRes.site_view.site.description}`
+          : this.state.siteRes.site_view.site.name
         : "Lemmy"
     }`;
   }

src/shared/components/navbar.tsx

@@ -181,7 +181,10 @@ export class Navbar extends Component<NavbarProps, NavbarState> {
         <div class="container">
           {this.props.site_res.site_view && (
             <Link
-              title={this.props.site_res.version}
+              title={
+                this.props.site_res.site_view.site.description ||
+                this.props.site_res.site_view.site.name
+              }
               className="d-flex align-items-center navbar-brand mr-md-3"
               to="/"
             >

src/shared/version.ts

@@ -0,0 +1 @@
+export const VERSION = "unknown version";