diff --git a/platypush/backend/http/webapp/src/Utils.vue b/platypush/backend/http/webapp/src/Utils.vue index 95d637c25..bafc3aa87 100644 --- a/platypush/backend/http/webapp/src/Utils.vue +++ b/platypush/backend/http/webapp/src/Utils.vue @@ -4,6 +4,7 @@ import Clipboard from "@/utils/Clipboard"; import Cookies from "@/utils/Cookies"; import DateTime from "@/utils/DateTime"; import Events from "@/utils/Events"; +import Integrations from "@/utils/Integrations"; import Notification from "@/utils/Notification"; import Screen from "@/utils/Screen"; import Text from "@/utils/Text"; @@ -18,6 +19,7 @@ export default { DateTime, Events, Notification, + Integrations, Screen, Text, Types, diff --git a/platypush/backend/http/webapp/src/components/Nav.vue b/platypush/backend/http/webapp/src/components/Nav.vue index 41e76adfe..b41871434 100644 --- a/platypush/backend/http/webapp/src/components/Nav.vue +++ b/platypush/backend/http/webapp/src/components/Nav.vue @@ -36,7 +36,7 @@ <img :src="icons[name].imgUrl" v-else-if="icons[name]?.imgUrl" alt="name"/> <i class="fas fa-puzzle-piece" v-else /> </span> - <span class="name" v-if="!collapsed" v-text="name == 'entities' ? 'Home' : name" /> + <span class="name" v-if="!collapsed" v-text="displayName(name)" /> </a> </li> </ul> @@ -112,6 +112,15 @@ export default { this.$emit('select', name) this.collapsed = this.isMobile() ? true : this.collapsedDefault }, + + displayName(name) { + if (name === 'entities') + return 'Home' + if (name === 'execute') + return 'Execute' + + return name + }, }, data() { @@ -256,9 +265,9 @@ nav { .icon { margin-right: 0; - & img { - width: 1.25em; - height: 1.25em; + & img, i { + width: 1.5em; + height: 1.5em; } } } diff --git a/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue b/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue index 048f0c975..0f7648b9a 100644 --- a/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue +++ b/platypush/backend/http/webapp/src/components/panels/Entities/Index.vue @@ -39,7 +39,7 @@ </span> <span class="section center"> - <div class="title" v-text="group.name" /> + <div class="title" v-text="pluginDisplayName(group.name)" /> </span> <span class="section right"> diff --git a/platypush/backend/http/webapp/src/utils/Integrations.vue b/platypush/backend/http/webapp/src/utils/Integrations.vue new file mode 100644 index 000000000..0a55f9361 --- /dev/null +++ b/platypush/backend/http/webapp/src/utils/Integrations.vue @@ -0,0 +1,18 @@ +<script> +export default { + name: "Integrations", + methods: { + pluginDisplayName(name) { + const words = name.split('.') + words.forEach((word, idx) => { + words[idx] = word.charAt(0).toUpperCase() + word.slice(1) + }) + + if (words.length > 1) + words[0] = `[${words[0]}]` + + return words.join(' ') + }, + } +} +</script>