diff --git a/src/components/Banner/BannerSection.vue b/src/components/Banner/BannerSection.vue
index 75ce961..b4cac94 100644
--- a/src/components/Banner/BannerSection.vue
+++ b/src/components/Banner/BannerSection.vue
@@ -76,7 +76,7 @@
       </div>
     </div>
 
-    <!-- <Modal :is-open="isModalOpen" @close-modal="closeModal">
+    <!-- <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
       <template v-slot:title>Delete Pseudonym</template>
       <div class="text-xl">Are you sure you want to delete pseudonym?</div>
       <div class="mt-3 text-lg">
@@ -114,7 +114,7 @@
           Delete
         </button>
       </template>
-    </Modal> -->
+    </ThemedModal> -->
   </div>
 </template>
 
@@ -123,7 +123,7 @@ import { onMounted, watch, ref, computed, nextTick } from 'vue'
 import useStore from '../../composables/global/useStore'
 import { defineAsyncComponent } from '@vue/runtime-core'
 import { TrashIcon, RefreshIcon, LoginIcon, DotsVerticalIcon } from '@heroicons/vue/outline'
-import Modal from '../Shared/Modal.vue'
+import ThemedModal from '../Shared/ThemedModal.vue'
 import { useRoute } from 'vue-router'
 
 const {
diff --git a/src/components/Channels/CreateChannel.vue b/src/components/Channels/CreateChannel.vue
index d2e4b86..ab5fe7c 100644
--- a/src/components/Channels/CreateChannel.vue
+++ b/src/components/Channels/CreateChannel.vue
@@ -9,7 +9,7 @@
     <option value="public">Public</option>
     <option value="private">Private</option>
   </select>
-  <Modal :is-open="isModalOpen" @close-modal="closeModal">
+  <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
     <template #title>Create {{ channelTypeName }} Channel</template>
     <span class="font-semibold">Channel name:</span>
     <div>
@@ -20,7 +20,7 @@
         placeholder="Enter channel name"
       />
     </div>
-    <div class="mt-2">
+    <div class="mt-4">
       <input
         id="disableVoting"
         v-model="disableVoting"
@@ -68,13 +68,13 @@
         Create
       </button>
     </template>
-  </Modal>
+  </ThemedModal>
 </template>
 
 <script setup>
 import { computed, ref } from '@vue/reactivity'
 import useStore from '../../composables/global/useStore'
-import Modal from '../Shared/Modal.vue'
+import ThemedModal from '../Shared/ThemedModal.vue'
 const { getLoggedInStatus, createChannel, getGuestStatus, loadUser } = useStore
 
 const isModalOpen = ref(false)
@@ -89,7 +89,7 @@ const channelTypeName = computed(() => channelType.value[0].toUpperCase() + chan
 
 const isEmailValid = computed(() => {
   if (!email.value || email.value.trim().length === 0) return true
-  return /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/.test(email.value)
+  return /^\w+([.-]?\w+)*@\w+([.-]?\w+)*(\.\w{2,3})+$/.test(email.value)
 })
 
 function closeModal() {
diff --git a/src/components/Channels/DeleteChannel.vue b/src/components/Channels/DeleteChannel.vue
index bf649e1..25d7199 100644
--- a/src/components/Channels/DeleteChannel.vue
+++ b/src/components/Channels/DeleteChannel.vue
@@ -3,7 +3,7 @@
     <TrashIcon class="h-4 w-4" />
     <span class="sr-only">Delete</span>
   </button>
-  <Modal :is-open="isModalOpen" @close-modal="closeModal">
+  <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
     <template #title>Delete Channel</template>
     <div>
       Are you sure you want to delete
@@ -24,13 +24,13 @@
         Delete
       </button>
     </template>
-  </Modal>
+  </ThemedModal>
 </template>
 
 <script setup>
 import { TrashIcon } from '@heroicons/vue/outline'
 import { ref } from '@vue/reactivity'
-import Modal from '../Shared/Modal.vue'
+import ThemedModal from '../Shared/ThemedModal.vue'
 
 defineProps({
   show: {
diff --git a/src/components/Channels/EditChannel.vue b/src/components/Channels/EditChannel.vue
index 3f7818b..eae9277 100644
--- a/src/components/Channels/EditChannel.vue
+++ b/src/components/Channels/EditChannel.vue
@@ -3,7 +3,7 @@
     <PencilIcon class="h-4 w-4" />
     <span class="sr-only">Edit</span>
   </button>
-  <Modal :is-open="isModalOpen" @close-modal="closeModal">
+  <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
     <template #title>Edit Channel</template>
     <span class="font-semibold">Channel name:</span>
     <div>
@@ -60,14 +60,14 @@
         Update
       </button>
     </template>
-  </Modal>
+  </ThemedModal>
 </template>
 
 <script setup>
 import { PencilIcon } from '@heroicons/vue/outline'
 import { computed, ref } from '@vue/reactivity'
 import useStore from '../../composables/global/useStore'
-import Modal from '../Shared/Modal.vue'
+import ThemedModal from '../Shared/ThemedModal.vue'
 const { updateChannel, getGuestStatus } = useStore
 
 const isModalOpen = ref(false)
diff --git a/src/components/Messages/PromptDirtyDraft.vue b/src/components/Messages/PromptDirtyDraft.vue
index 3a56a4a..7fd34cb 100644
--- a/src/components/Messages/PromptDirtyDraft.vue
+++ b/src/components/Messages/PromptDirtyDraft.vue
@@ -1,5 +1,5 @@
 <template>
-  <Modal :is-open="isModalOpen" @close-modal="closeModal">
+  <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
     <template #title>Draft will be lost.</template>
     <div class="font-semibold">
       <p>Are you sure you want to leave?</p>
@@ -19,14 +19,14 @@
         Yes
       </button>
     </template>
-  </Modal>
+  </ThemedModal>
 </template>
 
 <script setup>
 import { TrashIcon } from '@heroicons/vue/outline'
 import { ref } from '@vue/reactivity'
 import { watch } from 'vue'
-import Modal from '../Shared/Modal.vue'
+import ThemedModal from '../Shared/ThemedModal.vue'
 
 const props = defineProps({
   show: {
diff --git a/src/components/Polls/CreatePoll.vue b/src/components/Polls/CreatePoll.vue
new file mode 100644
index 0000000..d27ab3b
--- /dev/null
+++ b/src/components/Polls/CreatePoll.vue
@@ -0,0 +1,74 @@
+<template>
+  <p class="text-gray-600 mb-4">
+    Submit responses and vote on them anonymously. When a response gets enough votes, voters for that response reveal their
+    names.
+  </p>
+  <div class="mb-4">
+    <span class="font-semibold">Poll title:</span>
+    <div>
+      <input v-model="title" class="border rounded border-gray-500 w-full h-12 px-3" type="text" />
+    </div>
+  </div>
+  <div class="mb-4">
+    <span class="font-semibold">Description:</span>
+    <div>
+      <textarea v-model="description" rows="2" class="h-full border rounded border-gray-500 w-full p-3" type="text">
+      </textarea>
+    </div>
+  </div>
+  <div class="mb-4">
+    <p class="font-semibold">End date:</p>
+
+    <!-- Date picker -->
+    <div class="flex max-w-sm border rounded border-gray-500 w-full">
+      <input v-model="expirationDate" class="rounded w-full p-3" type="date" :min="today" />
+    </div>
+  </div>
+  <!-- Error message -->
+  <div class="text-harvard-red mt-2">{{ message }}</div>
+</template>
+
+<script setup>
+import { ref } from '@vue/reactivity'
+import useStore from '../../composables/global/useStore'
+import { useRoute } from 'vue-router'
+
+const { createPoll } = useStore
+const title = ref('')
+const description = ref('')
+const message = ref('')
+const route = useRoute()
+
+const today = new Date().toISOString().split('T')[0]
+const date = new Date()
+date.setDate(date.getDate() + 5)
+const defaultDate = date.toISOString().split('T')[0]
+
+const expirationDate = ref(defaultDate)
+
+defineExpose({
+  processCreate
+})
+
+const emit = defineEmits(['createSuccess'])
+
+function processCreate() {
+  if (!hasTitle()) {
+    message.value = 'A title is required.'
+    return
+  }
+  const expirationDateValue = new Date(expirationDate.value)
+  createPoll({
+    title: title.value,
+    description: description.value,
+    expirationDate: expirationDateValue,
+    topicId: route.params.channelId
+  })
+    .then((x) => emit('createSuccess'))
+    .catch((err) => (message.value = err.response.data.message))
+}
+
+function hasTitle() {
+  return title.value.trim().length > 0
+}
+</script>
diff --git a/src/components/Shared/CreateSpace.vue b/src/components/Shared/CreateSpace.vue
new file mode 100644
index 0000000..542da53
--- /dev/null
+++ b/src/components/Shared/CreateSpace.vue
@@ -0,0 +1,100 @@
+<template>
+  <button
+    v-if="show"
+    class="flex gap-2 justify-start items-center bg-harvard-red text-white p-2 rounded-md shadow-md"
+    @click="openModal"
+  >
+    <PlusCircleIcon class="w-5 h-5" /> new space
+  </button>
+  <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
+    <template #title>New space</template>
+    <!-- Space type tabs -->
+    <ul class="flex flex-wrap text-center text-gray-500 border-b border-gray-200">
+      <li>
+        <button
+          class="flex gap-1 px-4 py-2 rounded-t-lg"
+          :class="tab === 1 ? 'text-harvard-red bg-gray-100 font-bold' : ''"
+          @click="openTab(1)"
+        >
+          <HashtagIcon class="w-5 h-5" />
+          Thread
+        </button>
+      </li>
+      <li>
+        <button
+          class="flex gap-1 px-4 py-2 rounded-t-lg"
+          :class="tab === 2 ? 'text-harvard-red bg-gray-100 font-bold' : ''"
+          @click="openTab(2)"
+        >
+          <UserGroupIcon class="w-5 h-5" />
+          Threshold Poll
+        </button>
+      </li>
+    </ul>
+    <!-- Tab content -->
+    <div v-show="tab === 1" class="py-3 mb-5">
+      <CreateThread ref="createThreadRef" @create-success="closeModal" />
+    </div>
+    <div v-show="tab === 2" class="py-3 mb-5">
+      <CreatePoll ref="createPollRef" @create-success="closeModal" />
+    </div>
+    <!-- Action buttons -->
+    <template #actions>
+      <button
+        class="rounded bg-gray-300 px-2 py-2 font-semibold shadow-sm hover:bg-gray-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
+        @click="closeModal"
+      >
+        Cancel
+      </button>
+      <button
+        class="rounded bg-gray-600 px-2 py-2 font-semibold text-white shadow-sm hover:bg-gray-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
+        @click="onSubmit"
+      >
+        Create
+      </button>
+    </template>
+  </ThemedModal>
+</template>
+
+<script setup>
+import { ref } from '@vue/reactivity'
+import ThemedModal from './ThemedModal.vue'
+import CreateThread from '../Threads/CreateThread.vue'
+import CreatePoll from '../Polls/CreatePoll.vue'
+import { PlusCircleIcon, HashtagIcon, UserGroupIcon } from '@heroicons/vue/outline'
+
+defineProps({
+  show: {
+    type: Boolean,
+    required: true
+  }
+})
+
+const isModalOpen = ref(false)
+const tab = ref(1)
+const createThreadRef = ref(null)
+const createPollRef = ref(null)
+
+function closeModal() {
+  document.querySelector('body').classList.remove('modal-open')
+  isModalOpen.value = false
+}
+
+function openModal() {
+  window.scrollTo({ top: 0, left: 0 })
+  isModalOpen.value = true
+  document.querySelector('body').classList.add('modal-open')
+}
+
+function openTab(tabNumber) {
+  tab.value = tabNumber
+}
+
+function onSubmit() {
+  if (tab.value === 1) {
+    createThreadRef.value.processCreate()
+  } else if (tab.value === 2) {
+    createPollRef.value.processCreate()
+  }
+}
+</script>
diff --git a/src/components/Shared/Modal.vue b/src/components/Shared/ThemedModal.vue
similarity index 92%
rename from src/components/Shared/Modal.vue
rename to src/components/Shared/ThemedModal.vue
index cbe927e..fa7d3fd 100644
--- a/src/components/Shared/Modal.vue
+++ b/src/components/Shared/ThemedModal.vue
@@ -6,7 +6,7 @@
           <slot name="title">Modal Title</slot>
           <XIcon class="mt-1 float-right h-6 w-6 inline-block cursor-pointer" title="Close" @click="closeModal" />
         </div>
-        <div class="flex-grow py-3"><slot>Modal Body</slot></div>
+        <div class="flex-grow"><slot>Modal Body</slot></div>
         <div class="flex justify-end my-3 gap-4">
           <slot name="actions"><button @click="closeModal"></button></slot>
         </div>
@@ -18,7 +18,7 @@
 <script setup>
 import { XIcon } from '@heroicons/vue/outline'
 
-const props = defineProps({
+defineProps({
   isOpen: {
     type: Boolean,
     required: true
diff --git a/src/components/Threads/CreateThread.vue b/src/components/Threads/CreateThread.vue
index e47a2e6..4db8b01 100644
--- a/src/components/Threads/CreateThread.vue
+++ b/src/components/Threads/CreateThread.vue
@@ -1,67 +1,28 @@
 <template>
-  <button v-if="show" class="flex gap-2 justify-start items-center" @click="openModal">
-    <PlusCircleIcon class="w-5 h-5" /> new thread
-  </button>
-  <Modal :is-open="isModalOpen" @close-modal="closeModal">
-    <template #title>Create New Thread</template>
-    <span class="font-semibold">Thread name:</span>
-    <div>
-      <input
-        v-model="threadName"
-        class="border rounded border-gray-500 w-full h-12 px-3 text-lg login-form-field"
-        type="text"
-      />
-    </div>
-    <div class="text-harvard-red">{{ message }}</div>
-    <template #actions>
-      <button
-        class="rounded bg-gray-300 px-2 py-2 font-semibold shadow-sm hover:bg-gray-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
-        @click="closeModal"
-      >
-        Cancel
-      </button>
-      <button
-        class="rounded bg-gray-600 px-2 py-2 font-semibold text-white shadow-sm hover:bg-gray-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-gray-600"
-        @click="processCreate"
-      >
-        Create
-      </button>
-    </template>
-  </Modal>
+  <p class="text-gray-600 mb-4">A pseudonymous chat thread.</p>
+  <span class="font-semibold">Thread name:</span>
+  <div>
+    <input v-model="threadName" class="border rounded border-gray-500 w-full h-12 px-3" type="text" />
+  </div>
+  <!-- Error message -->
+  <div class="text-harvard-red mt-2">{{ message }}</div>
 </template>
 
 <script setup>
 import { ref } from '@vue/reactivity'
 import useStore from '../../composables/global/useStore'
-import Modal from '../Shared/Modal.vue'
 import { useRoute } from 'vue-router'
-import { PlusCircleIcon } from '@heroicons/vue/outline'
-
-defineProps({
-  show: {
-    type: Boolean,
-    required: true
-  }
-})
 
 const { createThread } = useStore
-const isModalOpen = ref(false)
 const threadName = ref('')
 const message = ref('')
 const route = useRoute()
-const path = import.meta.env.VITE_PATH ? import.meta.env.VITE_PATH : ''
 
-function closeModal() {
-  document.querySelector('body').classList.remove('modal-open')
-  isModalOpen.value = false
-}
+defineExpose({
+  processCreate
+})
 
-function openModal() {
-  threadName.value = ''
-  window.scrollTo({ top: 0, left: 0 })
-  isModalOpen.value = true
-  document.querySelector('body').classList.add('modal-open')
-}
+const emit = defineEmits(['createSuccess'])
 
 function processCreate() {
   if (isFormValid()) {
@@ -69,7 +30,7 @@ function processCreate() {
       name: threadName.value,
       topicId: route.params.channelId
     })
-      .then((x) => closeModal())
+      .then((x) => emit('createSuccess'))
       .catch((err) => (message.value = err.response.data.message))
   } else {
     message.value = 'Name is required'
diff --git a/src/components/Threads/DeleteThread.vue b/src/components/Threads/DeleteThread.vue
index 7d839f6..6a1f93d 100644
--- a/src/components/Threads/DeleteThread.vue
+++ b/src/components/Threads/DeleteThread.vue
@@ -3,7 +3,7 @@
     <TrashIcon class="h-4 w-4 inline-block rounded cursor-pointer" />
     <span class="sr-only">Delete</span>
   </button>
-  <Modal :is-open="isModalOpen" @close-modal="closeModal">
+  <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
     <template #title>Delete Thread</template>
     <div>
       Are you sure you want to delete
@@ -25,13 +25,13 @@
         Delete
       </button>
     </template>
-  </Modal>
+  </ThemedModal>
 </template>
 
 <script setup>
 import { TrashIcon } from '@heroicons/vue/outline'
 import { ref } from '@vue/reactivity'
-import Modal from '../Shared/Modal.vue'
+import ThemedModal from '../Shared/ThemedModal.vue'
 import useStore from '../../composables/global/useStore'
 import { useRouter } from 'vue-router'
 
diff --git a/src/components/Threads/EditThread.vue b/src/components/Threads/EditThread.vue
index d5ea1d5..f61588e 100644
--- a/src/components/Threads/EditThread.vue
+++ b/src/components/Threads/EditThread.vue
@@ -9,7 +9,7 @@
     <PencilIcon class="h-4 w-4 inline-block hover:text-black hover:fill-current rounded cursor-pointer" />
     <span class="sr-only">Edit</span>
   </button>
-  <Modal :is-open="isModalOpen" @close-modal="closeModal">
+  <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
     <template #title>Edit Thread</template>
     <span class="font-semibold">Thread name:</span>
     <div>
@@ -44,14 +44,14 @@
         Update
       </button>
     </template>
-  </Modal>
+  </ThemedModal>
 </template>
 
 <script setup>
 import { PencilIcon } from '@heroicons/vue/outline'
 import { computed, ref } from '@vue/reactivity'
 import useStore from '../../composables/global/useStore'
-import Modal from '../Shared/Modal.vue'
+import ThemedModal from '../Shared/ThemedModal.vue'
 const { updateThread, getGuestStatus } = useStore
 
 const isModalOpen = ref(false)
diff --git a/src/composables/global/useStore.js b/src/composables/global/useStore.js
index b734d19..40f136d 100644
--- a/src/composables/global/useStore.js
+++ b/src/composables/global/useStore.js
@@ -1,6 +1,7 @@
 import { reactive, computed } from 'vue'
 import { VueCookieNext } from 'vue-cookie-next'
 import ThreadService from '../../service'
+import PollService from '../../service/poll'
 
 // State
 const state = reactive({
@@ -58,6 +59,10 @@ function setChannels(channels) {
   state.channels = [...channels]
 }
 
+function setMajorError(error) {
+  state.majorError = { ...error }
+}
+
 function removeChannel(id) {
   const index = state.channels.findIndex((x) => x.id === id)
   if (index > -1) {
@@ -93,15 +98,6 @@ function setShowChatOnly(value) {
   state.showChatOnly = value
 }
 
-function addChannel(channel) {
-  const channelId = state.channels.findIndex((x) => x.id === channel.id)
-  if (channelId > -1) {
-    state.channels.splice(channelId, 1, channel)
-  } else {
-    state.channels.push(channel)
-  }
-}
-
 function upsertThread(thread) {
   const threadId = state.threads.findIndex((x) => x.id === thread.id)
   if (threadId > -1) {
@@ -121,7 +117,7 @@ function clearMessages() {
 }
 
 async function createChannel(payload) {
-  const channels = await ThreadService.createChannel(payload)
+  await ThreadService.createChannel(payload)
   loadChannels()
 }
 
@@ -141,7 +137,7 @@ async function deleteChannel(id) {
 }
 
 async function createThread(payload) {
-  const threads = await ThreadService.createThread(payload)
+  await ThreadService.createThread(payload)
 }
 
 async function followThread(payload) {
@@ -162,6 +158,10 @@ async function deleteThread(id) {
   removeThread(id)
 }
 
+async function createPoll(payload) {
+  await PollService.createPoll(payload)
+}
+
 async function loadUser() {
   const user = await ThreadService.getUser(state.uid)
   if (user.pseudonyms) {
@@ -228,7 +228,7 @@ async function postMessage(payload) {
 }
 
 async function upvote(id, status) {
-  const response = await ThreadService.vote({
+  await ThreadService.vote({
     messageId: id,
     direction: 'up',
     status
@@ -241,7 +241,7 @@ async function upvote(id, status) {
  */
 async function downvote(id, status) {
   if (!getGuestStatus.value) {
-    const response = await ThreadService.vote({
+    await ThreadService.vote({
       messageId: id,
       direction: 'down',
       status
@@ -436,6 +436,8 @@ export default {
   getActiveThread,
   upsertThread,
 
+  createPoll,
+
   getChannels,
   getChannel,
   loadChannels,
diff --git a/src/service/poll.js b/src/service/poll.js
new file mode 100644
index 0000000..33ea1ed
--- /dev/null
+++ b/src/service/poll.js
@@ -0,0 +1,17 @@
+import axios from '../plugins/axios'
+
+if ('VITE_API_SERVER_URL' in import.meta.env) {
+  axios.defaults.baseURL = import.meta.env.VITE_API_SERVER_URL + '/' + import.meta.env.VITE_API_VERSION
+} else {
+  axios.defaults.baseURL = ''
+}
+
+export default {
+  createPoll: async function (payload) {
+    return await axios
+      .post('/polls', {
+        ...payload
+      })
+      .then((x) => x.data)
+  }
+}
diff --git a/src/views/ThreadsPage.vue b/src/views/ThreadsPage.vue
index 8584c5f..c9c358e 100644
--- a/src/views/ThreadsPage.vue
+++ b/src/views/ThreadsPage.vue
@@ -33,7 +33,7 @@
           <ThreadList :items="sortedThreads" :toggle-threads-menu="toggleThreadsMenu" />
         </div>
         <div class="flex flex-col gap-1 p-4">
-          <CreateThread :show="canCreate" />
+          <CreateSpace :show="canCreate" />
         </div>
       </div>
       <div class="flex flex-col flex-1 overflow-hidden bg-white shadow sm:rounded-r shrink">
@@ -69,21 +69,21 @@
         <router-view></router-view>
       </div>
     </div>
-    <Modal :is-open="isModalOpen" @close-modal="closeModal">
+    <ThemedModal :is-open="isModalOpen" @close-modal="closeModal">
       <template #title>{{ channel.name }}</template>
       <div class="text-xl"></div>
-    </Modal>
-    <Modal :is-open="isThreadModalOpen" @close-modal="closeThreadModal">
+    </ThemedModal>
+    <ThemedModal :is-open="isThreadModalOpen" @close-modal="closeThreadModal">
       <template #title>{{ maybeThread.name }}</template>
       <div class="text-xl">in the {{ channel.name }} channel</div>
       <div class="mt-3 text-lg">{{ maybeThread.messageCount }} messages</div>
-    </Modal>
+    </ThemedModal>
   </div>
 </template>
 
 <script setup>
 import ThreadList from '../components/Threads/ThreadList.vue'
-import CreateThread from '../components/Threads/CreateThread.vue'
+import CreateSpace from '../components/Shared/CreateSpace.vue'
 import useStore from '../composables/global/useStore'
 import DeleteThread from '../components/Threads/DeleteThread.vue'
 import EditThread from '../components/Threads/EditThread.vue'
@@ -94,7 +94,7 @@ import { VueCookieNext } from 'vue-cookie-next'
 import DeleteChannel from '../components/Channels/DeleteChannel.vue'
 import EditChannel from '../components/Channels/EditChannel.vue'
 import { ViewListIcon, XIcon } from '@heroicons/vue/outline'
-import Modal from '../components/Shared/Modal.vue'
+import ThemedModal from '../components/Shared/ThemedModal.vue'
 
 const route = useRoute()
 
@@ -185,13 +185,13 @@ function compare(a, b) {
   } else return 1
 }
 
-const sortedThreads = computed(() => threadsWithFollow.value.sort(compare))
+const sortedThreads = computed(() => [...threadsWithFollow.value].sort(compare))
 
 // Add isFollowed property to update if the thread is followed by user
 const threadsWithFollow = computed(() =>
   items.value.map((x) => ({
     ...x,
-    isFollowed: getUserThreads.value.some((y) => y.id === x.id && y.hasOwnProperty('followed') && y.followed)
+    isFollowed: getUserThreads.value.some((y) => y.id === x.id && 'followed' in y && y.followed)
   }))
 )