diff --git a/dashboard/src/views/SupportView.vue b/dashboard/src/views/SupportView.vue
index 1644f6b26..e81f240fd 100644
--- a/dashboard/src/views/SupportView.vue
+++ b/dashboard/src/views/SupportView.vue
@@ -1,6 +1,11 @@
-<script>
+<script setup>
 
-import { fetcher, Button } from 'pankow';
+import { useI18n } from 'vue-i18n';
+const i18n = useI18n();
+const t = i18n.t;
+
+import { computed, ref, onMounted, watch } from 'vue';
+import { fetcher, Button, Switch } from 'pankow';
 import { marked } from 'marked';
 
 import Section from  '../components/Section.vue';
@@ -8,45 +13,31 @@ import Section from  '../components/Section.vue';
 const API_ORIGIN = import.meta.env.VITE_API_ORIGIN ? import.meta.env.VITE_API_ORIGIN : window.location.origin;
 const accessToken = localStorage.token;
 
-export default {
-  name: 'SupportView',
-  components: {
-    Button,
-    Section
-  },
-  data() {
-    return {
-      ready: false,
-      sshSupportEnabled: false,
-      toggleSshSupportError: ''
-    };
-  },
-  computed: {
-    description() {
-      return marked.parse(this.$t('support.help.description', {
-        docsLink: 'https://docs.cloudron.io/?support_view',
-        packagingLink: 'https://docs.cloudron.io/custom-apps/tutorial/?support_view',
-        forumLink: 'https://forum.cloudron.io/'
-      }));
-    }
-  },
-  methods: {
-    async toggleSshSupport() {
-        this.toggleSshSupportError = '';
+const ready = ref(false);
+const sshSupportEnabled = ref(false);
+const toggleSshSupportError = ref('');
 
-        const res = await fetcher.post(`${API_ORIGIN}/api/v1/support/remote_support`, { enable: !this.sshSupportEnabled }, { access_token: accessToken });
-        if (res.status === 412 || res.status === 417) this.toggleSshSupportError = res.body;
-        else if (res.status !== 202) console.error(res.body);
+const description = computed(() => {
+  return marked.parse(t('support.help.description', {
+    docsLink: 'https://docs.cloudron.io/?support_view',
+    packagingLink: 'https://docs.cloudron.io/custom-apps/tutorial/?support_view',
+    forumLink: 'https://forum.cloudron.io/'
+  }));
+});
 
-        this.sshSupportEnabled = !this.sshSupportEnabled;
-    }
-  },
-  async mounted() {
-    const response = await fetcher.get(`${API_ORIGIN}/api/v1/support/remote_support`, { access_token: accessToken });
-    this.sshSupportEnabled = response.body.enabled;
-    this.ready = true;
-  }
-};
+watch(sshSupportEnabled, async (newValue) => {
+  toggleSshSupportError.value = '';
+
+  const res = await fetcher.post(`${API_ORIGIN}/api/v1/support/remote_support`, { enabled: newValue }, { access_token: accessToken });
+  if (res.status === 412 || res.status === 417) toggleSshSupportError.value = res.body;
+  else if (res.status !== 202) console.error(res.body);
+});
+
+onMounted(async () => {
+  const response = await fetcher.get(`${API_ORIGIN}/api/v1/support/remote_support`, { access_token: accessToken });
+  sshSupportEnabled.value = response.body.enabled;
+  ready.value = true;
+});
 
 </script>
 
@@ -66,7 +57,7 @@ export default {
         <br/>
         <br/>
         <b class="pull-left text-danger text-bold" v-show="toggleSshSupportError">{{ toggleSshSupportError }}</b>
-        <Button :danger="sshSupportEnabled ? true : null" @click="toggleSshSupport()">{{ sshSupportEnabled ? $t('support.remoteSupport.disableAction') : $t('support.remoteSupport.enableAction') }}</Button>
+        <Switch v-model="sshSupportEnabled" :label="$t(sshSupportEnabled ? 'main.statusEnabled' : 'main.statusDisabled')" />
       </div>
     </Section>
   </div>