diff --git a/packages/hoppscotch-common/src/App.vue b/packages/hoppscotch-common/src/App.vue
index 8cf3e8e26..02dc8613b 100644
--- a/packages/hoppscotch-common/src/App.vue
+++ b/packages/hoppscotch-common/src/App.vue
@@ -18,6 +18,7 @@ import { HOPP_MODULES } from "@modules/."
 import { isLoadingInitialRoute } from "@modules/router"
 import { useI18n } from "@composables/i18n"
 import { APP_IS_IN_DEV_MODE } from "@helpers/dev"
+import { platform } from "./platform"
 
 const t = useI18n()
 
@@ -45,4 +46,5 @@ if (APP_IS_IN_DEV_MODE) {
 
 // Run module root component setup code
 HOPP_MODULES.forEach((mod) => mod.onRootSetup?.())
+platform.addedHoppModules?.forEach((mod) => mod.onRootSetup?.())
 </script>
diff --git a/packages/hoppscotch-common/src/components/app/ActionHandler.vue b/packages/hoppscotch-common/src/components/app/ActionHandler.vue
index ff4a28271..e408d9673 100644
--- a/packages/hoppscotch-common/src/components/app/ActionHandler.vue
+++ b/packages/hoppscotch-common/src/components/app/ActionHandler.vue
@@ -17,7 +17,6 @@ import { pipe } from "fp-ts/function"
 import * as TE from "fp-ts/TaskEither"
 import { deleteTeam as backendDeleteTeam } from "~/helpers/backend/mutations/Team"
 import { defineActionHandler, invokeAction } from "~/helpers/actions"
-import { showChat } from "~/modules/crisp"
 import { useToast } from "~/composables/toast"
 import { useI18n } from "~/composables/i18n"
 
@@ -62,10 +61,6 @@ defineActionHandler("modals.login.toggle", () => {
   showLogin.value = !showLogin.value
 })
 
-defineActionHandler("flyouts.chat.open", () => {
-  showChat()
-})
-
 defineActionHandler("modals.team.delete", ({ teamId }) => {
   teamID.value = teamId
   confirmRemove.value = true
diff --git a/packages/hoppscotch-common/src/components/app/Footer.vue b/packages/hoppscotch-common/src/components/app/Footer.vue
index 040289322..394fcc366 100644
--- a/packages/hoppscotch-common/src/components/app/Footer.vue
+++ b/packages/hoppscotch-common/src/components/app/Footer.vue
@@ -76,6 +76,7 @@
                   }
                 "
               />
+              <!--
               <HoppSmartItem
                 ref="chat"
                 :icon="IconMessageCircle"
@@ -88,20 +89,34 @@
                   }
                 "
               />
-              <HoppSmartItem
-                :icon="IconGift"
-                :label="`${t('app.whats_new')}`"
-                to="https://docs.hoppscotch.io/documentation/changelog"
-                blank
-                @click="hide()"
-              />
-              <HoppSmartItem
-                :icon="IconActivity"
-                :label="t('app.status')"
-                to="https://status.hoppscotch.io"
-                blank
-                @click="hide()"
-              />
+              -->
+              <template
+                v-for="footerItem in platform.ui?.additonalFooterMenuItems"
+                :key="footerItem.id"
+              >
+                <template v-if="footerItem.action.type === 'link'">
+                  <HoppSmartItem
+                    :icon="footerItem.icon"
+                    :label="footerItem.text(t)"
+                    :to="footerItem.action.href"
+                    blank
+                    @click="hide()"
+                  />
+                </template>
+                <HoppSmartItem
+                  v-else
+                  :icon="footerItem.icon"
+                  :label="footerItem.text(t)"
+                  blank
+                  @click="
+                    () => {
+                      // @ts-expect-error TypeScript not understanding the type
+                      footerItem.action.do()
+                      hide()
+                    }
+                  "
+                />
+              </template>
               <hr />
               <HoppSmartItem
                 :icon="IconGithub"
@@ -207,15 +222,11 @@ import IconColumns from "~icons/lucide/columns"
 import IconSidebarOpen from "~icons/lucide/sidebar-open"
 import IconShieldCheck from "~icons/lucide/shield-check"
 import IconBook from "~icons/lucide/book"
-import IconMessageCircle from "~icons/lucide/message-circle"
-import IconGift from "~icons/lucide/gift"
-import IconActivity from "~icons/lucide/activity"
 import IconGithub from "~icons/lucide/github"
 import IconTwitter from "~icons/lucide/twitter"
 import IconUserPlus from "~icons/lucide/user-plus"
 import IconLock from "~icons/lucide/lock"
 import IconLifeBuoy from "~icons/lucide/life-buoy"
-import { showChat } from "@modules/crisp"
 import { useSetting } from "@composables/settings"
 import { useI18n } from "@composables/i18n"
 import { useReadonlyStream } from "@composables/stream"
@@ -262,10 +273,6 @@ const nativeShare = () => {
   }
 }
 
-const chatWithUs = () => {
-  showChat()
-}
-
 const showDeveloperOptionModal = () => {
   if (currentUser.value) {
     showDeveloperOptions.value = true
diff --git a/packages/hoppscotch-common/src/components/app/Options.vue b/packages/hoppscotch-common/src/components/app/Options.vue
index 4834c03fb..108b46470 100644
--- a/packages/hoppscotch-common/src/components/app/Options.vue
+++ b/packages/hoppscotch-common/src/components/app/Options.vue
@@ -30,105 +30,37 @@
         <h2 class="p-4 font-semibold font-bold text-secondaryDark">
           {{ t("support.title") }}
         </h2>
-        <HoppSmartItem
-          :icon="IconBook"
-          :label="t('app.documentation')"
-          to="https://docs.hoppscotch.io"
-          :description="t('support.documentation')"
-          :info-icon="IconChevronRight"
-          active
-          blank
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconGift"
-          :label="t('app.whats_new')"
-          to="https://docs.hoppscotch.io/documentation/changelog"
-          :description="t('support.changelog')"
-          :info-icon="IconChevronRight"
-          active
-          blank
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconActivity"
-          :label="t('app.status')"
-          to="https://status.hoppscotch.io"
-          blank
-          :description="t('app.status_description')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconLock"
-          :label="`${t('app.terms_and_privacy')}`"
-          to="https://docs.hoppscotch.io/support/privacy"
-          blank
-          :description="t('app.terms_and_privacy')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
-        <h2 class="p-4 font-semibold font-bold text-secondaryDark">
-          {{ t("settings.follow") }}
-        </h2>
-        <HoppSmartItem
-          :icon="IconDiscord"
-          :label="t('app.discord')"
-          to="https://hoppscotch.io/discord"
-          blank
-          :description="t('app.join_discord_community')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconTwitter"
-          :label="t('app.twitter')"
-          to="https://hoppscotch.io/twitter"
-          blank
-          :description="t('support.twitter')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconGithub"
-          :label="`${t('app.github')}`"
-          to="https://github.com/hoppscotch/hoppscotch"
-          blank
-          :description="t('support.github')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconMessageCircle"
-          :label="t('app.chat_with_us')"
-          :description="t('support.chat')"
-          :info-icon="IconChevronRight"
-          active
-          @click="chatWithUs()"
-        />
-        <HoppSmartItem
-          :icon="IconUserPlus"
-          :label="`${t('app.invite')}`"
-          :description="t('shortcut.miscellaneous.invite')"
-          :info-icon="IconChevronRight"
-          active
-          @click="expandInvite()"
-        />
-        <HoppSmartItem
-          v-if="navigatorShare"
-          v-tippy="{ theme: 'tooltip' }"
-          :icon="IconShare2"
-          :label="`${t('request.share')}`"
-          :description="t('request.share_description')"
-          :info-icon="IconChevronRight"
-          active
-          @click="nativeShare()"
-        />
+        <template
+          v-for="item in platform.ui?.additionalSupportOptionsMenuItems"
+          :key="item.id"
+        >
+          <HoppSmartItem
+            v-if="item.action.type === 'link'"
+            :icon="item.icon"
+            :label="item.text(t)"
+            :to="item.action.href"
+            :description="item.subtitle(t)"
+            :info-icon="IconChevronRight"
+            active
+            blank
+            @click="hideModal()"
+          />
+          <HoppSmartItem
+            v-else
+            :icon="item.icon"
+            :label="item.text(t)"
+            :description="item.subtitle(t)"
+            :info-icon="IconChevronRight"
+            active
+            @click="
+              () => {
+                // @ts-expect-error Typescript isn't able to understand
+                item.action.do()
+                hideModal()
+              }
+            "
+          />
+        </template>
       </div>
     </template>
   </HoppSmartModal>
@@ -138,24 +70,12 @@
 import { watch } from "vue"
 import IconSidebar from "~icons/lucide/sidebar"
 import IconSidebarOpen from "~icons/lucide/sidebar-open"
-import IconBook from "~icons/lucide/book"
-import IconGift from "~icons/lucide/gift"
-import IconActivity from "~icons/lucide/activity"
-import IconLock from "~icons/lucide/lock"
-import IconDiscord from "~icons/brands/discord"
-import IconTwitter from "~icons/brands/twitter"
-import IconGithub from "~icons/lucide/github"
-import IconMessageCircle from "~icons/lucide/message-circle"
-import IconUserPlus from "~icons/lucide/user-plus"
-import IconShare2 from "~icons/lucide/share-2"
 import IconChevronRight from "~icons/lucide/chevron-right"
 import { useSetting } from "@composables/settings"
-import { invokeAction } from "~/helpers/actions"
-import { showChat } from "@modules/crisp"
 import { useI18n } from "@composables/i18n"
+import { platform } from "~/platform"
 
 const t = useI18n()
-const navigatorShare = !!navigator.share
 
 const ZEN_MODE = useSetting("ZEN_MODE")
 const EXPAND_NAVIGATION = useSetting("EXPAND_NAVIGATION")
@@ -176,11 +96,6 @@ const emit = defineEmits<{
   (e: "hide-modal"): void
 }>()
 
-const chatWithUs = () => {
-  showChat()
-  hideModal()
-}
-
 const expandNavigation = () => {
   EXPAND_NAVIGATION.value = !EXPAND_NAVIGATION.value
   hideModal()
@@ -191,24 +106,6 @@ const expandCollection = () => {
   hideModal()
 }
 
-const expandInvite = () => {
-  invokeAction("modals.share.toggle")
-}
-
-const nativeShare = () => {
-  if (navigator.share) {
-    navigator
-      .share({
-        title: "Hoppscotch",
-        text: "Hoppscotch • Open source API development ecosystem - Helps you create requests faster, saving precious time on development.",
-        url: "https://hoppscotch.io",
-      })
-      .catch(console.error)
-  } else {
-    // fallback
-  }
-}
-
 const hideModal = () => {
   emit("hide-modal")
 }
diff --git a/packages/hoppscotch-common/src/components/app/Support.vue b/packages/hoppscotch-common/src/components/app/Support.vue
index ab1d3c1d8..b1c9c50af 100644
--- a/packages/hoppscotch-common/src/components/app/Support.vue
+++ b/packages/hoppscotch-common/src/components/app/Support.vue
@@ -8,89 +8,46 @@
   >
     <template #body>
       <div class="flex flex-col space-y-2">
-        <HoppSmartItem
-          :icon="IconBook"
-          :label="t('app.documentation')"
-          to="https://docs.hoppscotch.io"
-          :description="t('support.documentation')"
-          :info-icon="IconChevronRight"
-          active
-          blank
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconZap"
-          :label="t('app.keyboard_shortcuts')"
-          :description="t('support.shortcuts')"
-          :info-icon="IconChevronRight"
-          active
-          @click="showShortcuts()"
-        />
-        <HoppSmartItem
-          :icon="IconGift"
-          :label="t('app.whats_new')"
-          to="https://docs.hoppscotch.io/documentation/changelog"
-          :description="t('support.changelog')"
-          :info-icon="IconChevronRight"
-          active
-          blank
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconMessageCircle"
-          :label="t('app.chat_with_us')"
-          :description="t('support.chat')"
-          :info-icon="IconChevronRight"
-          active
-          @click="chatWithUs()"
-        />
-        <HoppSmartItem
-          :icon="IconGitHub"
-          :label="t('app.github')"
-          to="https://hoppscotch.io/github"
-          blank
-          :description="t('support.github')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconDiscord"
-          :label="t('app.join_discord_community')"
-          to="https://hoppscotch.io/discord"
-          blank
-          :description="t('support.community')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
-        <HoppSmartItem
-          :icon="IconTwitter"
-          :label="t('app.twitter')"
-          to="https://hoppscotch.io/twitter"
-          blank
-          :description="t('support.twitter')"
-          :info-icon="IconChevronRight"
-          active
-          @click="hideModal()"
-        />
+        <template
+          v-for="item in platform.ui?.additionalSupportOptionsMenuItems"
+          :key="item.id"
+        >
+          <HoppSmartItem
+            v-if="item.action.type === 'link'"
+            :icon="item.icon"
+            :label="item.text(t)"
+            :to="item.action.href"
+            :description="item.subtitle(t)"
+            :info-icon="IconChevronRight"
+            active
+            blank
+            @click="hideModal()"
+          />
+          <HoppSmartItem
+            v-else
+            :icon="item.icon"
+            :label="item.text(t)"
+            :description="item.subtitle(t)"
+            :info-icon="IconChevronRight"
+            active
+            @click="
+              () => {
+                // @ts-expect-error Typescript isn't able to understand
+                item.action.do()
+                hideModal()
+              }
+            "
+          />
+        </template>
       </div>
     </template>
   </HoppSmartModal>
 </template>
 
 <script setup lang="ts">
-import IconTwitter from "~icons/brands/twitter"
-import IconDiscord from "~icons/brands/discord"
-import IconGitHub from "~icons/lucide/github"
-import IconMessageCircle from "~icons/lucide/message-circle"
-import IconGift from "~icons/lucide/gift"
-import IconZap from "~icons/lucide/zap"
-import IconBook from "~icons/lucide/book"
 import IconChevronRight from "~icons/lucide/chevron-right"
-import { invokeAction } from "@helpers/actions"
-import { showChat } from "@modules/crisp"
 import { useI18n } from "@composables/i18n"
+import { platform } from "~/platform"
 
 const t = useI18n()
 
@@ -102,16 +59,6 @@ const emit = defineEmits<{
   (e: "hide-modal"): void
 }>()
 
-const chatWithUs = () => {
-  showChat()
-  hideModal()
-}
-
-const showShortcuts = () => {
-  invokeAction("flyouts.keybinds.toggle")
-  hideModal()
-}
-
 const hideModal = () => {
   emit("hide-modal")
 }
diff --git a/packages/hoppscotch-common/src/index.ts b/packages/hoppscotch-common/src/index.ts
index dc59f42d5..93e61277e 100644
--- a/packages/hoppscotch-common/src/index.ts
+++ b/packages/hoppscotch-common/src/index.ts
@@ -28,6 +28,7 @@ export function createHoppApp(el: string | Element, platformDef: PlatformDef) {
   performMigrations()
 
   HOPP_MODULES.forEach((mod) => mod.onVueAppInit?.(app))
+  platformDef.addedHoppModules?.forEach((mod) => mod.onVueAppInit?.(app))
 
   app.mount(el)
 
diff --git a/packages/hoppscotch-common/src/modules/crisp.ts b/packages/hoppscotch-common/src/modules/crisp.ts
deleted file mode 100644
index 6f5ab3a99..000000000
--- a/packages/hoppscotch-common/src/modules/crisp.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import { HoppModule } from "."
-
-export const showChat = () => {
-  ;(window as any).$crisp.push([
-    "do",
-    "chat:show",
-    (window as any).$crisp.push(["do", "chat:open"]),
-  ])
-}
-
-export default <HoppModule>{
-  onVueAppInit() {
-    // TODO: Env variable this ?
-    ;(window as any).$crisp = []
-    ;(window as any).CRISP_WEBSITE_ID = "3ad30257-c192-4773-955d-fb05a4b41af3"
-
-    const d = document
-    const s = d.createElement("script")
-
-    s.src = "https://client.crisp.chat/l.js"
-    s.async = true
-    d.getElementsByTagName("head")[0].appendChild(s)
-    ;(window as any).$crisp.push(["do", "chat:hide"])
-    ;(window as any).$crisp.push([
-      "on",
-      "chat:closed",
-      () => {
-        ;(window as any).$crisp.push(["do", "chat:hide"])
-      },
-    ])
-  },
-}
diff --git a/packages/hoppscotch-common/src/modules/router.ts b/packages/hoppscotch-common/src/modules/router.ts
index 749a0ffa6..79ea37d48 100644
--- a/packages/hoppscotch-common/src/modules/router.ts
+++ b/packages/hoppscotch-common/src/modules/router.ts
@@ -53,6 +53,9 @@ export default <HoppModule>{
       HOPP_MODULES.forEach((mod) => {
         mod.onBeforeRouteChange?.(to, from, router)
       })
+      platform.addedHoppModules?.forEach((mod) => {
+        mod.onBeforeRouteChange?.(to, from, router)
+      })
     })
 
     // Instead of this a better architecture is for the router
@@ -66,10 +69,14 @@ export default <HoppModule>{
       HOPP_MODULES.forEach((mod) => {
         mod.onAfterRouteChange?.(to, router)
       })
+      platform.addedHoppModules?.forEach((mod) => {
+        mod.onAfterRouteChange?.(to, router)
+      })
     })
 
     app.use(router)
 
     HOPP_MODULES.forEach((mod) => mod.onRouterInit?.(app, router))
+    platform.addedHoppModules?.forEach((mod) => mod.onRouterInit?.(app, router))
   },
 }
diff --git a/packages/hoppscotch-common/src/platform/index.ts b/packages/hoppscotch-common/src/platform/index.ts
index 04964ce63..9644be8f4 100644
--- a/packages/hoppscotch-common/src/platform/index.ts
+++ b/packages/hoppscotch-common/src/platform/index.ts
@@ -7,9 +7,11 @@ import { HistoryPlatformDef } from "./history"
 import { TabStatePlatformDef } from "./tab"
 import { AnalyticsPlatformDef } from "./analytics"
 import { InterceptorsPlatformDef } from "./interceptors"
+import { HoppModule } from "~/modules"
 
 export type PlatformDef = {
   ui?: UIPlatformDef
+  addedHoppModules?: HoppModule[]
   auth: AuthPlatformDef
   analytics?: AnalyticsPlatformDef
   sync: {
diff --git a/packages/hoppscotch-common/src/platform/std/ui/footerItem.ts b/packages/hoppscotch-common/src/platform/std/ui/footerItem.ts
new file mode 100644
index 000000000..c5983adfb
--- /dev/null
+++ b/packages/hoppscotch-common/src/platform/std/ui/footerItem.ts
@@ -0,0 +1,25 @@
+import { HoppFooterMenuItem } from "../../ui"
+import IconGift from "~icons/lucide/gift"
+import IconActivity from "~icons/lucide/activity"
+
+export const whatsNew: HoppFooterMenuItem = {
+  id: "whats-new",
+  text: (t) => t("app.whats_new"),
+  icon: IconGift,
+  action: {
+    type: "link",
+    href: "https://docs.hoppscotch.io/documentation/changelog",
+  },
+}
+
+export const status: HoppFooterMenuItem = {
+  id: "status",
+  text: (t) => t("app.status"),
+  icon: IconActivity,
+  action: {
+    type: "link",
+    href: "https://status.hoppscotch.io",
+  },
+}
+
+export const stdFooterItems = [whatsNew, status]
diff --git a/packages/hoppscotch-common/src/platform/std/ui/supportOptionsItem.ts b/packages/hoppscotch-common/src/platform/std/ui/supportOptionsItem.ts
new file mode 100644
index 000000000..b8154a36d
--- /dev/null
+++ b/packages/hoppscotch-common/src/platform/std/ui/supportOptionsItem.ts
@@ -0,0 +1,110 @@
+import { invokeAction } from "~/helpers/actions"
+import { HoppSupportOptionsMenuItem } from "~/platform/ui"
+import IconBook from "~icons/lucide/book"
+import IconGift from "~icons/lucide/gift"
+import IconZap from "~icons/lucide/zap"
+import IconGitHub from "~icons/lucide/github"
+import IconTwitter from "~icons/brands/twitter"
+import IconDiscord from "~icons/brands/discord"
+import IconUserPlus from "~icons/lucide/user-plus"
+
+export const documentation: HoppSupportOptionsMenuItem = {
+  id: "documentation",
+  text: (t) => t("app.documentation"),
+  subtitle: (t) => t("support.documentation"),
+  icon: IconBook,
+  action: {
+    type: "link",
+    href: "https://docs.hoppscotch.io",
+  },
+}
+
+export const shortcuts: HoppSupportOptionsMenuItem = {
+  id: "shortcuts",
+  text: (t) => t("app.keyboard_shortcuts"),
+  subtitle: (t) => t("support.shortcuts"),
+  icon: IconZap,
+  action: {
+    type: "custom",
+    do() {
+      invokeAction("flyouts.keybinds.toggle")
+    },
+  },
+}
+
+export const changelog: HoppSupportOptionsMenuItem = {
+  id: "changelog",
+  text: (t) => t("app.whats_new"),
+  subtitle: (t) => t("support.changelog"),
+  icon: IconGift,
+  action: {
+    type: "link",
+    href: "https://docs.hoppscotch.io/documentation/changelog",
+  },
+}
+
+export const github: HoppSupportOptionsMenuItem = {
+  id: "github",
+  text: (t) => t("app.github"),
+  subtitle: (t) => t("support.github"),
+  icon: IconGitHub,
+  action: {
+    type: "link",
+    href: "https://hoppscotch.io/github",
+  },
+}
+
+export const discord: HoppSupportOptionsMenuItem = {
+  id: "discord",
+  text: (t) => t("app.join_discord_community"),
+  subtitle: (t) => t("support.community"),
+  icon: IconDiscord,
+  action: {
+    type: "link",
+    href: "https://hoppscotch.io/discord",
+  },
+}
+
+export const twitter: HoppSupportOptionsMenuItem = {
+  id: "discord",
+  text: (t) => t("app.twitter"),
+  subtitle: (t) => t("support.twitter"),
+  icon: IconTwitter,
+  action: {
+    type: "link",
+    href: "https://hoppscotch.io/discord",
+  },
+}
+
+export const invite: HoppSupportOptionsMenuItem = {
+  id: "invite",
+  text: (t) => t("app.invite"),
+  subtitle: (t) => t("shortcut.miscellaneous.invite"),
+  icon: IconUserPlus,
+  action: {
+    type: "custom",
+    do() {
+      if (navigator.share) {
+        navigator
+          .share({
+            title: "Hoppscotch",
+            text: "Hoppscotch • Open source API development ecosystem - Helps you create requests faster, saving precious time on development.",
+            url: "https://hoppscotch.io",
+          })
+          .catch(console.error)
+      } else {
+        // fallback
+      }
+    },
+  },
+}
+
+export const stdSupportOptionItems: HoppSupportOptionsMenuItem[] = [
+  documentation,
+  shortcuts,
+  changelog,
+  github,
+  discord,
+  twitter,
+  invite,
+]
diff --git a/packages/hoppscotch-common/src/platform/ui.ts b/packages/hoppscotch-common/src/platform/ui.ts
index 49d5a0a40..ee18a5031 100644
--- a/packages/hoppscotch-common/src/platform/ui.ts
+++ b/packages/hoppscotch-common/src/platform/ui.ts
@@ -1,4 +1,20 @@
-import { Ref } from "vue"
+import { Ref, Component } from "vue"
+import { getI18n } from "~/modules/i18n"
+
+export type HoppFooterMenuItem = {
+  id: string
+  text: (t: ReturnType<typeof getI18n>) => string
+  icon: Component
+  action: { type: "link"; href: string } | { type: "custom"; do: () => void }
+}
+
+export type HoppSupportOptionsMenuItem = {
+  id: string
+  text: (t: ReturnType<typeof getI18n>) => string
+  subtitle: (t: ReturnType<typeof getI18n>) => string
+  icon: Component
+  action: { type: "link"; href: string } | { type: "custom"; do: () => void }
+}
 
 export type UIPlatformDef = {
   appHeader?: {
@@ -6,4 +22,15 @@ export type UIPlatformDef = {
     paddingLeft?: Ref<string>
   }
   onCodemirrorInstanceMount?: (element: HTMLElement) => void
+
+  /**
+   * Additonal menu items shown in the "Help and Feedback" menu
+   * in the app footer.
+   */
+  additionalFooterMenuItems?: HoppFooterMenuItem[]
+
+  /**
+   * Additional Support Options menu items shown in the app header
+   */
+  additionalSupportOptionsMenuItems?: HoppSupportOptionsMenuItem[]
 }
diff --git a/packages/hoppscotch-common/src/services/spotlight/searchers/base/static.searcher.ts b/packages/hoppscotch-common/src/services/spotlight/searchers/base/static.searcher.ts
index 25bed5db7..50af557f6 100644
--- a/packages/hoppscotch-common/src/services/spotlight/searchers/base/static.searcher.ts
+++ b/packages/hoppscotch-common/src/services/spotlight/searchers/base/static.searcher.ts
@@ -91,8 +91,9 @@ export abstract class StaticSpotlightSearcherService<
   private async addDocsToSearchIndex() {
     this.loading.value = true
 
-    this.minisearch.removeAll()
-    this.minisearch.vacuum()
+    this.minisearch = new MiniSearch({
+      fields: this.opts.searchFields as string[],
+    })
 
     await this.minisearch.addAllAsync(
       Object.entries(this._documents).map(([id, doc]) => ({
diff --git a/packages/hoppscotch-common/src/services/spotlight/searchers/general.searcher.ts b/packages/hoppscotch-common/src/services/spotlight/searchers/general.searcher.ts
index 54d5198ba..d05dca9a9 100644
--- a/packages/hoppscotch-common/src/services/spotlight/searchers/general.searcher.ts
+++ b/packages/hoppscotch-common/src/services/spotlight/searchers/general.searcher.ts
@@ -13,13 +13,13 @@ import IconBook from "~icons/lucide/book"
 import IconDiscord from "~icons/lucide/link"
 import IconGitHub from "~icons/lucide/github"
 import IconLifeBuoy from "~icons/lucide/life-buoy"
-import IconMessageCircle from "~icons/lucide/message-circle"
 import IconZap from "~icons/lucide/zap"
 
 type Doc = {
   text: string | string[]
   alternates: string[]
   icon: object | Component
+  action: () => void
 }
 
 /**
@@ -43,41 +43,48 @@ export class GeneralSpotlightSearcherService extends StaticSpotlightSearcherServ
       text: this.t("spotlight.general.help_menu"),
       alternates: ["help", "hoppscotch"],
       icon: markRaw(IconLifeBuoy),
-    },
-    chat_with_support: {
-      text: this.t("spotlight.general.chat"),
-      alternates: ["chat", "support", "hoppscotch"],
-      icon: markRaw(IconMessageCircle),
+      action() {
+        invokeAction("modals.support.toggle")
+      },
     },
     open_docs: {
       text: this.t("spotlight.general.open_docs"),
       alternates: ["docs", "documentation", "hoppscotch"],
       icon: markRaw(IconBook),
+      action: () => this.openURL("https://docs.hoppscotch.io"),
     },
     open_keybindings: {
       text: this.t("spotlight.general.open_keybindings"),
       alternates: ["key", "shortcuts", "binding"],
       icon: markRaw(IconZap),
+      action() {
+        invokeAction("flyouts.keybinds.toggle")
+      },
     },
     link_github: {
       text: [this.t("spotlight.general.social"), "GitHub"],
       alternates: ["social", "github", "link"],
       icon: markRaw(IconGitHub),
+      action: () => this.openURL("https://hoppscotch.io/github"),
     },
     link_twitter: {
       text: [this.t("spotlight.general.social"), "Twitter"],
       alternates: ["social", "twitter", "link"],
       icon: markRaw(IconTwitter),
+      action: () => this.openURL("https://twitter.com/hoppscotch_io"),
     },
     link_discord: {
       text: [this.t("spotlight.general.social"), "Discord"],
       alternates: ["social", "discord", "link"],
       icon: markRaw(IconDiscord),
+      action: () => this.openURL("https://hoppscotch.io/discord"),
     },
     link_linkedin: {
       text: [this.t("spotlight.general.social"), "LinkedIn"],
       alternates: ["social", "linkedin", "link"],
       icon: markRaw(IconLinkedIn),
+      action: () =>
+        this.openURL("https://www.linkedin.com/company/hoppscotch/"),
     },
   })
 
@@ -110,31 +117,11 @@ export class GeneralSpotlightSearcherService extends StaticSpotlightSearcherServ
   }
 
   public onDocSelected(id: string): void {
-    switch (id) {
-      case "open_help":
-        invokeAction("modals.support.toggle")
-        break
-      case "chat_with_support":
-        invokeAction("flyouts.chat.open")
-        break
-      case "open_docs":
-        this.openURL("https://docs.hoppscotch.io")
-        break
-      case "open_keybindings":
-        invokeAction("flyouts.keybinds.toggle")
-        break
-      case "link_github":
-        this.openURL("https://hoppscotch.io/github")
-        break
-      case "link_twitter":
-        this.openURL("https://twitter.com/hoppscotch_io")
-        break
-      case "link_discord":
-        this.openURL("https://hoppscotch.io/discord")
-        break
-      case "link_linkedin":
-        this.openURL("https://www.linkedin.com/company/hoppscotch/")
-        break
-    }
+    this.documents[id]?.action()
+  }
+
+  public addCustomEntries(docs: Record<string, Doc>) {
+    this.documents = { ...this.documents, ...docs }
+    this.setDocuments(this.documents)
   }
 }
diff --git a/packages/hoppscotch-selfhost-web/package.json b/packages/hoppscotch-selfhost-web/package.json
index d38ba4e1c..5e9c4c526 100644
--- a/packages/hoppscotch-selfhost-web/package.json
+++ b/packages/hoppscotch-selfhost-web/package.json
@@ -28,8 +28,8 @@
     "@fontsource-variable/roboto-mono": "^5.0.9",
     "@hoppscotch/common": "workspace:^",
     "@hoppscotch/data": "workspace:^",
-    "axios": "^1.4.0",
     "@import-meta-env/unplugin": "^0.4.8",
+    "axios": "^1.4.0",
     "buffer": "^6.0.3",
     "fp-ts": "^2.16.1",
     "process": "^0.11.10",
@@ -65,6 +65,7 @@
     "unplugin-icons": "^0.16.5",
     "unplugin-vue-components": "^0.25.1",
     "vite": "^4.4.9",
+    "vite-plugin-fonts": "^0.6.0",
     "vite-plugin-html-config": "^1.0.11",
     "vite-plugin-inspect": "^0.7.38",
     "vite-plugin-pages": "^0.31.0",
@@ -75,7 +76,6 @@
     "vite-plugin-windicss": "^1.9.1",
     "vitest": "^0.34.2",
     "vue-tsc": "^1.8.8",
-    "vite-plugin-fonts": "^0.6.0",
     "windicss": "^3.5.6"
   }
 }
diff --git a/packages/hoppscotch-selfhost-web/src/main.ts b/packages/hoppscotch-selfhost-web/src/main.ts
index 81764f989..7d476b44c 100644
--- a/packages/hoppscotch-selfhost-web/src/main.ts
+++ b/packages/hoppscotch-selfhost-web/src/main.ts
@@ -8,8 +8,14 @@ import { def as tabStateDef } from "./platform/tabState/tabState.platform"
 import { browserInterceptor } from "@hoppscotch/common/platform/std/interceptors/browser"
 import { proxyInterceptor } from "@hoppscotch/common/platform/std/interceptors/proxy"
 import { ExtensionInterceptorService } from "@hoppscotch/common/platform/std/interceptors/extension"
+import { stdFooterItems } from "@hoppscotch/common/platform/std/ui/footerItem"
+import { stdSupportOptionItems } from "@hoppscotch/common/platform/std/ui/supportOptionsItem"
 
 createHoppApp("#app", {
+  ui: {
+    additonalFooterMenuItems: stdFooterItems,
+    additionalSupportOptionsMenuItems: stdSupportOptionItems,
+  },
   auth: authDef,
   sync: {
     environments: environmentsDef,
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index d36576bb5..60926dd6c 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1330,7 +1330,7 @@ importers:
         version: 0.13.1(vite@3.2.4)(workbox-build@6.6.0)(workbox-window@6.6.0)
       vite-plugin-vue-layouts:
         specifier: ^0.7.0
-        version: 0.7.0(vite@3.2.4)(vue-router@4.1.0)(vue@3.2.45)
+        version: 0.7.0(vite@3.2.4)(vue-router@4.2.4)(vue@3.2.45)
       vite-plugin-windicss:
         specifier: ^1.8.8
         version: 1.8.8(vite@3.2.4)
@@ -19698,7 +19698,6 @@ packages:
     resolution: {integrity: sha512-vYl3iOX+4CKUWuxGi9Ukhie6fsqXqS9FE2Zaic4tNFD2N2QQaXOMFbuKK4QmDHC0JO6B1Zp41J0LpT0oR68amQ==}
     dependencies:
       safe-buffer: 5.2.1
-    dev: true
 
   /range-parser@1.2.1:
     resolution: {integrity: sha512-Hrgsx+orqoygnmhFbKaHE6c296J+HTAQXoxEF6gNupROmmGJRoyzfG3ccAveqCBrwr/2yxQ5BVd/GTl5agOwSg==}
@@ -20397,7 +20396,6 @@ packages:
     resolution: {integrity: sha512-owoXEFjWRllis8/M1Q+Cw5k8ZH40e3zhp/ovX+Xr/vi1qj6QesbyXXViFbpNvWvPNAD62SutwEXavefrLJWj7w==}
     dependencies:
       randombytes: 2.1.0
-    dev: true
 
   /serve-static@1.15.0:
     resolution: {integrity: sha512-XGuRDNjXUijsUL0vl6nSD7cwURuzEgglbOaFuZM9g3kwDXOWVTck0jLzjPzGD+TazWbboZYu52/9/XPdUgne9g==}
@@ -23006,6 +23004,23 @@ packages:
       - supports-color
     dev: true
 
+  /vite-plugin-vue-layouts@0.7.0(vite@3.2.4)(vue-router@4.2.4)(vue@3.2.45):
+    resolution: {integrity: sha512-k5XDmRNFo4M/GmUjhbRXj2WmJiFcGoVI8l/uZ72RHyRDQr4wE/6Zq/KFq0lqXomWQxTSzakQRUswzNwtvZLE8A==}
+    peerDependencies:
+      vite: ^2.5.0 || ^3.0.0-0
+      vue: ^2.6.12 || ^3.2.4
+      vue-router: ^3.5.1 || ^ 4.0.11
+    dependencies:
+      '@vue/compiler-sfc': 3.3.4
+      debug: 4.3.4(supports-color@9.2.2)
+      fast-glob: 3.3.1
+      vite: 3.2.4(@types/node@17.0.45)(sass@1.53.0)(terser@5.19.2)
+      vue: 3.2.45
+      vue-router: 4.2.4(vue@3.2.45)
+    transitivePeerDependencies:
+      - supports-color
+    dev: true
+
   /vite-plugin-vue-layouts@0.8.0(vite@4.4.9)(vue-router@4.2.4)(vue@3.3.4):
     resolution: {integrity: sha512-UZW2nSV2LraTSe7gsAL46hfdi7a0X1RvkGGoJVtA2O8beu7anzpXFwQLou8+kHy31CzVycT4gIPySBsHhtBN5g==}
     peerDependencies:
@@ -23675,6 +23690,15 @@ packages:
       '@vue/devtools-api': 6.5.0
       vue: 3.2.45
 
+  /vue-router@4.2.4(vue@3.2.45):
+    resolution: {integrity: sha512-9PISkmaCO02OzPVOMq2w82ilty6+xJmQrarYZDkjZBfl4RvYAlt4PKnEX21oW4KTtWfa9OuO/b3qk1Od3AEdCQ==}
+    peerDependencies:
+      vue: ^3.2.0
+    dependencies:
+      '@vue/devtools-api': 6.5.0
+      vue: 3.2.45
+    dev: true
+
   /vue-router@4.2.4(vue@3.3.4):
     resolution: {integrity: sha512-9PISkmaCO02OzPVOMq2w82ilty6+xJmQrarYZDkjZBfl4RvYAlt4PKnEX21oW4KTtWfa9OuO/b3qk1Od3AEdCQ==}
     peerDependencies: