From 8fbcef7ac89ebedf6614f05c6f429a33a86de5d7 Mon Sep 17 00:00:00 2001
From: leiyre <leire@recogn.ai>
Date: Mon, 14 Mar 2022 12:11:23 +0100
Subject: [PATCH] feat(#1180): show Rubrix version in the webapp (#1243)

This PR show Rubrix version in the user menu
Closes #1180

* get version from API

* Rubrix info model

(cherry picked from commit d341db7638141d7cc55cd6851dba6c6eec313b6a)
---
 .../components/commons/header/user/user.vue   | 18 +++++++++--
 frontend/database/index.js                    |  5 ++--
 frontend/database/modules/info.js             | 27 +++++++++++++++++
 frontend/models/RubrixInfo.js                 | 30 +++++++++++++++++++
 4 files changed, 76 insertions(+), 4 deletions(-)
 create mode 100644 frontend/database/modules/info.js
 create mode 100644 frontend/models/RubrixInfo.js

diff --git a/frontend/components/commons/header/user/user.vue b/frontend/components/commons/header/user/user.vue
index d19a5157f2..0aa5d9dc7a 100644
--- a/frontend/components/commons/header/user/user.vue
+++ b/frontend/components/commons/header/user/user.vue
@@ -46,6 +46,7 @@
         <p class="user__workspace__name">{{ workspace }}</p>
       </a>
       <a class="user__logout" href="#" @click.prevent="logout"> Log out </a>
+      <span class="copyright">© 2022 Rubrix ({{ rubrixVersion }})</span>
     </div>
   </div>
 </template>
@@ -57,6 +58,7 @@ export default {
   data: () => {
     return {
       visibleSelector: false,
+      rubrixVersion: undefined,
     };
   },
   computed: {
@@ -67,9 +69,12 @@ export default {
       return currentWorkspace(this.$route);
     },
   },
+  async fetch() {
+    this.rubrixVersion = await this.getRubrixVersion();
+  },
   methods: {
     ...mapActions({
-      fetchDatasets: "entities/datasets/fetchAll",
+      getRubrixVersion: "entities/rubrix-info/getRubrixVersion",
     }),
     firstChar(name) {
       return name.charAt(0);
@@ -132,7 +137,7 @@ $buttonSize: 30px;
     @include font-size(12px);
     font-weight: 600;
     color: palette(grey, medium);
-    padding: 1.2em;
+    padding: 1.2em 1.2em 0.8em 1.2em;
     box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.5);
     min-width: 200px;
     a {
@@ -183,4 +188,13 @@ $buttonSize: 30px;
     }
   }
 }
+.copyright {
+  display: block;
+  @include font-size(11px);
+  text-transform: uppercase;
+  font-weight: 400;
+  color: palette(grey, dark);
+  line-height: 1em;
+  margin-top: 1em;
+}
 </style>
diff --git a/frontend/database/index.js b/frontend/database/index.js
index 4978e73df4..5a46307fac 100644
--- a/frontend/database/index.js
+++ b/frontend/database/index.js
@@ -20,12 +20,13 @@ import { Database } from "@vuex-orm/core";
 import { Pagination, DatasetViewSettings } from "@/models/DatasetViewSettings";
 import { Notification } from "@/models/Notifications";
 import { AnnotationProgress } from "@/models/AnnotationProgress";
-
+import { RubrixInfo } from "@/models/RubrixInfo";
 import { ObservationDataset } from "@/models/Dataset";
 import { Text2TextDataset } from "@/models/Text2Text";
 import { TextClassificationDataset } from "@/models/TextClassification";
 import { TokenClassificationDataset } from "@/models/TokenClassification";
 
+import info from "@/database/modules/info";
 import datasets from "@/database/modules/datasets";
 
 import text_classification from "@/database/modules/text_classification";
@@ -39,7 +40,7 @@ database.register(DatasetViewSettings);
 database.register(Pagination);
 database.register(AnnotationProgress);
 database.register(Notification, notifications);
-
+database.register(RubrixInfo, info);
 database.register(ObservationDataset, datasets);
 database.register(Text2TextDataset);
 database.register(TextClassificationDataset, text_classification);
diff --git a/frontend/database/modules/info.js b/frontend/database/modules/info.js
new file mode 100644
index 0000000000..9617e06295
--- /dev/null
+++ b/frontend/database/modules/info.js
@@ -0,0 +1,27 @@
+/*
+ * coding=utf-8
+ * Copyright 2021-present, the Recognai S.L. team.
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { RubrixInfo } from "@/models/RubrixInfo";
+
+const actions = {
+  async getRubrixVersion() {
+    const { response } = await RubrixInfo.api().get("_info");
+    return response.data.rubrix_version;
+  },
+};
+export default {
+  actions,
+};
diff --git a/frontend/models/RubrixInfo.js b/frontend/models/RubrixInfo.js
new file mode 100644
index 0000000000..88ac443bd6
--- /dev/null
+++ b/frontend/models/RubrixInfo.js
@@ -0,0 +1,30 @@
+/*
+ * coding=utf-8
+ * Copyright 2021-present, the Recognai S.L. team.
+ *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ */
+
+import { Model } from "@vuex-orm/core";
+
+class RubrixInfo extends Model {
+  static entity = "rubrix-info";
+
+  static fields() {
+    return {
+      version: this.string(null),
+    };
+  }
+}
+
+export { RubrixInfo };