Improve Terms of Service

Signed-off-by: Thomas Citharel <tcit@tcit.fr>

js/src/views/About/Terms.vue

@@ -0,0 +1,57 @@
+<template>
+  <div class="container section">
+    <h2 class="title">{{ $t("Terms") }}</h2>
+    <div class="content" v-html="config.terms.bodyHtml" />
+  </div>
+</template>
+
+<script lang="ts">
+import { Component, Vue, Watch } from "vue-property-decorator";
+import { TERMS } from "@/graphql/config";
+import { IConfig } from "@/types/config.model";
+import { InstanceTermsType } from "@/types/admin.model";
+
+@Component({
+  apollo: {
+    config: {
+      query: TERMS,
+      variables() {
+        return {
+          locale: this.locale,
+        };
+      },
+      skip() {
+        return !this.locale;
+      },
+    },
+  },
+})
+export default class Terms extends Vue {
+  config!: IConfig;
+
+  locale: string | null = null;
+
+  created() {
+    this.locale = this.$i18n.locale;
+  }
+
+  @Watch("config", { deep: true })
+  watchConfig(config: IConfig) {
+    if (config.terms.type) {
+      console.log(this.config.terms);
+      this.redirectToUrl();
+    }
+  }
+
+  redirectToUrl() {
+    if (this.config.terms.type === InstanceTermsType.URL) {
+      window.location.replace(this.config.terms.url);
+    }
+  }
+}
+</script>
+<style lang="scss" scoped>
+.content /deep/ li {
+  margin-bottom: 1rem;
+}
+</style>