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:
@@ -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>
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -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")
|
||||
}
|
||||
|
||||
@@ -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")
|
||||
}
|
||||
|
||||
@@ -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)
|
||||
|
||||
|
||||
@@ -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"])
|
||||
},
|
||||
])
|
||||
},
|
||||
}
|
||||
@@ -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))
|
||||
},
|
||||
}
|
||||
|
||||
@@ -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: {
|
||||
|
||||
25
packages/hoppscotch-common/src/platform/std/ui/footerItem.ts
Normal file
25
packages/hoppscotch-common/src/platform/std/ui/footerItem.ts
Normal 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]
|
||||
@@ -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,
|
||||
]
|
||||
@@ -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[]
|
||||
}
|
||||
|
||||
@@ -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]) => ({
|
||||
|
||||
@@ -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)
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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"
|
||||
}
|
||||
}
|
||||
|
||||
@@ -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,
|
||||
|
||||
Reference in New Issue
Block a user