btwedutech/hoppscotch
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 6 Wiki Activity

feat: introducing self hosted admin dashboard package (#12)

Browse Source 
Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>
Co-authored-by: Anwarul Islam <anwaarulislaam@gmail.com>
This commit is contained in:
Joel Jacob Stephen
2023-02-28 13:13:27 +05:30
committed by GitHub
parent 2ba05a46ee
commit 3f59597864
219 changed files with 6737 additions and 1967 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
packages/hoppscotch-common/src/pages/realtime/mqtt.vue
View File

@@ -38,7 +38,7 @@
@keyup.enter="isUrlValid ? toggleConnection() : null"
/>
</div>
<ButtonPrimary
<HoppButtonPrimary
id="connect"
:disabled="!isUrlValid"
class="w-32"
@@ -84,14 +84,14 @@
/>
</template>
<template #secondary>
<SmartWindows
<HoppSmartWindows
:id="'communication_tab'"
v-model="currentTabId"
:can-add-new-tab="false"
@remove-tab="removeTab"
@sort="sortTabs"
>
<SmartWindow
<HoppSmartWindow
v-for="tab in tabs"
:id="tab.id"
:key="'removable_tab_' + tab.id"
@@ -111,22 +111,22 @@
:log="((tab.id === 'all' ? logs : tab.logs) as LogEntryData[])"
@delete="clearLogEntries()"
/>
</SmartWindow>
</SmartWindows>
</HoppSmartWindow>
</HoppSmartWindows>
</template>
<template #sidebar>
<div
class="sticky z-10 flex flex-col flex-shrink-0 overflow-x-auto border-b divide-y rounded-t divide-dividerLight bg-primary border-dividerLight"
>
<div class="flex justify-between flex-1">
<ButtonSecondary
<HoppButtonSecondary
:icon="IconPlus"
:label="t('mqtt.new')"
class="!rounded-none"
@click="showSubscriptionModal(true)"
/>
<span class="flex">
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
to="https://docs.hoppscotch.io/features/mqtt"
blank
@@ -150,7 +150,7 @@
<span class="pb-4 text-center">
{{ t("empty.subscription") }}
</span>
<ButtonSecondary
<HoppButtonSecondary
:label="t('mqtt.new')"
filled
outline
@@ -181,7 +181,7 @@
{{ topic.name }}
</span>
</span>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:icon="IconTrash"
color="red"

37
packages/hoppscotch-common/src/pages/realtime/socketio.vue
View File

@@ -34,7 +34,7 @@
tabindex="0"
@keyup.escape="hide()"
>
<SmartItem
<HoppSmartItem
v-for="version in SIOVersions"
:key="`client-${version}`"
:label="`Client ${version}`"
@@ -76,7 +76,7 @@
@keyup.enter="isUrlValid ? toggleConnection() : null"
/>
</div>
<ButtonPrimary
<HoppButtonPrimary
id="connect"
:disabled="!isUrlValid"
name="connect"
@@ -93,12 +93,12 @@
/>
</div>
</div>
<SmartTabs
<HoppSmartTabs
v-model="selectedTab"
styles="sticky overflow-x-auto flex-shrink-0 bg-primary top-upperPrimaryStickyFold z-10"
render-inactive-tabs
>
<SmartTab
<HoppSmartTab
:id="'communication'"
:label="`${t('websocket.communication')}`"
render-inactive-tabs
@@ -110,8 +110,11 @@
sticky-header-styles="top-upperTertiaryStickyFold"
@send-message="sendMessage($event)"
/>
</SmartTab>
<SmartTab :id="'protocols'" :label="`${t('request.authorization')}`">
</HoppSmartTab>
<HoppSmartTab
:id="'protocols'"
:label="`${t('request.authorization')}`"
>
<div
class="sticky z-10 flex items-center justify-between flex-shrink-0 pl-4 overflow-x-auto border-b bg-primary border-dividerLight top-upperSecondaryStickyFold"
>
@@ -126,7 +129,7 @@
:on-shown="() => authTippyActions.focus()"
>
<span class="select-wrapper">
<ButtonSecondary
<HoppButtonSecondary
class="pr-8 ml-2 rounded-none"
:label="authType"
/>
@@ -138,7 +141,7 @@
tabindex="0"
@keyup.escape="hide()"
>
<SmartItem
<HoppSmartItem
label="None"
:icon="authType === 'None' ? IconCircleDot : IconCircle"
:active="authType === 'None'"
@@ -149,7 +152,7 @@
}
"
/>
<SmartItem
<HoppSmartItem
label="Bearer Token"
:icon="authType === 'Bearer' ? IconCircleDot : IconCircle"
:active="authType === 'Bearer'"
@@ -165,21 +168,21 @@
</tippy>
</span>
<div class="flex">
<SmartCheckbox
<HoppSmartCheckbox
:on="authActive"
class="px-2"
@change="authActive = !authActive"
>
{{ t("state.enabled") }}
</SmartCheckbox>
<ButtonSecondary
</HoppSmartCheckbox>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
to="https://docs.hoppscotch.io/features/authorization"
blank
:title="t('app.wiki')"
:icon="IconHelpCircle"
/>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('action.clear')"
:icon="IconTrash2"
@@ -200,7 +203,7 @@
<span class="pb-4 text-center">
{{ t("socketio.connection_not_authorized") }}
</span>
<ButtonSecondary
<HoppButtonSecondary
outline
:label="t('app.documentation')"
to="https://docs.hoppscotch.io/features/authorization"
@@ -226,7 +229,7 @@
<div class="pb-2 text-secondaryLight">
{{ t("helpers.authorization") }}
</div>
<SmartAnchor
<HoppSmartAnchor
class="link"
:label="t('authorization.learn')"
:icon="IconExternalLink"
@@ -237,8 +240,8 @@
</div>
</div>
</div>
</SmartTab>
</SmartTabs>
</HoppSmartTab>
</HoppSmartTabs>
</template>
<template #secondary>
<RealtimeLog

2
packages/hoppscotch-common/src/pages/realtime/sse.vue
View File

@@ -36,7 +36,7 @@
@keyup.enter="isUrlValid ? toggleSSEConnection() : null"
/>
</div>
<ButtonPrimary
<HoppButtonPrimary
id="start"
:disabled="!isUrlValid"
name="start"

26
packages/hoppscotch-common/src/pages/realtime/websocket.vue
View File

@@ -20,7 +20,7 @@
"
@keyup.enter="isUrlValid ? toggleConnection() : null"
/>
<ButtonPrimary
<HoppButtonPrimary
id="connect"
:disabled="!isUrlValid"
class="w-32"
@@ -37,12 +37,12 @@
/>
</div>
</div>
<SmartTabs
<HoppSmartTabs
v-model="selectedTab"
styles="sticky overflow-x-auto flex-shrink-0 bg-primary top-upperPrimaryStickyFold z-10"
render-inactive-tabs
>
<SmartTab
<HoppSmartTab
:id="'communication'"
:label="`${t('websocket.communication')}`"
>
@@ -51,8 +51,8 @@
sticky-header-styles="top-upperSecondaryStickyFold"
@send-message="sendMessage($event)"
/>
</SmartTab>
<SmartTab :id="'protocols'" :label="`${t('websocket.protocols')}`">
</HoppSmartTab>
<HoppSmartTab :id="'protocols'" :label="`${t('websocket.protocols')}`">
<div
class="sticky z-10 flex items-center justify-between flex-shrink-0 pl-4 overflow-x-auto border-b bg-primary border-dividerLight top-upperSecondaryStickyFold"
>
@@ -60,13 +60,13 @@
{{ t("websocket.protocols") }}
</label>
<div class="flex">
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('action.clear_all')"
:icon="IconTrash2"
@click="clearContent"
/>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('add.new')"
:icon="IconPlus"
@@ -89,7 +89,7 @@
class="flex border-b divide-x divide-dividerLight border-dividerLight draggable-content group"
>
<span>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{
theme: 'tooltip',
delay: [500, 20],
@@ -122,7 +122,7 @@
"
/>
<span>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="
protocol.hasOwnProperty('active')
@@ -148,7 +148,7 @@
/>
</span>
<span>
<ButtonSecondary
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('action.remove')"
:icon="IconTrash"
@@ -173,8 +173,8 @@
{{ t("empty.protocols") }}
</span>
</div>
</SmartTab>
</SmartTabs>
</HoppSmartTab>
</HoppSmartTabs>
</template>
<template #secondary>
<RealtimeLog
@@ -194,7 +194,7 @@ import IconCheckCircle from "~icons/lucide/check-circle"
import IconCircle from "~icons/lucide/circle"
import IconGripVertical from "~icons/lucide/grip-vertical"
import IconTrash from "~icons/lucide/trash"
import draggable from "vuedraggable"
import draggable from "vuedraggable-es"
import {
setWSEndpoint,
WSEndpoint$,