diff --git a/src/components/CardWidget.vue b/src/components/CardWidget.vue
index b622128..710ef71 100644
--- a/src/components/CardWidget.vue
+++ b/src/components/CardWidget.vue
@@ -4,6 +4,7 @@
     footer-tag="footer"
     no-body
     class="mb-4 card-custom"
+    :class="highlighted ? 'highlight' : ''"
   >
     <div v-if="loading" class="card-custom-loading-bar"></div>
     <!-- <template v-slot:header></template> -->
@@ -92,6 +93,10 @@ const props = defineProps({
     type: String,
     default: '',
   },
+  highlighted: {
+    type: Boolean,
+    default: false,
+  },
   status: {
     type: Object as PropType<
       | {
diff --git a/src/components/ChannelSelector.vue b/src/components/ChannelSelector.vue
new file mode 100644
index 0000000..2396111
--- /dev/null
+++ b/src/components/ChannelSelector.vue
@@ -0,0 +1,228 @@
+<template>
+  <b-modal
+    id="channel-selector-modal"
+    ref="mainModal"
+    centered
+    hide-footer
+    scrollable
+  >
+    <template #modal-header>
+      <div class="px-2 px-sm-3 pt-2 d-flex justify-content-between w-100">
+        <h3>features</h3>
+        <!-- Emulate built in modal header close button action -->
+        <a
+          href="#"
+          class="align-self-center"
+          @click.stop.prevent="closeFunction"
+        >
+          <svg
+            width="18"
+            height="18"
+            viewBox="0 0 18 18"
+            fill="none"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              fill-rule="evenodd"
+              clip-rule="evenodd"
+              d="M13.6003 4.44197C13.3562 4.19789 12.9605 4.19789 12.7164 4.44197L9.02116 8.1372L5.32596 4.442C5.08188 4.19792 4.68615 4.19792 4.44207 4.442C4.198 4.68607 4.198 5.0818 4.44207 5.32588L8.13728 9.02109L4.44185 12.7165C4.19777 12.9606 4.19777 13.3563 4.44185 13.6004C4.68592 13.8445 5.08165 13.8445 5.32573 13.6004L9.02116 9.90497L12.7166 13.6004C12.9607 13.8445 13.3564 13.8445 13.6005 13.6004C13.8446 13.3563 13.8446 12.9606 13.6005 12.7165L9.90505 9.02109L13.6003 5.32585C13.8444 5.08178 13.8444 4.68605 13.6003 4.44197Z"
+              fill="#6c757d"
+            />
+          </svg>
+        </a>
+      </div>
+    </template>
+    <p v-if="!supportedChannels.includes(selected)">
+      You are currently receiving these updates: {{ selected }}. If you choose
+      another one, you can not go back to your current variant from the
+      dashboard.
+    </p>
+    <div class="card-grid" :class="columnClass">
+      <card-widget
+        :highlighted="selected === 'stable'"
+        header="Stability: "
+        :status="{text: 'Most stable', variant: 'success', blink: false}"
+        title="stable"
+        sub-title="The most stable features"
+      >
+        <div class="px-3 px-lg-4 pb-3 channel-info">
+          <ul>
+            <li>All stable features</li>
+            <li>Stable apps with all security updates</li>
+            <li>Less bugs</li>
+            <li>Mostly stable</li>
+          </ul>
+          <b-button
+            v-if="selected !== 'stable'"
+            variant="primary"
+            class="channel-button"
+            @click="selectChannel('stable')"
+            >Select this variant</b-button
+          >
+          <b-button v-else variant="success" disabled class="channel-button"
+            >Current variant</b-button
+          >
+        </div>
+      </card-widget>
+      <card-widget
+        :highlighted="selected === 'beta'"
+        header="Stability: "
+        :status="{text: 'Preview', variant: 'primary', blink: false}"
+        title="beta"
+        sub-title="Early access to new features"
+      >
+        <div class="px-3 px-lg-4 pb-3 channel-info">
+          <ul>
+            <li>Latest features</li>
+            <li>New apps</li>
+            <li>Earlier app updates</li>
+            <li>May have more bugs</li>
+          </ul>
+          <b-button
+            v-if="selected !== 'beta'"
+            variant="primary"
+            class="channel-button"
+            @click="selectChannel('beta')"
+            >Select this variant</b-button
+          >
+          <b-button v-else variant="success" disabled class="channel-button"
+            >Current variant</b-button
+          >
+        </div>
+      </card-widget>
+      <card-widget
+        :highlighted="selected === 'core-ln'"
+        header="Stability: "
+        :status="{text: 'Experimental', variant: 'warning', blink: false}"
+        title="core lightning"
+        sub-title="An alternative Lightning backend"
+      >
+        <div class="px-3 px-lg-4 pb-3 channel-info">
+          <ul>
+            <li>More Lightning-related features like bolt12</li>
+            <li>Less available apps</li>
+            <li>Unstable, bugs will occur</li>
+            <li>Wallet and channels can not be migrated</li>
+          </ul>
+          <b-button
+            v-if="selected !== 'core-ln'"
+            variant="primary"
+            class="channel-button"
+            @click="selectChannel('core-ln')"
+            >Select this variant</b-button
+          >
+          <b-button v-else variant="success" disabled class="channel-button"
+            >Current variant</b-button
+          >
+        </div>
+      </card-widget>
+    </div>
+  </b-modal>
+</template>
+
+<script lang="ts" setup>
+import {watch, ref, nextTick, onUpdated} from 'vue';
+import CardWidget from './CardWidget.vue';
+import useSystemStore from '../store/system';
+import useToast from '../utils/toast';
+import delay from '../helpers/delay';
+
+const systemStore = useSystemStore();
+const toast = useToast();
+const supportedChannels = ['stable', 'beta', 'c-lightning'];
+const emit = defineEmits(['close-modal']);
+
+const mainModal = ref<null | {show: () => void; hide: () => void}>();
+const selected = ref<'stable' | 'beta' | 'core-ln'>('stable');
+const props = defineProps({
+  showModal: {
+    type: Boolean,
+    required: true,
+  },
+});
+
+const columnClass = ref('grid-1-column');
+
+const getCorrectSize = () => {
+  const width = document.querySelector('#channel-selector-modal .modal-content')
+    ?.clientWidth as number;
+  if (width > 900) {
+    columnClass.value = 'grid-3-column';
+  } else if (width > 600) {
+    columnClass.value = 'grid-2-column';
+  } else {
+    columnClass.value = 'grid-1-column';
+  }
+};
+
+watch([props], async () => {
+  if (props.showModal) {
+    mainModal.value?.show();
+    await nextTick();
+    await nextTick();
+    getCorrectSize();
+    window.addEventListener('resize', getCorrectSize);
+  } else {
+    mainModal.value?.hide();
+    window.removeEventListener('resize', getCorrectSize);
+  }
+});
+
+function selectChannel(channel: 'stable' | 'beta' | 'core-ln') {
+  selected.value = channel;
+  systemStore.setUpdateChannel(channel);
+  toast.success(
+    'Update channel set successfully',
+    "You'll now receive updates from this channel",
+  );
+  delay(3000).then(() => {
+    // The manager will be rebooting in the background.
+    window.location.reload();
+  });
+}
+
+systemStore.getUpdateChannel().then(() => {
+  if (['stable', 'beta', 'core-ln'].includes(systemStore.updateChannel)) {
+    selected.value = systemStore.updateChannel as 'stable' | 'beta' | 'core-ln';
+  }
+});
+
+onUpdated(() => {
+  getCorrectSize();
+});
+
+function closeFunction() {
+  emit('close-modal');
+}
+</script>
+<style lang="scss" scoped>
+.card-grid {
+  display: grid;
+}
+
+.grid-1-column {
+  grid-template-columns: 1fr;
+}
+
+.grid-2-column {
+  grid-template-columns: 1fr 1fr;
+}
+.grid-3-column {
+  grid-template-columns: 1fr 1fr 1fr;
+}
+
+.channel-button {
+  width: 100%;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  height: 3rem;
+  border-top-left-radius: 0px;
+  border-top-right-radius: 0px;
+}
+
+.channel-info {
+  // 3rem for the button and 1 to leave some more space
+  margin-bottom: 4rem;
+}
+</style>
diff --git a/src/global-styles/custom.scss b/src/global-styles/custom.scss
index 318576d..b66a0da 100644
--- a/src/global-styles/custom.scss
+++ b/src/global-styles/custom.scss
@@ -233,6 +233,12 @@ button {
   &:hover {
     box-shadow: var(--card-shadow-hover);
   }
+  &.highlight {
+    box-shadow: var(--card-shadow), 0 0 0 3px var(--bs-primary);
+    &:hover {
+      box-shadow: var(--card-shadow-hover), 0 0 0 3px var(--bs-primary);
+    }
+  }
   border: none !important;
   outline: 0 !important;
   // Loading bar safari bug https://gist.github.com/ayamflow/b602ab436ac9f05660d9c15190f4fd7b
@@ -915,3 +921,8 @@ html[data-theme='dark'] {
 .btn svg {
   width: 24px;
 }
+
+.card-grid {
+  display: grid;
+  grid-column-gap: 1rem;
+}
diff --git a/src/store/apps.ts b/src/store/apps.ts
index dc6c61d..c65a86a 100644
--- a/src/store/apps.ts
+++ b/src/store/apps.ts
@@ -51,7 +51,7 @@ export default defineStore('apps', {
 
       const poll = window.setInterval(async () => {
         await this.getInstalledApps();
-        const index = this.installed.findIndex((app) => app.id === appId);
+        const index = this.installed.findIndex((app) => app?.id === appId);
         if (index === -1) {
           this.uninstalling.splice(this.uninstalling.indexOf(appId), 1);
           window.clearInterval(poll);
@@ -64,7 +64,7 @@ export default defineStore('apps', {
 
       const poll = window.setInterval(async () => {
         await this.getInstalledApps();
-        const index = this.installed.findIndex((app) => app.id === appId);
+        const index = this.installed.findIndex((app) => app?.id === appId);
         if (index !== -1) {
           this.installing.splice(this.installing.indexOf(appId), 1);
           window.clearInterval(poll);
diff --git a/src/views/Settings.vue b/src/views/Settings.vue
index 4165818..3ca3aee 100644
--- a/src/views/Settings.vue
+++ b/src/views/Settings.vue
@@ -186,7 +186,6 @@
                     :success="isCorrectOtp"
                     :error="isIncorrectOtp"
                     @otp-token="setTotpToken"
-                    @keyup="hideOtpError"
                   />
                 </div>
                 <div class="py-2"></div>
@@ -202,7 +201,7 @@
                   <small class="text-danger error">Incorrect password</small>
                 </div>
 
-                <div v-show="isIncorrectTotp" class="my-2 text-center">
+                <div v-show="isIncorrectOtp" class="my-2 text-center">
                   <small class="text-danger error">Incorrect code</small>
                 </div>
 
@@ -498,6 +497,27 @@
             </b-modal>
           </div>
         </div>
+        <div class="pt-0">
+          <div class="d-flex w-100 justify-content-between px-3 px-lg-4 mb-4">
+            <div>
+              <span class="d-block">Features</span>
+              <small class="d-block" style="opacity: 0.4"
+                >Manage features you want</small
+              >
+            </div>
+            <b-button
+              variant="outline-primary"
+              size="sm"
+              @click="openChannelModal"
+              >Manage</b-button
+            >
+            <channel-selector
+              size="xl"
+              :show-modal="showChannelSelectorModal"
+              @close-modal="closeChannelModal"
+            />
+          </div>
+        </div>
         <div class="px-3 px-lg-4 pb-4">
           <div class="w-100 d-flex justify-content-between mb-1">
             <span class="align-self-end">Citadel Version</span>
@@ -582,6 +602,7 @@ import useSystemStore from '../store/system';
 import useUserStore from '../store/user';
 import {defineComponent, DefineComponent} from 'vue';
 import useToast from '../utils/toast';
+import ChannelSelector from '../components/ChannelSelector.vue';
 
 export default defineComponent({
   components: {
@@ -599,6 +620,7 @@ export default defineComponent({
     BIconCheckCircleFill,
     BellIcon: BellIcon as DefineComponent,
     RefreshIcon: RefreshIcon as DefineComponent,
+    ChannelSelector,
   },
   setup() {
     const sdkStore = useSdkStore();
@@ -622,6 +644,7 @@ export default defineComponent({
       loadingDebug: false,
       debugFailed: false,
       showDmesg: false,
+      showChannelSelectorModal: false,
       authenticatorToken: '',
     } as {
       currentPassword: string;
@@ -639,6 +662,9 @@ export default defineComponent({
       showDmesg: boolean;
       authenticatorToken: string;
       pollUpdateStatus?: number;
+      isCorrectOtp: boolean;
+      isIncorrectOtp: boolean;
+      showChannelSelectorModal: boolean;
     };
   },
   computed: {
@@ -654,9 +680,11 @@ export default defineComponent({
       if (typeof this.systemStore.debugStatus === 'string') {
         return 'Error loading data!';
       }
-      return this.showDmesg
-        ? this.systemStore.debugStatus.dmesg
-        : this.systemStore.debugStatus.debug;
+      return (
+        this.showDmesg
+          ? this.systemStore.debugStatus.dmesg
+          : this.systemStore.debugStatus.debug
+      ) as string;
     },
     debugFilename(): string {
       const type: string = this.showDmesg ? 'dmesg' : 'debug';
@@ -698,7 +726,7 @@ export default defineComponent({
     }
   },
   methods: {
-    setTotpToken(totpToken) {
+    setTotpToken(totpToken: string) {
       this.totpToken = totpToken;
     },
     async enableTwoFactorAuth() {
@@ -768,7 +796,7 @@ export default defineComponent({
     async changePassword() {
       this.isChangingPassword = true;
       this.isIncorrectPassword = false;
-      this.isIncorrectTotp = false;
+      this.isIncorrectOtp = false;
 
       try {
         await this.sdkStore.citadel.manager.auth.changePassword(
@@ -788,7 +816,7 @@ export default defineComponent({
         const isIncorrectTotp = errorString.includes('Incorrect 2FA code');
 
         this.isIncorrectPassword = isIncorrectPassword;
-        this.isIncorrectTotp = isIncorrectTotp;
+        this.isIncorrectOtp = isIncorrectTotp;
 
         this.isChangingPassword = false;
         return;
@@ -838,6 +866,12 @@ export default defineComponent({
       this.loadingDebug = false;
       (this.$refs['debug-modal'] as {hide: () => void}).hide();
     },
+    async openChannelModal() {
+      this.showChannelSelectorModal = true;
+    },
+    closeChannelModal() {
+      this.showChannelSelectorModal = false;
+    },
     downloadTextFile(contents: string, fileName: string) {
       const blob = new Blob([contents], {
         type: 'text/plain;charset=utf-8;',