fix: minor spotlight related issues (#3271)

Co-authored-by: Andrew Bastin <andrewbastin.k@gmail.com>

packages/hoppscotch-common/locales/en.json

@@ -610,7 +610,7 @@
       "head_method": "Select HEAD method",
       "rename": "Rename Current Request",
       "import_curl": "Import cURL",
-      "show_code": "Show generated code",
+      "show_code": "Generate code snippet",
       "method": "Method",
       "next_method": "Select Next method",
       "post_method": "Select POST method",
@@ -695,7 +695,7 @@
     },
     "tab": {
       "close_current": "Close current tab",
-      "close_others": "Close others tab",
+      "close_others": "Close other tabs",
       "new_tab": "Open a new tab",
       "title": "Tabs"
     },

packages/hoppscotch-common/src/components/app/Header.vue

@@ -254,8 +254,10 @@ import TeamListAdapter from "~/helpers/teams/TeamListAdapter"
 import { onLoggedIn } from "~/composables/auth"
 import { GetMyTeamsQuery } from "~/helpers/backend/graphql"
 import { getPlatformSpecialKey } from "~/helpers/platformutils"
+import { useToast } from "~/composables/toast"
 
 const t = useI18n()
+const toast = useToast()
 
 /**
  * Once the PWA code is initialized, this holds a method
@@ -372,6 +374,8 @@ const handleTeamEdit = () => {
     editingTeamID.value = workspace.value.teamID
     editingTeamName.value = { name: selectedTeam.value.name }
     displayModalEdit(true)
+  } else {
+    noPermission()
   }
 }
 
@@ -382,12 +386,7 @@ const settings = ref<any | null>(null)
 const logout = ref<any | null>(null)
 const accountActions = ref<any | null>(null)
 
-defineActionHandler("modals.team.edit", () => {
+defineActionHandler("modals.team.edit", handleTeamEdit)
-  // TODO: Remove this hack
-  setTimeout(() => {
-    handleTeamEdit()
-  }, 100)
-})
 
 defineActionHandler("modals.team.invite", () => {
   if (
@@ -395,6 +394,8 @@ defineActionHandler("modals.team.invite", () => {
     selectedTeam.value?.myRole === "EDITOR"
   ) {
     inviteTeam({ name: selectedTeam.value.name }, selectedTeam.value.id)
+  } else {
+    noPermission()
   }
 })
 
@@ -405,4 +406,8 @@ defineActionHandler(
   },
   computed(() => !currentUser.value)
 )
+
+const noPermission = () => {
+  toast.error(`${t("profile.no_permission")}`)
+}
 </script>

packages/hoppscotch-common/src/pages/index.vue

@@ -458,12 +458,7 @@ defineActionHandler("rest.request.open", ({ doc }) => {
   createNewTab(doc)
 })
 
-defineActionHandler("rest.request.rename", () => {
+defineActionHandler("rest.request.rename", openReqRenameModal)
-  // TODO: Fix this hack to open the modal
-  setTimeout(() => {
-    openReqRenameModal()
-  }, 100)
-})
 
 const inspectionService = useService(InspectionService)
 useService(HeaderInspectorService)

packages/hoppscotch-common/src/services/spotlight/searchers/environment.searcher.ts

@@ -71,7 +71,9 @@ export class EnvironmentsSpotlightSearcherService extends StaticSpotlightSearche
 
   private selectedEnvIndex = useStreamStatic(
     selectedEnvironmentIndex$,
-    null,
+    {
+      type: "NO_ENV_SELECTED",
+    },
     () => {
       /* noop */
     }

packages/hoppscotch-common/src/services/spotlight/searchers/tab.searcher.ts

@@ -43,7 +43,7 @@ export class TabSpotlightSearcherService extends StaticSpotlightSearcherService<
       alternates: ["tab", "close", "close tab"],
       icon: markRaw(IconWindow),
     },
-    close_others_tab: {
+    close_other_tabs: {
       text: this.t("spotlight.tab.close_others"),
       alternates: ["tab", "close", "close all"],
       icon: markRaw(IconWindow),
@@ -81,7 +81,7 @@ export class TabSpotlightSearcherService extends StaticSpotlightSearcherService<
 
   public onDocSelected(id: string): void {
     if (id === "close_current_tab") closeTab(currentTabID.value)
-    if (id === "close_others_tab") closeOtherTabs(currentTabID.value)
+    if (id === "close_other_tabs") closeOtherTabs(currentTabID.value)
     if (id === "open_new_tab")
       createNewTab({
         request: getDefaultRESTRequest(),

packages/hoppscotch-common/src/services/spotlight/searchers/workspace.searcher.ts

@@ -8,7 +8,7 @@ import {
   ref,
   watch,
 } from "vue"
-import { invokeAction } from "~/helpers/actions"
+import { activeActions$, invokeAction } from "~/helpers/actions"
 import { getI18n } from "~/modules/i18n"
 import {
   SpotlightSearcher,
@@ -66,6 +66,14 @@ export class WorkspaceSpotlightSearcherService extends StaticSpotlightSearcherSe
     }
   )[0]
 
+  private activeActions = useStreamStatic(activeActions$, [], () => {
+    /* noop */
+  })[0]
+
+  private isLoggedInUser = computed(() =>
+    this.activeActions.value.includes("user.logout")
+  )
+
   private isTeamSelected = computed(
     () =>
       this.workspace.value.type === "team" &&
@@ -77,6 +85,7 @@ export class WorkspaceSpotlightSearcherService extends StaticSpotlightSearcherSe
       text: this.t("spotlight.workspace.new"),
       alternates: ["new", "team", "workspace"],
       icon: markRaw(IconUsers),
+      excludeFromSearch: computed(() => !this.isLoggedInUser.value),
     },
     edit_team: {
       text: this.t("spotlight.workspace.edit"),

packages/hoppscotch-ui/src/components/smart/Input.vue

@@ -3,12 +3,12 @@
     <input
       :id="inputID"
       class="input"
+      ref="inputRef"
       :class="inputStyles"
       v-model="inputText"
       v-focus
       :placeholder="placeholder"
       :type="type"
-      @keyup.enter="emit('submit')"
       autocomplete="off"
       required
       :disabled="disabled"
@@ -31,8 +31,8 @@ let inputIDCounter = 564275
 </script>
 
 <script setup lang="ts">
-import { useVModel } from "@vueuse/core"
+import { onKeyStroke, useVModel } from "@vueuse/core"
-import { defineProps } from "vue"
+import { defineProps, ref } from "vue"
 
 // Unique ID for input
 const inputID = `input-${inputIDCounter++}`
@@ -65,5 +65,13 @@ const emit = defineEmits<{
   (e: "update:modelValue", v: string): void
 }>()
 
+const inputRef = ref()
+
 const inputText = useVModel(props, "modelValue", emit)
+
+onKeyStroke("Enter", (e) => {
+  if (!e.repeat) {
+    return emit("submit")
+  }
+}, { target: inputRef, eventName: "keydown" })
 </script>