fix: codegen breaking in example tab and minor UI updates (#4478)

Co-authored-by: jamesgeorge007 <25279263+jamesgeorge007@users.noreply.github.com>

packages/hoppscotch-common/locales/en.json

@@ -1046,7 +1046,7 @@
     "websocket": "WebSocket"
   },
   "team": {
-    "already_member": "You are already a member of this workspace. Contact your workspace owner.",
+    "already_member": "This email is associated with an existing user.",
     "create_new": "Create new workspace",
     "deleted": "Workspace deleted",
     "edit": "Edit Workspace",
@@ -1073,7 +1073,7 @@
     "login_to_continue": "Login to continue",
     "login_to_continue_description": "You need to be logged in to join a workspace.",
     "logout_and_try_again": "Logout and sign in with another account",
-    "member_has_invite": "This email ID already has an invite. Contact your workspace owner.",
+    "member_has_invite": "User already has an invite. Please ask them to check their inbox or revoke and resend the invite.",
     "member_not_found": "Member not found. Contact your workspace owner.",
     "member_removed": "User removed",
     "member_role_updated": "User roles updated",
@@ -1097,12 +1097,13 @@
     "select_a_team": "Select a workspace",
     "success_invites": "Success invites",
     "title": "Workspaces",
-    "we_sent_invite_link": "We sent an invite link to all invitees!",
+    "we_sent_invite_link": "Invitations are on the way",
     "invite_sent_smtp_disabled": "Invite links generated",
-    "we_sent_invite_link_description": "Ask all invitees to check their inbox. Click on the link to join the workspace.",
+    "we_sent_invite_link_description": " New invitees will receive a link to join the workspace, existing members and pending invitees won't receive a new link.",
     "invite_sent_smtp_disabled_description": "Sending invite emails is disabled for this instance of Hoppscotch. Please use the Copy link button to copy and share the invite link manually.",
     "copy_invite_link": "Copy Invite Link",
-    "search_title": "Team Requests"
+    "search_title": "Team Requests",
+    "user_not_found": "User not found in the instance."
   },
   "team_environment": {
     "deleted": "Environment Deleted",

packages/hoppscotch-common/src/components/collections/Request.vue

@@ -26,7 +26,7 @@
         <component
           :is="isResponseVisible ? IconArrowDown : IconArrowRight"
           v-if="request.responses && Object.keys(request.responses).length > 0"
-          class="svg-icons cursor-pointer hover:bg-primaryDark transition"
+          class="svg-icons cursor-pointer hover:bg-primaryDark transition rounded"
           @click="toggleRequestResponse()"
         />
       </div>

packages/hoppscotch-common/src/components/http/Codegen.vue

@@ -136,13 +136,23 @@ import { RESTTabService } from "~/services/tab/rest"
 import IconCheck from "~icons/lucide/check"
 import IconWrapText from "~icons/lucide/wrap-text"
 import { asyncComputed } from "@vueuse/core"
+import { getDefaultRESTRequest } from "~/helpers/rest/default"
 
 const t = useI18n()
 
 const tabs = useService(RESTTabService)
-const request = computed(() =>
-  cloneDeep(tabs.currentActiveTab.value.document.request)
+
+// get the current active request if the current active tab is a request else get the original request from the response tab
+const currentActiveRequest = computed(() =>
+  tabs.currentActiveTab.value.document.type === "request"
+    ? tabs.currentActiveTab.value.document.request
+    : makeRESTRequest({
+        ...getDefaultRESTRequest(),
+        ...tabs.currentActiveTab.value.document.response.originalRequest,
+      })
 )
+
+const request = computed(() => cloneDeep(currentActiveRequest.value))
 const codegenType = ref<CodegenName>("shell-curl")
 const errorState = ref(false)
 

packages/hoppscotch-common/src/components/lenses/renderers/JSONLensRenderer.vue

@@ -285,7 +285,7 @@ const props = defineProps<{
 
 const emit = defineEmits<{
   (e: "save-as-example"): void
-  (e: "update:response", val: HoppRESTRequestResponse): void
+  (e: "update:response", val: HoppRESTRequestResponse | HoppRESTResponse): void
 }>()
 
 const showResponse = computed(() => {
@@ -444,7 +444,10 @@ const { cursor } = useCodemirror(
     completer: null,
     environmentHighlights: true,
     onChange: (update: string) => {
-      emit("update:response", { ...props.response, body: update })
+      emit("update:response", {
+        ...props.response,
+        body: update,
+      } as HoppRESTRequestResponse)
     },
   })
 )

packages/hoppscotch-common/src/components/lenses/renderers/RawLensRenderer.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-1 flex-col">
     <div
-      class="sticky top-lowerSecondaryStickyFold z-10 flex flex-shrink-0 items-center justify-between overflow-x-auto border-b border-dividerLight bg-primary pl-4 py-1"
+      class="sticky top-lowerSecondaryStickyFold z-10 flex flex-shrink-0 items-center justify-between overflow-x-auto border-b border-dividerLight bg-primary pl-4"
       :class="{ 'py-2': !responseBodyText }"
     >
       <label class="truncate font-semibold text-secondaryLight">
@@ -180,7 +180,10 @@ useCodemirror(
     completer: null,
     environmentHighlights: true,
     onChange: (update: string) => {
-      emit("update:response", { ...props.response, body: update })
+      emit("update:response", {
+        ...props.response,
+        body: update,
+      } as HoppRESTRequestResponse)
     },
   })
 )

packages/hoppscotch-common/src/components/teams/Invite.vue

@@ -34,8 +34,9 @@
             <div
               v-for="(invitee, index) in successInvites"
               :key="`invitee-${index}`"
+              class="flex items-center"
             >
-              <p class="flex items-center">
+              <p class="flex items-center flex-1">
                 <component
                   :is="IconMailCheck"
                   class="svg-icons mr-4 text-green-500"
@@ -69,6 +70,7 @@
             <div
               v-for="(invitee, index) in failedInvites"
               :key="`invitee-${index}`"
+              class="flex flex-col"
             >
               <p class="flex items-center">
                 <component
@@ -77,7 +79,7 @@
                 />
                 <span class="truncate">{{ invitee.email }}</span>
               </p>
-              <p class="ml-8 mt-2 text-red-500">
+              <p class="ml-8 mt-1 text-secondaryLight text-tiny">
                 {{ getErrorMessage(invitee.error) }}
               </p>
             </div>
@@ -660,6 +662,8 @@ const getErrorMessage = (error: SendInvitesErrorType) => {
       return t("team.already_member")
     case "team_invite/member_has_invite":
       return t("team.member_has_invite")
+    case "user/not_found":
+      return t("team.user_not_found")
   }
 }
 

packages/hoppscotch-common/src/helpers/backend/mutations/TeamInvitation.ts

@@ -21,6 +21,7 @@ export type CreateTeamInvitationErrors =
   | "team/member_not_found"
   | "team_invite/already_member"
   | "team_invite/member_has_invite"
+  | "user/not_found"
 
 type RevokeTeamInvitationErrors =
   | "team/not_required_role"