feat: move crisp out of common (#3287)

* feat: move crisp out of common

* fix: update static spotlight searcher

* chore: fix typo
This commit is contained in:
Andrew Bastin
2023-08-26 03:00:58 +05:30
committed by GitHub
parent d4d7a20fbd
commit a7566dfd86
17 changed files with 325 additions and 319 deletions

View File

@@ -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>

View File

@@ -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

View File

@@ -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

View File

@@ -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")
}

View File

@@ -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")
}

View File

@@ -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)

View File

@@ -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"])
},
])
},
}

View File

@@ -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))
},
}

View File

@@ -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: {

View File

@@ -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]

View File

@@ -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,
]

View File

@@ -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[]
}

View File

@@ -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]) => ({

View File

@@ -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)
}
}

View File

@@ -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"
}
}

View File

@@ -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,