diff --git a/changes/changelog.d/1012.enhancement b/changes/changelog.d/1012.enhancement new file mode 100644 index 0000000000000000000000000000000000000000..ae47d6dc642f6c05d25f3b29a96553a17c5e3d3c --- /dev/null +++ b/changes/changelog.d/1012.enhancement @@ -0,0 +1 @@ +Changed footer to use instance name if available, and append ellipses if instance URL/Name is too long (#1012) \ No newline at end of file diff --git a/front/src/components/Footer.vue b/front/src/components/Footer.vue index d758b456bf9edaea8b6af87efe6e349a7e640778..3b2442831c335dae014cbece1ce4e6ab0af9966d 100644 --- a/front/src/components/Footer.vue +++ b/front/src/components/Footer.vue @@ -3,8 +3,11 @@ <div class="ui container"> <div class="ui stackable equal height stackable grid"> <section class="four wide column"> - <h4 class="ui header"> - <translate translate-context="Footer/About/Title" :translate-params="{instanceName: instanceHostname}" >About %{instanceName}</translate> + <h4 v-if="podName" class="ui header ellipsis"> + <translate translate-context="Footer/About/Title" :translate-params="{instanceName: podName}" >About %{instanceName}</translate> + </h4> + <h4 v-else class="ui header ellipsis"> + <translate translate-context="Footer/About/Title" :translate-params="{instanceUrl: instanceHostname}" >About %{instanceUrl}</translate> </h4> <div class="ui link list"> <router-link class="item" to="/about"> @@ -71,13 +74,18 @@ import Vue from "vue" import { mapState } from "vuex" import axios from 'axios' +import _ from '@/lodash' export default { props: ["version"], computed: { ...mapState({ - messages: state => state.ui.messages + messages: state => state.ui.messages, + nodeinfo: state => state.instance.nodeinfo, }), + podName() { + return _.get(this.nodeinfo, 'metadata.nodeName') + }, instanceHostname() { let url = this.$store.state.instance.instanceUrl let parser = document.createElement("a")