diff --git a/frontend/vue/components/Stations/Profile/BackendPanel.vue b/frontend/vue/components/Stations/Profile/BackendPanel.vue
index 4674703bd..bfc637990 100644
--- a/frontend/vue/components/Stations/Profile/BackendPanel.vue
+++ b/frontend/vue/components/Stations/Profile/BackendPanel.vue
@@ -4,8 +4,7 @@
             <h3 class="card-title">
                 <translate key="lang_profile_backend_title">AutoDJ Service</translate>
 
-                <small class="badge badge-pill badge-success" v-if="np.services.backend_running" key="lang_profile_backend_running" v-translate>Running</small>
-                <small class="badge badge-pill badge-danger" v-else key="lang_profile_backend_not_running" v-translate>Not Running</small>
+                <running-badge :running="np.services.backend_running"></running-badge>
                 <br>
                 <small>{{ backendName }}</small>
             </h3>
@@ -42,6 +41,7 @@
 <script>
 import {BACKEND_LIQUIDSOAP} from '~/components/Entity/RadioAdapters.js';
 import Icon from '~/components/Common/Icon';
+import RunningBadge from "./Common/RunningBadge.vue";
 
 export const profileBackendProps = {
     props: {
@@ -61,7 +61,7 @@ export const profileBackendProps = {
 
 export default {
     inheritAttrs: false,
-    components: {Icon},
+    components: {RunningBadge, Icon},
     mixins: [profileBackendProps],
     props: {
         np: Object
diff --git a/frontend/vue/components/Stations/Profile/Common/EnabledBadge.vue b/frontend/vue/components/Stations/Profile/Common/EnabledBadge.vue
new file mode 100644
index 000000000..388f89177
--- /dev/null
+++ b/frontend/vue/components/Stations/Profile/Common/EnabledBadge.vue
@@ -0,0 +1,26 @@
+<template>
+    <small class="badge badge-pill ml-2" :class="badgeClass">{{ badgeText }}</small>
+</template>
+
+<script setup>
+import {computed} from "vue";
+import {useGettext} from "vue3-gettext";
+
+const props = defineProps({
+    enabled: Boolean
+});
+
+const badgeClass = computed(() => {
+    return (props.enabled)
+        ? 'badge-success'
+        : 'badge-danger';
+});
+
+const {$gettext} = useGettext();
+
+const badgeText = computed(() => {
+    return (props.enabled)
+        ? $gettext('Enabled')
+        : $gettext('Disabled');
+});
+</script>
diff --git a/frontend/vue/components/Stations/Profile/Common/RunningBadge.vue b/frontend/vue/components/Stations/Profile/Common/RunningBadge.vue
new file mode 100644
index 000000000..122d9c51e
--- /dev/null
+++ b/frontend/vue/components/Stations/Profile/Common/RunningBadge.vue
@@ -0,0 +1,26 @@
+<template>
+    <small class="badge badge-pill ml-2" :class="badgeClass">{{ badgeText }}</small>
+</template>
+
+<script setup>
+import {computed} from "vue";
+import {useGettext} from "vue3-gettext";
+
+const props = defineProps({
+    running: Boolean
+});
+
+const badgeClass = computed(() => {
+    return (props.running)
+        ? 'badge-success'
+        : 'badge-danger';
+});
+
+const {$gettext} = useGettext();
+
+const badgeText = computed(() => {
+    return (props.running)
+        ? $gettext('Running')
+        : $gettext('Not Running');
+});
+</script>
diff --git a/frontend/vue/components/Stations/Profile/FrontendPanel.vue b/frontend/vue/components/Stations/Profile/FrontendPanel.vue
index ed6f4af0b..0ca33b7bb 100644
--- a/frontend/vue/components/Stations/Profile/FrontendPanel.vue
+++ b/frontend/vue/components/Stations/Profile/FrontendPanel.vue
@@ -3,8 +3,8 @@
         <div class="card-header bg-primary-dark">
             <h3 class="card-title">
                 <translate key="lang_frontend_title">Broadcasting Service</translate>
-                <small class="badge badge-pill badge-success" v-if="np.services.frontend_running" key="lang_frontend_running">Running</small>
-                <small class="badge badge-pill badge-danger" v-else key="lang_frontend_not_running">Not Running</small>
+
+                <running-badge :running="np.services.frontend_running"></running-badge>
                 <br>
                 <small>{{ frontendName }}</small>
             </h3>
@@ -96,6 +96,7 @@
 import {FRONTEND_ICECAST, FRONTEND_SHOUTCAST} from '~/components/Entity/RadioAdapters.js';
 import CopyToClipboardButton from '~/components/Common/CopyToClipboardButton';
 import Icon from '~/components/Common/Icon';
+import RunningBadge from "./Common/RunningBadge.vue";
 
 export const profileFrontendProps = {
     props: {
@@ -114,7 +115,7 @@ export const profileFrontendProps = {
 
 export default {
     inheritAttrs: false,
-    components: {Icon, CopyToClipboardButton},
+    components: {RunningBadge, Icon, CopyToClipboardButton},
     mixins: [profileFrontendProps],
     props: {
         np: Object
diff --git a/frontend/vue/components/Stations/Profile/PublicPagesPanel.vue b/frontend/vue/components/Stations/Profile/PublicPagesPanel.vue
index f9258b0fb..0a2ef1e59 100644
--- a/frontend/vue/components/Stations/Profile/PublicPagesPanel.vue
+++ b/frontend/vue/components/Stations/Profile/PublicPagesPanel.vue
@@ -4,7 +4,7 @@
             <div class="card-header bg-primary-dark">
                 <h3 class="card-title">
                     <translate key="lang_profile_public_title">Public Pages</translate>
-                    <small class="badge badge-pill badge-success" key="lang_profile_public_enabled" v-translate>Enabled</small>
+                    <enabled-badge :enabled="true"></enabled-badge>
                 </h3>
             </div>
             <table class="table table-striped table-responsive-md mb-0">
@@ -61,7 +61,7 @@
             <div class="card-header bg-primary-dark">
                 <h3 class="card-title">
                     <translate key="lang_profile_public_title">Public Pages</translate>
-                    <small class="badge badge-pill badge-danger" key="lang_profile_public_disabled" v-translate>Disabled</small>
+                    <enabled-badge :enabled="false"></enabled-badge>
                 </h3>
             </div>
             <div class="card-actions" v-if="userCanManageProfile">
@@ -77,6 +77,7 @@
 <script>
 import EmbedModal, {profileEmbedModalProps} from './EmbedModal';
 import Icon from '~/components/Common/Icon';
+import EnabledBadge from "./Common/EnabledBadge.vue";
 
 export const profilePublicProps = {
     props: {
@@ -98,7 +99,7 @@ export const profilePublicProps = {
 
 export default {
     inheritAttrs: false,
-    components: {Icon, EmbedModal},
+    components: {EnabledBadge, Icon, EmbedModal},
     mixins: [profilePublicProps, profileEmbedModalProps],
     computed: {
         langDisablePublicPages() {
diff --git a/frontend/vue/components/Stations/Profile/RequestsPanel.vue b/frontend/vue/components/Stations/Profile/RequestsPanel.vue
index 45b3f1936..c154b2e98 100644
--- a/frontend/vue/components/Stations/Profile/RequestsPanel.vue
+++ b/frontend/vue/components/Stations/Profile/RequestsPanel.vue
@@ -4,7 +4,7 @@
             <div class="card-header bg-primary-dark">
                 <h3 class="card-title">
                     <translate key="lang_profile_requests_title">Song Requests</translate>
-                    <small class="badge badge-pill badge-success" key="lang_profile_requests_enabled" v-translate>Enabled</small>
+                    <enabled-badge :enabled="true"></enabled-badge>
                 </h3>
             </div>
             <div class="card-actions" v-if="userCanManageReports || userCanManageProfile">
@@ -22,7 +22,7 @@
             <div class="card-header bg-primary-dark">
                 <h3 class="card-title">
                     <translate key="lang_profile_requests_title">Song Requests</translate>
-                    <small class="badge badge-pill badge-danger" key="lang_profile_requests_disabled" v-translate>Disabled</small>
+                    <enabled-badge :enabled="false"></enabled-badge>
                 </h3>
             </div>
             <div class="card-actions" v-if="userCanManageProfile">
@@ -37,6 +37,7 @@
 
 <script>
 import Icon from '~/components/Common/Icon';
+import EnabledBadge from "./Common/EnabledBadge.vue";
 
 export const profileRequestsProps = {
     props: {
@@ -50,7 +51,7 @@ export const profileRequestsProps = {
 
 export default {
     inheritAttrs: false,
-    components: {Icon},
+    components: {EnabledBadge, Icon},
     mixins: [profileRequestsProps],
     computed: {
         langDisableRequests() {
diff --git a/frontend/vue/components/Stations/Profile/StreamersPanel.vue b/frontend/vue/components/Stations/Profile/StreamersPanel.vue
index 59f1293aa..e040f4567 100644
--- a/frontend/vue/components/Stations/Profile/StreamersPanel.vue
+++ b/frontend/vue/components/Stations/Profile/StreamersPanel.vue
@@ -4,7 +4,7 @@
             <div class="card-header bg-primary-dark">
                 <h3 class="card-title">
                     <translate key="lang_profile_streamers_title">Streamers/DJs</translate>
-                    <small class="badge badge-pill badge-success" key="lang_profile_streamers_enabled" v-translate>Enabled</small>
+                    <enabled-badge :enabled="true"></enabled-badge>
                 </h3>
             </div>
             <div class="card-actions" v-if="userCanManageStreamers || userCanManageProfile">
@@ -22,7 +22,7 @@
             <div class="card-header bg-primary-dark">
                 <h3 class="card-title">
                     <translate key="lang_profile_streamers_title">Streamers/DJs</translate>
-                    <small class="badge badge-pill badge-danger" key="lang_profile_streamers_disabled" v-translate>Disabled</small>
+                    <enabled-badge :enabled="false"></enabled-badge>
                 </h3>
             </div>
             <div class="card-actions" v-if="userCanManageProfile">
@@ -37,6 +37,7 @@
 
 <script>
 import Icon from '~/components/Common/Icon';
+import EnabledBadge from "./Common/EnabledBadge.vue";
 
 export const profileStreamersProps = {
     props: {
@@ -50,7 +51,7 @@ export const profileStreamersProps = {
 
 export default {
     inheritAttrs: false,
-    components: {Icon},
+    components: {EnabledBadge, Icon},
     mixins: [profileStreamersProps],
     computed: {
         langDisableStreamers() {