From 5230d2d3b84419ce7dc7877f2291d8e8de571655 Mon Sep 17 00:00:00 2001 From: Andrew Bastin Date: Tue, 11 Jul 2023 23:02:33 +0530 Subject: [PATCH] feat: revamped spotlight (#3171) Co-authored-by: Liyas Thomas --- packages/hoppscotch-common/locales/en.json | 6 + packages/hoppscotch-common/package.json | 3 +- .../hoppscotch-common/src/components.d.ts | 7 +- .../src/components/app/Footer.vue | 2 +- .../src/components/app/Fuse.vue | 69 -- .../src/components/app/Header.vue | 15 +- .../src/components/app/PowerSearch.vue | 122 -- .../src/components/app/PowerSearchEntry.vue | 68 -- .../src/components/app/Shortcuts.vue | 79 +- .../src/components/app/ShortcutsEntry.vue | 11 +- .../src/components/app/spotlight/Entry.vue | 122 ++ .../app/spotlight/entry/GQLHistory.vue | 30 + .../app/spotlight/entry/RESTHistory.vue | 43 + .../src/components/app/spotlight/index.vue | 238 ++++ .../src/components/firebase/Logout.vue | 11 +- .../src/components/history/index.vue | 5 + .../hoppscotch-common/src/helpers/actions.ts | 95 +- .../src/helpers/keybindings.ts | 4 +- .../src/helpers/powerSearchNavigation.ts | 55 - .../src/helpers/shortcuts.ts | 453 +++---- .../hoppscotch-common/src/layouts/default.vue | 2 +- .../hoppscotch-common/src/modules/dioc.ts | 29 +- .../hoppscotch-common/src/modules/i18n.ts | 8 + .../hoppscotch-common/src/pages/graphql.vue | 13 + .../hoppscotch-common/src/pages/index.vue | 6 +- .../src/services/debug.service.ts | 64 + .../spotlight/__tests__/index.spec.ts | 550 +++++++++ .../src/services/spotlight/index.ts | 216 ++++ .../__tests__/history.searcher.spec.ts | 444 +++++++ .../searchers/__tests__/user.searcher.spec.ts | 192 +++ .../base/__tests__/static.searcher.spec.ts | 403 +++++++ .../searchers/base/static.searcher.ts | 175 +++ .../spotlight/searchers/history.searcher.ts | 255 ++++ .../spotlight/searchers/user.searcher.ts | 96 ++ packages/hoppscotch-common/vitest.config.ts | 20 + pnpm-lock.yaml | 1073 ++++++++++++----- 36 files changed, 3941 insertions(+), 1043 deletions(-) delete mode 100644 packages/hoppscotch-common/src/components/app/Fuse.vue delete mode 100644 packages/hoppscotch-common/src/components/app/PowerSearch.vue delete mode 100644 packages/hoppscotch-common/src/components/app/PowerSearchEntry.vue create mode 100644 packages/hoppscotch-common/src/components/app/spotlight/Entry.vue create mode 100644 packages/hoppscotch-common/src/components/app/spotlight/entry/GQLHistory.vue create mode 100644 packages/hoppscotch-common/src/components/app/spotlight/entry/RESTHistory.vue create mode 100644 packages/hoppscotch-common/src/components/app/spotlight/index.vue delete mode 100644 packages/hoppscotch-common/src/helpers/powerSearchNavigation.ts create mode 100644 packages/hoppscotch-common/src/services/debug.service.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/__tests__/index.spec.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/index.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/searchers/__tests__/history.searcher.spec.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/searchers/__tests__/user.searcher.spec.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/searchers/base/__tests__/static.searcher.spec.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/searchers/base/static.searcher.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/searchers/history.searcher.ts create mode 100644 packages/hoppscotch-common/src/services/spotlight/searchers/user.searcher.ts diff --git a/packages/hoppscotch-common/locales/en.json b/packages/hoppscotch-common/locales/en.json index fd80af3b7..6a84716dc 100644 --- a/packages/hoppscotch-common/locales/en.json +++ b/packages/hoppscotch-common/locales/en.json @@ -4,6 +4,7 @@ "cancel": "Cancel", "choose_file": "Choose a file", "clear": "Clear", + "clear_history": "Clear All History", "clear_all": "Clear all", "close": "Close", "connect": "Connect", @@ -583,6 +584,11 @@ "log": "Log", "url": "URL" }, + "spotlight": { + "section": { + "user": "User" + } + }, "sse": { "event_type": "Event type", "log": "Log", diff --git a/packages/hoppscotch-common/package.json b/packages/hoppscotch-common/package.json index ab6d40811..5986de983 100644 --- a/packages/hoppscotch-common/package.json +++ b/packages/hoppscotch-common/package.json @@ -46,7 +46,7 @@ "@urql/exchange-auth": "^0.1.7", "@urql/exchange-graphcache": "^4.4.3", "@vitejs/plugin-legacy": "^2.3.0", - "@vueuse/core": "^8.7.5", + "@vueuse/core": "^8.9.4", "@vueuse/head": "^0.7.9", "acorn-walk": "^8.2.0", "axios": "^0.21.4", @@ -67,6 +67,7 @@ "jsonpath-plus": "^7.0.0", "lodash-es": "^4.17.21", "lossless-json": "^2.0.8", + "minisearch": "^6.1.0", "nprogress": "^0.2.0", "paho-mqtt": "^1.1.0", "path": "^0.12.7", diff --git a/packages/hoppscotch-common/src/components.d.ts b/packages/hoppscotch-common/src/components.d.ts index 21264cc9e..f9eef9d75 100644 --- a/packages/hoppscotch-common/src/components.d.ts +++ b/packages/hoppscotch-common/src/components.d.ts @@ -11,20 +11,21 @@ declare module '@vue/runtime-core' { AppAnnouncement: typeof import('./components/app/Announcement.vue')['default'] AppDeveloperOptions: typeof import('./components/app/DeveloperOptions.vue')['default'] AppFooter: typeof import('./components/app/Footer.vue')['default'] - AppFuse: typeof import('./components/app/Fuse.vue')['default'] AppGitHubStarButton: typeof import('./components/app/GitHubStarButton.vue')['default'] AppHeader: typeof import('./components/app/Header.vue')['default'] AppInterceptor: typeof import('./components/app/Interceptor.vue')['default'] AppLogo: typeof import('./components/app/Logo.vue')['default'] AppOptions: typeof import('./components/app/Options.vue')['default'] AppPaneLayout: typeof import('./components/app/PaneLayout.vue')['default'] - AppPowerSearch: typeof import('./components/app/PowerSearch.vue')['default'] - AppPowerSearchEntry: typeof import('./components/app/PowerSearchEntry.vue')['default'] AppShare: typeof import('./components/app/Share.vue')['default'] AppShortcuts: typeof import('./components/app/Shortcuts.vue')['default'] AppShortcutsEntry: typeof import('./components/app/ShortcutsEntry.vue')['default'] AppShortcutsPrompt: typeof import('./components/app/ShortcutsPrompt.vue')['default'] AppSidenav: typeof import('./components/app/Sidenav.vue')['default'] + AppSpotlight: typeof import('./components/app/spotlight/index.vue')['default'] + AppSpotlightEntry: typeof import('./components/app/spotlight/Entry.vue')['default'] + AppSpotlightEntryGQLHistory: typeof import('./components/app/spotlight/entry/GQLHistory.vue')['default'] + AppSpotlightEntryRESTHistory: typeof import('./components/app/spotlight/entry/RESTHistory.vue')['default'] AppSupport: typeof import('./components/app/Support.vue')['default'] ButtonPrimary: typeof import('./../../hoppscotch-ui/src/components/button/Primary.vue')['default'] ButtonSecondary: typeof import('./../../hoppscotch-ui/src/components/button/Secondary.vue')['default'] diff --git a/packages/hoppscotch-common/src/components/app/Footer.vue b/packages/hoppscotch-common/src/components/app/Footer.vue index f82912b61..040289322 100644 --- a/packages/hoppscotch-common/src/components/app/Footer.vue +++ b/packages/hoppscotch-common/src/components/app/Footer.vue @@ -152,7 +152,7 @@ v-tippy="{ theme: 'tooltip', allowHTML: true }" :title="`${t( 'app.shortcuts' - )} ${getSpecialKey()}K`" + )} ${getSpecialKey()}/`" :icon="IconZap" @click="invokeAction('flyouts.keybinds.toggle')" /> diff --git a/packages/hoppscotch-common/src/components/app/Fuse.vue b/packages/hoppscotch-common/src/components/app/Fuse.vue deleted file mode 100644 index c6740137e..000000000 --- a/packages/hoppscotch-common/src/components/app/Fuse.vue +++ /dev/null @@ -1,69 +0,0 @@ - - - diff --git a/packages/hoppscotch-common/src/components/app/Header.vue b/packages/hoppscotch-common/src/components/app/Header.vue index ceb683d3f..116b511ad 100644 --- a/packages/hoppscotch-common/src/components/app/Header.vue +++ b/packages/hoppscotch-common/src/components/app/Header.vue @@ -20,7 +20,9 @@
(null) const settings = ref(null) const logout = ref(null) const accountActions = ref(null) + +defineActionHandler( + "user.login", + () => { + invokeAction("modals.login.toggle") + }, + computed(() => !currentUser.value) +) diff --git a/packages/hoppscotch-common/src/components/app/PowerSearch.vue b/packages/hoppscotch-common/src/components/app/PowerSearch.vue deleted file mode 100644 index 88645191b..000000000 --- a/packages/hoppscotch-common/src/components/app/PowerSearch.vue +++ /dev/null @@ -1,122 +0,0 @@ - - - diff --git a/packages/hoppscotch-common/src/components/app/PowerSearchEntry.vue b/packages/hoppscotch-common/src/components/app/PowerSearchEntry.vue deleted file mode 100644 index 631e06cfb..000000000 --- a/packages/hoppscotch-common/src/components/app/PowerSearchEntry.vue +++ /dev/null @@ -1,68 +0,0 @@ - - - - - diff --git a/packages/hoppscotch-common/src/components/app/Shortcuts.vue b/packages/hoppscotch-common/src/components/app/Shortcuts.vue index 155765e46..dc5d0e608 100644 --- a/packages/hoppscotch-common/src/components/app/Shortcuts.vue +++ b/packages/hoppscotch-common/src/components/app/Shortcuts.vue @@ -14,42 +14,14 @@ />
-
-
- - - - {{ t(map.item.section) }} - - -
- -
-
- +
+ -
-
@@ -60,13 +32,13 @@ - {{ t(map.section) }} + {{ sectionTitle }}
@@ -77,10 +49,11 @@ diff --git a/packages/hoppscotch-common/src/components/app/spotlight/Entry.vue b/packages/hoppscotch-common/src/components/app/spotlight/Entry.vue new file mode 100644 index 000000000..1d0593ba9 --- /dev/null +++ b/packages/hoppscotch-common/src/components/app/spotlight/Entry.vue @@ -0,0 +1,122 @@ + + + + + + + diff --git a/packages/hoppscotch-common/src/components/app/spotlight/entry/GQLHistory.vue b/packages/hoppscotch-common/src/components/app/spotlight/entry/GQLHistory.vue new file mode 100644 index 000000000..b1a845dbb --- /dev/null +++ b/packages/hoppscotch-common/src/components/app/spotlight/entry/GQLHistory.vue @@ -0,0 +1,30 @@ + + + diff --git a/packages/hoppscotch-common/src/components/app/spotlight/entry/RESTHistory.vue b/packages/hoppscotch-common/src/components/app/spotlight/entry/RESTHistory.vue new file mode 100644 index 000000000..da1d8d21e --- /dev/null +++ b/packages/hoppscotch-common/src/components/app/spotlight/entry/RESTHistory.vue @@ -0,0 +1,43 @@ + + + diff --git a/packages/hoppscotch-common/src/components/app/spotlight/index.vue b/packages/hoppscotch-common/src/components/app/spotlight/index.vue new file mode 100644 index 000000000..cebd053f7 --- /dev/null +++ b/packages/hoppscotch-common/src/components/app/spotlight/index.vue @@ -0,0 +1,238 @@ + + + diff --git a/packages/hoppscotch-common/src/components/firebase/Logout.vue b/packages/hoppscotch-common/src/components/firebase/Logout.vue index 8da86d6ad..58c5e2779 100644 --- a/packages/hoppscotch-common/src/components/firebase/Logout.vue +++ b/packages/hoppscotch-common/src/components/firebase/Logout.vue @@ -1,12 +1,12 @@