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

feat: new ui for response interface generation (#4105)

Browse Source 
* feat: codegen body added

* feat: new ui added for response interface

* feat: generate code component added

* chore: default collection tab

* feat: generate data schema

* chore: clean up

* chore: minor code refactor

* fix: only render if `isDrawerOpen` is true

* chore: clean up

* chore: clean up

---------

Co-authored-by: nivedin <nivedinp@gmail.com>
This commit is contained in:
Anwarul Islam
2024-08-30 12:40:52 +06:00
committed by GitHub
parent a177bdced0
commit 9ad6a419c1
8 changed files with 467 additions and 251 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
packages/hoppscotch-common/locales/en.json
View File

@@ -641,7 +641,9 @@
"title": "Response",
"video": "Video",
"waiting_for_connection": "waiting for connection",
"xml": "XML"
"xml": "XML",
"generate_data_schema": "Generate Data Schema",
"data_schema": "Data Schema"
},
"settings": {
"accent_color": "Accent color",

447
packages/hoppscotch-common/src/components.d.ts vendored
View File

@@ -5,229 +5,230 @@
// Read more: https://github.com/vuejs/core/pull/3399
export {}
declare module 'vue' {
declare module "vue" {
export interface GlobalComponents {
AccessTokens: typeof import('./components/accessTokens/index.vue')['default']
AccessTokensGenerateModal: typeof import('./components/accessTokens/GenerateModal.vue')['default']
AccessTokensList: typeof import('./components/accessTokens/List.vue')['default']
AccessTokensOverview: typeof import('./components/accessTokens/Overview.vue')['default']
AppActionHandler: typeof import('./components/app/ActionHandler.vue')['default']
AppBanner: typeof import('./components/app/Banner.vue')['default']
AppContextMenu: typeof import('./components/app/ContextMenu.vue')['default']
AppDeveloperOptions: typeof import('./components/app/DeveloperOptions.vue')['default']
AppFooter: typeof import('./components/app/Footer.vue')['default']
AppGitHubStarButton: typeof import('./components/app/GitHubStarButton.vue')['default']
AppHeader: typeof import('./components/app/Header.vue')['default']
AppInspection: typeof import('./components/app/Inspection.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']
AppPWAPrompt: typeof import('./components/app/PWAPrompt.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']
AppSpotlightEntryGQLRequest: typeof import('./components/app/spotlight/entry/GQLRequest.vue')['default']
AppSpotlightEntryIconSelected: typeof import('./components/app/spotlight/entry/IconSelected.vue')['default']
AppSpotlightEntryRESTHistory: typeof import('./components/app/spotlight/entry/RESTHistory.vue')['default']
AppSpotlightEntryRESTRequest: typeof import('./components/app/spotlight/entry/RESTRequest.vue')['default']
AppSpotlightEntryRESTTeamRequestEntry: typeof import('./components/app/spotlight/entry/RESTTeamRequestEntry.vue')['default']
AppSpotlightSearch: typeof import('./components/app/SpotlightSearch.vue')['default']
AppSupport: typeof import('./components/app/Support.vue')['default']
AppWhatsNewDialog: typeof import('./components/app/WhatsNewDialog.vue')['default']
Collections: typeof import('./components/collections/index.vue')['default']
CollectionsAdd: typeof import('./components/collections/Add.vue')['default']
CollectionsAddFolder: typeof import('./components/collections/AddFolder.vue')['default']
CollectionsAddRequest: typeof import('./components/collections/AddRequest.vue')['default']
CollectionsCollection: typeof import('./components/collections/Collection.vue')['default']
CollectionsEdit: typeof import('./components/collections/Edit.vue')['default']
CollectionsEditFolder: typeof import('./components/collections/EditFolder.vue')['default']
CollectionsEditRequest: typeof import('./components/collections/EditRequest.vue')['default']
CollectionsGraphql: typeof import('./components/collections/graphql/index.vue')['default']
CollectionsGraphqlAdd: typeof import('./components/collections/graphql/Add.vue')['default']
CollectionsGraphqlAddFolder: typeof import('./components/collections/graphql/AddFolder.vue')['default']
CollectionsGraphqlAddRequest: typeof import('./components/collections/graphql/AddRequest.vue')['default']
CollectionsGraphqlCollection: typeof import('./components/collections/graphql/Collection.vue')['default']
CollectionsGraphqlEdit: typeof import('./components/collections/graphql/Edit.vue')['default']
CollectionsGraphqlEditFolder: typeof import('./components/collections/graphql/EditFolder.vue')['default']
CollectionsGraphqlEditRequest: typeof import('./components/collections/graphql/EditRequest.vue')['default']
CollectionsGraphqlFolder: typeof import('./components/collections/graphql/Folder.vue')['default']
CollectionsGraphqlImportExport: typeof import('./components/collections/graphql/ImportExport.vue')['default']
CollectionsGraphqlRequest: typeof import('./components/collections/graphql/Request.vue')['default']
CollectionsImportExport: typeof import('./components/collections/ImportExport.vue')['default']
CollectionsMyCollections: typeof import('./components/collections/MyCollections.vue')['default']
CollectionsProperties: typeof import('./components/collections/Properties.vue')['default']
CollectionsRequest: typeof import('./components/collections/Request.vue')['default']
CollectionsRunner: typeof import('./components/collections/Runner.vue')['default']
CollectionsSaveRequest: typeof import('./components/collections/SaveRequest.vue')['default']
CollectionsTeamCollections: typeof import('./components/collections/TeamCollections.vue')['default']
CookiesAllModal: typeof import('./components/cookies/AllModal.vue')['default']
CookiesEditCookie: typeof import('./components/cookies/EditCookie.vue')['default']
Embeds: typeof import('./components/embeds/index.vue')['default']
EmbedsHeader: typeof import('./components/embeds/Header.vue')['default']
EmbedsRequest: typeof import('./components/embeds/Request.vue')['default']
Environments: typeof import('./components/environments/index.vue')['default']
EnvironmentsAdd: typeof import('./components/environments/Add.vue')['default']
EnvironmentsImportExport: typeof import('./components/environments/ImportExport.vue')['default']
EnvironmentsMy: typeof import('./components/environments/my/index.vue')['default']
EnvironmentsMyDetails: typeof import('./components/environments/my/Details.vue')['default']
EnvironmentsMyEnvironment: typeof import('./components/environments/my/Environment.vue')['default']
EnvironmentsProperties: typeof import('./components/environments/Properties.vue')['default']
EnvironmentsSelector: typeof import('./components/environments/Selector.vue')['default']
EnvironmentsTeams: typeof import('./components/environments/teams/index.vue')['default']
EnvironmentsTeamsDetails: typeof import('./components/environments/teams/Details.vue')['default']
EnvironmentsTeamsEnvironment: typeof import('./components/environments/teams/Environment.vue')['default']
FirebaseLogin: typeof import('./components/firebase/Login.vue')['default']
FirebaseLogout: typeof import('./components/firebase/Logout.vue')['default']
GraphqlAuthorization: typeof import('./components/graphql/Authorization.vue')['default']
GraphqlField: typeof import('./components/graphql/Field.vue')['default']
GraphqlHeaders: typeof import('./components/graphql/Headers.vue')['default']
GraphqlQuery: typeof import('./components/graphql/Query.vue')['default']
GraphqlRequest: typeof import('./components/graphql/Request.vue')['default']
GraphqlRequestOptions: typeof import('./components/graphql/RequestOptions.vue')['default']
GraphqlRequestTab: typeof import('./components/graphql/RequestTab.vue')['default']
GraphqlResponse: typeof import('./components/graphql/Response.vue')['default']
GraphqlSidebar: typeof import('./components/graphql/Sidebar.vue')['default']
GraphqlSubscriptionLog: typeof import('./components/graphql/SubscriptionLog.vue')['default']
GraphqlTabHead: typeof import('./components/graphql/TabHead.vue')['default']
GraphqlType: typeof import('./components/graphql/Type.vue')['default']
GraphqlTypeLink: typeof import('./components/graphql/TypeLink.vue')['default']
GraphqlVariable: typeof import('./components/graphql/Variable.vue')['default']
History: typeof import('./components/history/index.vue')['default']
HistoryGraphqlCard: typeof import('./components/history/graphql/Card.vue')['default']
HistoryRestCard: typeof import('./components/history/rest/Card.vue')['default']
HoppButtonPrimary: typeof import('@hoppscotch/ui')['HoppButtonPrimary']
HoppButtonSecondary: typeof import('@hoppscotch/ui')['HoppButtonSecondary']
HoppSmartAnchor: typeof import('@hoppscotch/ui')['HoppSmartAnchor']
HoppSmartCheckbox: typeof import('@hoppscotch/ui')['HoppSmartCheckbox']
HoppSmartConfirmModal: typeof import('@hoppscotch/ui')['HoppSmartConfirmModal']
HoppSmartExpand: typeof import('@hoppscotch/ui')['HoppSmartExpand']
HoppSmartFileChip: typeof import('@hoppscotch/ui')['HoppSmartFileChip']
HoppSmartInput: typeof import('@hoppscotch/ui')['HoppSmartInput']
HoppSmartIntersection: typeof import('@hoppscotch/ui')['HoppSmartIntersection']
HoppSmartItem: typeof import('@hoppscotch/ui')['HoppSmartItem']
HoppSmartLink: typeof import('@hoppscotch/ui')['HoppSmartLink']
HoppSmartModal: typeof import('@hoppscotch/ui')['HoppSmartModal']
HoppSmartPicture: typeof import('@hoppscotch/ui')['HoppSmartPicture']
HoppSmartPlaceholder: typeof import('@hoppscotch/ui')['HoppSmartPlaceholder']
HoppSmartProgressRing: typeof import('@hoppscotch/ui')['HoppSmartProgressRing']
HoppSmartRadio: typeof import('@hoppscotch/ui')['HoppSmartRadio']
HoppSmartRadioGroup: typeof import('@hoppscotch/ui')['HoppSmartRadioGroup']
HoppSmartSelectWrapper: typeof import('@hoppscotch/ui')['HoppSmartSelectWrapper']
HoppSmartSlideOver: typeof import('@hoppscotch/ui')['HoppSmartSlideOver']
HoppSmartSpinner: typeof import('@hoppscotch/ui')['HoppSmartSpinner']
HoppSmartTab: typeof import('@hoppscotch/ui')['HoppSmartTab']
HoppSmartTabs: typeof import('@hoppscotch/ui')['HoppSmartTabs']
HoppSmartToggle: typeof import('@hoppscotch/ui')['HoppSmartToggle']
HoppSmartTree: typeof import('@hoppscotch/ui')['HoppSmartTree']
HoppSmartWindow: typeof import('@hoppscotch/ui')['HoppSmartWindow']
HoppSmartWindows: typeof import('@hoppscotch/ui')['HoppSmartWindows']
HttpAuthorization: typeof import('./components/http/Authorization.vue')['default']
HttpAuthorizationApiKey: typeof import('./components/http/authorization/ApiKey.vue')['default']
HttpAuthorizationBasic: typeof import('./components/http/authorization/Basic.vue')['default']
HttpBody: typeof import('./components/http/Body.vue')['default']
HttpBodyParameters: typeof import('./components/http/BodyParameters.vue')['default']
HttpCodegen: typeof import('./components/http/Codegen.vue')['default']
HttpCodegenModal: typeof import('./components/http/CodegenModal.vue')['default']
HttpHeaders: typeof import('./components/http/Headers.vue')['default']
HttpImportCurl: typeof import('./components/http/ImportCurl.vue')['default']
HttpKeyValue: typeof import('./components/http/KeyValue.vue')['default']
HttpOAuth2Authorization: typeof import('./components/http/OAuth2Authorization.vue')['default']
HttpParameters: typeof import('./components/http/Parameters.vue')['default']
HttpPreRequestScript: typeof import('./components/http/PreRequestScript.vue')['default']
HttpRawBody: typeof import('./components/http/RawBody.vue')['default']
HttpReqChangeConfirmModal: typeof import('./components/http/ReqChangeConfirmModal.vue')['default']
HttpRequest: typeof import('./components/http/Request.vue')['default']
HttpRequestOptions: typeof import('./components/http/RequestOptions.vue')['default']
HttpRequestTab: typeof import('./components/http/RequestTab.vue')['default']
HttpRequestVariables: typeof import('./components/http/RequestVariables.vue')['default']
HttpResponse: typeof import('./components/http/Response.vue')['default']
HttpResponseMeta: typeof import('./components/http/ResponseMeta.vue')['default']
HttpSidebar: typeof import('./components/http/Sidebar.vue')['default']
HttpTabHead: typeof import('./components/http/TabHead.vue')['default']
HttpTestResult: typeof import('./components/http/TestResult.vue')['default']
HttpTestResultEntry: typeof import('./components/http/TestResultEntry.vue')['default']
HttpTestResultEnv: typeof import('./components/http/TestResultEnv.vue')['default']
HttpTestResultReport: typeof import('./components/http/TestResultReport.vue')['default']
HttpTests: typeof import('./components/http/Tests.vue')['default']
HttpURLEncodedParams: typeof import('./components/http/URLEncodedParams.vue')['default']
IconLucideActivity: typeof import('~icons/lucide/activity')['default']
IconLucideAlertTriangle: typeof import('~icons/lucide/alert-triangle')['default']
IconLucideArrowLeft: typeof import('~icons/lucide/arrow-left')['default']
IconLucideArrowUpRight: typeof import('~icons/lucide/arrow-up-right')['default']
IconLucideBrush: typeof import('~icons/lucide/brush')['default']
IconLucideCheckCircle: typeof import('~icons/lucide/check-circle')['default']
IconLucideChevronRight: typeof import('~icons/lucide/chevron-right')['default']
IconLucideGlobe: typeof import('~icons/lucide/globe')['default']
IconLucideHelpCircle: typeof import('~icons/lucide/help-circle')['default']
IconLucideInbox: typeof import('~icons/lucide/inbox')['default']
IconLucideInfo: typeof import('~icons/lucide/info')['default']
IconLucideLayers: typeof import('~icons/lucide/layers')['default']
IconLucideListEnd: typeof import('~icons/lucide/list-end')['default']
IconLucideMinus: typeof import('~icons/lucide/minus')['default']
IconLucideRss: typeof import('~icons/lucide/rss')['default']
IconLucideSearch: typeof import('~icons/lucide/search')['default']
IconLucideUsers: typeof import('~icons/lucide/users')['default']
IconLucideX: typeof import('~icons/lucide/x')['default']
ImportExportBase: typeof import('./components/importExport/Base.vue')['default']
ImportExportImportExportList: typeof import('./components/importExport/ImportExportList.vue')['default']
ImportExportImportExportSourcesList: typeof import('./components/importExport/ImportExportSourcesList.vue')['default']
ImportExportImportExportStepsFileImport: typeof import('./components/importExport/ImportExportSteps/FileImport.vue')['default']
ImportExportImportExportStepsMyCollectionImport: typeof import('./components/importExport/ImportExportSteps/MyCollectionImport.vue')['default']
ImportExportImportExportStepsUrlImport: typeof import('./components/importExport/ImportExportSteps/UrlImport.vue')['default']
InterceptorsErrorPlaceholder: typeof import('./components/interceptors/ErrorPlaceholder.vue')['default']
InterceptorsExtensionSubtitle: typeof import('./components/interceptors/ExtensionSubtitle.vue')['default']
LensesHeadersRenderer: typeof import('./components/lenses/HeadersRenderer.vue')['default']
LensesHeadersRendererEntry: typeof import('./components/lenses/HeadersRendererEntry.vue')['default']
LensesRenderersAudioLensRenderer: typeof import('./components/lenses/renderers/AudioLensRenderer.vue')['default']
LensesRenderersHTMLLensRenderer: typeof import('./components/lenses/renderers/HTMLLensRenderer.vue')['default']
LensesRenderersImageLensRenderer: typeof import('./components/lenses/renderers/ImageLensRenderer.vue')['default']
LensesRenderersJSONLensRenderer: typeof import('./components/lenses/renderers/JSONLensRenderer.vue')['default']
LensesRenderersPDFLensRenderer: typeof import('./components/lenses/renderers/PDFLensRenderer.vue')['default']
LensesRenderersRawLensRenderer: typeof import('./components/lenses/renderers/RawLensRenderer.vue')['default']
LensesRenderersVideoLensRenderer: typeof import('./components/lenses/renderers/VideoLensRenderer.vue')['default']
LensesRenderersXMLLensRenderer: typeof import('./components/lenses/renderers/XMLLensRenderer.vue')['default']
LensesResponseBodyRenderer: typeof import('./components/lenses/ResponseBodyRenderer.vue')['default']
ModalsNativeCACertificates: typeof import('./../../hoppscotch-selfhost-desktop/src/components/modals/NativeCACertificates.vue')['default']
ModalsNativeClientCertificates: typeof import('./../../hoppscotch-selfhost-desktop/src/components/modals/NativeClientCertificates.vue')['default']
ModalsNativeClientCertsAdd: typeof import('./../../hoppscotch-selfhost-desktop/src/components/modals/NativeClientCertsAdd.vue')['default']
ProfileUserDelete: typeof import('./components/profile/UserDelete.vue')['default']
RealtimeCommunication: typeof import('./components/realtime/Communication.vue')['default']
RealtimeConnectionConfig: typeof import('./components/realtime/ConnectionConfig.vue')['default']
RealtimeLog: typeof import('./components/realtime/Log.vue')['default']
RealtimeLogEntry: typeof import('./components/realtime/LogEntry.vue')['default']
RealtimeSubscription: typeof import('./components/realtime/Subscription.vue')['default']
SettingsExtension: typeof import('./components/settings/Extension.vue')['default']
SettingsNativeInterceptor: typeof import('./../../hoppscotch-selfhost-desktop/src/components/settings/NativeInterceptor.vue')['default']
SettingsProxy: typeof import('./components/settings/Proxy.vue')['default']
Share: typeof import('./components/share/index.vue')['default']
ShareCreateModal: typeof import('./components/share/CreateModal.vue')['default']
ShareCustomizeModal: typeof import('./components/share/CustomizeModal.vue')['default']
ShareModal: typeof import('./components/share/Modal.vue')['default']
ShareRequest: typeof import('./components/share/Request.vue')['default']
ShareTemplatesButton: typeof import('./components/share/templates/Button.vue')['default']
ShareTemplatesEmbeds: typeof import('./components/share/templates/Embeds.vue')['default']
ShareTemplatesLink: typeof import('./components/share/templates/Link.vue')['default']
SmartAccentModePicker: typeof import('./components/smart/AccentModePicker.vue')['default']
SmartChangeLanguage: typeof import('./components/smart/ChangeLanguage.vue')['default']
SmartColorModePicker: typeof import('./components/smart/ColorModePicker.vue')['default']
SmartEnvInput: typeof import('./components/smart/EnvInput.vue')['default']
TabPrimary: typeof import('./components/tab/Primary.vue')['default']
TabSecondary: typeof import('./components/tab/Secondary.vue')['default']
Teams: typeof import('./components/teams/index.vue')['default']
TeamsAdd: typeof import('./components/teams/Add.vue')['default']
TeamsEdit: typeof import('./components/teams/Edit.vue')['default']
TeamsInvite: typeof import('./components/teams/Invite.vue')['default']
TeamsMemberStack: typeof import('./components/teams/MemberStack.vue')['default']
TeamsModal: typeof import('./components/teams/Modal.vue')['default']
TeamsTeam: typeof import('./components/teams/Team.vue')['default']
Tippy: typeof import('vue-tippy')['Tippy']
WorkspaceCurrent: typeof import('./components/workspace/Current.vue')['default']
WorkspaceSelector: typeof import('./components/workspace/Selector.vue')['default']
AccessTokens: (typeof import("./components/accessTokens/index.vue"))["default"]
AccessTokensGenerateModal: (typeof import("./components/accessTokens/GenerateModal.vue"))["default"]
AccessTokensList: (typeof import("./components/accessTokens/List.vue"))["default"]
AccessTokensOverview: (typeof import("./components/accessTokens/Overview.vue"))["default"]
AppActionHandler: (typeof import("./components/app/ActionHandler.vue"))["default"]
AppBanner: (typeof import("./components/app/Banner.vue"))["default"]
AppContextMenu: (typeof import("./components/app/ContextMenu.vue"))["default"]
AppDeveloperOptions: (typeof import("./components/app/DeveloperOptions.vue"))["default"]
AppDrawer: (typeof import("./components/app/Drawer.vue"))["default"]
AppFooter: (typeof import("./components/app/Footer.vue"))["default"]
AppGitHubStarButton: (typeof import("./components/app/GitHubStarButton.vue"))["default"]
AppHeader: (typeof import("./components/app/Header.vue"))["default"]
AppInspection: (typeof import("./components/app/Inspection.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"]
AppPWAPrompt: (typeof import("./components/app/PWAPrompt.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"]
AppSpotlightEntryGQLRequest: (typeof import("./components/app/spotlight/entry/GQLRequest.vue"))["default"]
AppSpotlightEntryIconSelected: (typeof import("./components/app/spotlight/entry/IconSelected.vue"))["default"]
AppSpotlightEntryRESTHistory: (typeof import("./components/app/spotlight/entry/RESTHistory.vue"))["default"]
AppSpotlightEntryRESTRequest: (typeof import("./components/app/spotlight/entry/RESTRequest.vue"))["default"]
AppSpotlightEntryRESTTeamRequestEntry: (typeof import("./components/app/spotlight/entry/RESTTeamRequestEntry.vue"))["default"]
AppSpotlightSearch: (typeof import("./components/app/SpotlightSearch.vue"))["default"]
AppSupport: (typeof import("./components/app/Support.vue"))["default"]
AppWhatsNewDialog: (typeof import("./components/app/WhatsNewDialog.vue"))["default"]
Collections: (typeof import("./components/collections/index.vue"))["default"]
CollectionsAdd: (typeof import("./components/collections/Add.vue"))["default"]
CollectionsAddFolder: (typeof import("./components/collections/AddFolder.vue"))["default"]
CollectionsAddRequest: (typeof import("./components/collections/AddRequest.vue"))["default"]
CollectionsCollection: (typeof import("./components/collections/Collection.vue"))["default"]
CollectionsEdit: (typeof import("./components/collections/Edit.vue"))["default"]
CollectionsEditFolder: (typeof import("./components/collections/EditFolder.vue"))["default"]
CollectionsEditRequest: (typeof import("./components/collections/EditRequest.vue"))["default"]
CollectionsGraphql: (typeof import("./components/collections/graphql/index.vue"))["default"]
CollectionsGraphqlAdd: (typeof import("./components/collections/graphql/Add.vue"))["default"]
CollectionsGraphqlAddFolder: (typeof import("./components/collections/graphql/AddFolder.vue"))["default"]
CollectionsGraphqlAddRequest: (typeof import("./components/collections/graphql/AddRequest.vue"))["default"]
CollectionsGraphqlCollection: (typeof import("./components/collections/graphql/Collection.vue"))["default"]
CollectionsGraphqlEdit: (typeof import("./components/collections/graphql/Edit.vue"))["default"]
CollectionsGraphqlEditFolder: (typeof import("./components/collections/graphql/EditFolder.vue"))["default"]
CollectionsGraphqlEditRequest: (typeof import("./components/collections/graphql/EditRequest.vue"))["default"]
CollectionsGraphqlFolder: (typeof import("./components/collections/graphql/Folder.vue"))["default"]
CollectionsGraphqlImportExport: (typeof import("./components/collections/graphql/ImportExport.vue"))["default"]
CollectionsGraphqlRequest: (typeof import("./components/collections/graphql/Request.vue"))["default"]
CollectionsImportExport: (typeof import("./components/collections/ImportExport.vue"))["default"]
CollectionsMyCollections: (typeof import("./components/collections/MyCollections.vue"))["default"]
CollectionsProperties: (typeof import("./components/collections/Properties.vue"))["default"]
CollectionsRequest: (typeof import("./components/collections/Request.vue"))["default"]
CollectionsRunner: (typeof import("./components/collections/Runner.vue"))["default"]
CollectionsSaveRequest: (typeof import("./components/collections/SaveRequest.vue"))["default"]
CollectionsTeamCollections: (typeof import("./components/collections/TeamCollections.vue"))["default"]
CookiesAllModal: (typeof import("./components/cookies/AllModal.vue"))["default"]
CookiesEditCookie: (typeof import("./components/cookies/EditCookie.vue"))["default"]
Embeds: (typeof import("./components/embeds/index.vue"))["default"]
EmbedsHeader: (typeof import("./components/embeds/Header.vue"))["default"]
EmbedsRequest: (typeof import("./components/embeds/Request.vue"))["default"]
Environments: (typeof import("./components/environments/index.vue"))["default"]
EnvironmentsAdd: (typeof import("./components/environments/Add.vue"))["default"]
EnvironmentsImportExport: (typeof import("./components/environments/ImportExport.vue"))["default"]
EnvironmentsMy: (typeof import("./components/environments/my/index.vue"))["default"]
EnvironmentsMyDetails: (typeof import("./components/environments/my/Details.vue"))["default"]
EnvironmentsMyEnvironment: (typeof import("./components/environments/my/Environment.vue"))["default"]
EnvironmentsProperties: (typeof import("./components/environments/Properties.vue"))["default"]
EnvironmentsSelector: (typeof import("./components/environments/Selector.vue"))["default"]
EnvironmentsTeams: (typeof import("./components/environments/teams/index.vue"))["default"]
EnvironmentsTeamsDetails: (typeof import("./components/environments/teams/Details.vue"))["default"]
EnvironmentsTeamsEnvironment: (typeof import("./components/environments/teams/Environment.vue"))["default"]
FirebaseLogin: (typeof import("./components/firebase/Login.vue"))["default"]
FirebaseLogout: (typeof import("./components/firebase/Logout.vue"))["default"]
GraphqlAuthorization: (typeof import("./components/graphql/Authorization.vue"))["default"]
GraphqlField: (typeof import("./components/graphql/Field.vue"))["default"]
GraphqlHeaders: (typeof import("./components/graphql/Headers.vue"))["default"]
GraphqlQuery: (typeof import("./components/graphql/Query.vue"))["default"]
GraphqlRequest: (typeof import("./components/graphql/Request.vue"))["default"]
GraphqlRequestOptions: (typeof import("./components/graphql/RequestOptions.vue"))["default"]
GraphqlRequestTab: (typeof import("./components/graphql/RequestTab.vue"))["default"]
GraphqlResponse: (typeof import("./components/graphql/Response.vue"))["default"]
GraphqlSidebar: (typeof import("./components/graphql/Sidebar.vue"))["default"]
GraphqlSubscriptionLog: (typeof import("./components/graphql/SubscriptionLog.vue"))["default"]
GraphqlTabHead: (typeof import("./components/graphql/TabHead.vue"))["default"]
GraphqlType: (typeof import("./components/graphql/Type.vue"))["default"]
GraphqlTypeLink: (typeof import("./components/graphql/TypeLink.vue"))["default"]
GraphqlVariable: (typeof import("./components/graphql/Variable.vue"))["default"]
History: (typeof import("./components/history/index.vue"))["default"]
HistoryGraphqlCard: (typeof import("./components/history/graphql/Card.vue"))["default"]
HistoryRestCard: (typeof import("./components/history/rest/Card.vue"))["default"]
HoppButtonPrimary: (typeof import("@hoppscotch/ui"))["HoppButtonPrimary"]
HoppButtonSecondary: (typeof import("@hoppscotch/ui"))["HoppButtonSecondary"]
HoppSmartAnchor: (typeof import("@hoppscotch/ui"))["HoppSmartAnchor"]
HoppSmartCheckbox: (typeof import("@hoppscotch/ui"))["HoppSmartCheckbox"]
HoppSmartConfirmModal: (typeof import("@hoppscotch/ui"))["HoppSmartConfirmModal"]
HoppSmartExpand: (typeof import("@hoppscotch/ui"))["HoppSmartExpand"]
HoppSmartFileChip: (typeof import("@hoppscotch/ui"))["HoppSmartFileChip"]
HoppSmartInput: (typeof import("@hoppscotch/ui"))["HoppSmartInput"]
HoppSmartIntersection: (typeof import("@hoppscotch/ui"))["HoppSmartIntersection"]
HoppSmartItem: (typeof import("@hoppscotch/ui"))["HoppSmartItem"]
HoppSmartLink: (typeof import("@hoppscotch/ui"))["HoppSmartLink"]
HoppSmartModal: (typeof import("@hoppscotch/ui"))["HoppSmartModal"]
HoppSmartPicture: (typeof import("@hoppscotch/ui"))["HoppSmartPicture"]
HoppSmartPlaceholder: (typeof import("@hoppscotch/ui"))["HoppSmartPlaceholder"]
HoppSmartProgressRing: (typeof import("@hoppscotch/ui"))["HoppSmartProgressRing"]
HoppSmartRadio: (typeof import("@hoppscotch/ui"))["HoppSmartRadio"]
HoppSmartRadioGroup: (typeof import("@hoppscotch/ui"))["HoppSmartRadioGroup"]
HoppSmartSelectWrapper: (typeof import("@hoppscotch/ui"))["HoppSmartSelectWrapper"]
HoppSmartSlideOver: (typeof import("@hoppscotch/ui"))["HoppSmartSlideOver"]
HoppSmartSpinner: (typeof import("@hoppscotch/ui"))["HoppSmartSpinner"]
HoppSmartTab: (typeof import("@hoppscotch/ui"))["HoppSmartTab"]
HoppSmartTabs: (typeof import("@hoppscotch/ui"))["HoppSmartTabs"]
HoppSmartToggle: (typeof import("@hoppscotch/ui"))["HoppSmartToggle"]
HoppSmartTree: (typeof import("@hoppscotch/ui"))["HoppSmartTree"]
HoppSmartWindow: (typeof import("@hoppscotch/ui"))["HoppSmartWindow"]
HoppSmartWindows: (typeof import("@hoppscotch/ui"))["HoppSmartWindows"]
HttpAuthorization: (typeof import("./components/http/Authorization.vue"))["default"]
HttpAuthorizationApiKey: (typeof import("./components/http/authorization/ApiKey.vue"))["default"]
HttpAuthorizationBasic: (typeof import("./components/http/authorization/Basic.vue"))["default"]
HttpBody: (typeof import("./components/http/Body.vue"))["default"]
HttpBodyParameters: (typeof import("./components/http/BodyParameters.vue"))["default"]
HttpCodegen: (typeof import("./components/http/Codegen.vue"))["default"]
HttpCodegenModal: (typeof import("./components/http/CodegenModal.vue"))["default"]
HttpHeaders: (typeof import("./components/http/Headers.vue"))["default"]
HttpImportCurl: (typeof import("./components/http/ImportCurl.vue"))["default"]
HttpKeyValue: (typeof import("./components/http/KeyValue.vue"))["default"]
HttpOAuth2Authorization: (typeof import("./components/http/OAuth2Authorization.vue"))["default"]
HttpParameters: (typeof import("./components/http/Parameters.vue"))["default"]
HttpPreRequestScript: (typeof import("./components/http/PreRequestScript.vue"))["default"]
HttpRawBody: (typeof import("./components/http/RawBody.vue"))["default"]
HttpReqChangeConfirmModal: (typeof import("./components/http/ReqChangeConfirmModal.vue"))["default"]
HttpRequest: (typeof import("./components/http/Request.vue"))["default"]
HttpRequestOptions: (typeof import("./components/http/RequestOptions.vue"))["default"]
HttpRequestTab: (typeof import("./components/http/RequestTab.vue"))["default"]
HttpRequestVariables: (typeof import("./components/http/RequestVariables.vue"))["default"]
HttpResponse: (typeof import("./components/http/Response.vue"))["default"]
HttpResponseMeta: (typeof import("./components/http/ResponseMeta.vue"))["default"]
HttpSidebar: (typeof import("./components/http/Sidebar.vue"))["default"]
HttpTabHead: (typeof import("./components/http/TabHead.vue"))["default"]
HttpTestResult: (typeof import("./components/http/TestResult.vue"))["default"]
HttpTestResultEntry: (typeof import("./components/http/TestResultEntry.vue"))["default"]
HttpTestResultEnv: (typeof import("./components/http/TestResultEnv.vue"))["default"]
HttpTestResultReport: (typeof import("./components/http/TestResultReport.vue"))["default"]
HttpTests: (typeof import("./components/http/Tests.vue"))["default"]
HttpURLEncodedParams: (typeof import("./components/http/URLEncodedParams.vue"))["default"]
IconLucideActivity: (typeof import("~icons/lucide/activity"))["default"]
IconLucideAlertTriangle: (typeof import("~icons/lucide/alert-triangle"))["default"]
IconLucideArrowLeft: (typeof import("~icons/lucide/arrow-left"))["default"]
IconLucideArrowUpRight: (typeof import("~icons/lucide/arrow-up-right"))["default"]
IconLucideBrush: (typeof import("~icons/lucide/brush"))["default"]
IconLucideCheckCircle: (typeof import("~icons/lucide/check-circle"))["default"]
IconLucideChevronRight: (typeof import("~icons/lucide/chevron-right"))["default"]
IconLucideGlobe: (typeof import("~icons/lucide/globe"))["default"]
IconLucideHelpCircle: (typeof import("~icons/lucide/help-circle"))["default"]
IconLucideInbox: (typeof import("~icons/lucide/inbox"))["default"]
IconLucideInfo: (typeof import("~icons/lucide/info"))["default"]
IconLucideLayers: (typeof import("~icons/lucide/layers"))["default"]
IconLucideListEnd: (typeof import("~icons/lucide/list-end"))["default"]
IconLucideMinus: (typeof import("~icons/lucide/minus"))["default"]
IconLucideRss: (typeof import("~icons/lucide/rss"))["default"]
IconLucideSearch: (typeof import("~icons/lucide/search"))["default"]
IconLucideUsers: (typeof import("~icons/lucide/users"))["default"]
IconLucideX: (typeof import("~icons/lucide/x"))["default"]
ImportExportBase: (typeof import("./components/importExport/Base.vue"))["default"]
ImportExportImportExportList: (typeof import("./components/importExport/ImportExportList.vue"))["default"]
ImportExportImportExportSourcesList: (typeof import("./components/importExport/ImportExportSourcesList.vue"))["default"]
ImportExportImportExportStepsFileImport: (typeof import("./components/importExport/ImportExportSteps/FileImport.vue"))["default"]
ImportExportImportExportStepsMyCollectionImport: (typeof import("./components/importExport/ImportExportSteps/MyCollectionImport.vue"))["default"]
ImportExportImportExportStepsUrlImport: (typeof import("./components/importExport/ImportExportSteps/UrlImport.vue"))["default"]
InterceptorsErrorPlaceholder: (typeof import("./components/interceptors/ErrorPlaceholder.vue"))["default"]
InterceptorsExtensionSubtitle: (typeof import("./components/interceptors/ExtensionSubtitle.vue"))["default"]
LensesHeadersRenderer: (typeof import("./components/lenses/HeadersRenderer.vue"))["default"]
LensesHeadersRendererEntry: (typeof import("./components/lenses/HeadersRendererEntry.vue"))["default"]
LensesRenderersAudioLensRenderer: (typeof import("./components/lenses/renderers/AudioLensRenderer.vue"))["default"]
LensesRenderersHTMLLensRenderer: (typeof import("./components/lenses/renderers/HTMLLensRenderer.vue"))["default"]
LensesRenderersImageLensRenderer: (typeof import("./components/lenses/renderers/ImageLensRenderer.vue"))["default"]
LensesRenderersJSONLensRenderer: (typeof import("./components/lenses/renderers/JSONLensRenderer.vue"))["default"]
LensesRenderersPDFLensRenderer: (typeof import("./components/lenses/renderers/PDFLensRenderer.vue"))["default"]
LensesRenderersRawLensRenderer: (typeof import("./components/lenses/renderers/RawLensRenderer.vue"))["default"]
LensesRenderersVideoLensRenderer: (typeof import("./components/lenses/renderers/VideoLensRenderer.vue"))["default"]
LensesRenderersXMLLensRenderer: (typeof import("./components/lenses/renderers/XMLLensRenderer.vue"))["default"]
LensesResponseBodyRenderer: (typeof import("./components/lenses/ResponseBodyRenderer.vue"))["default"]
ModalsNativeCACertificates: (typeof import("./../../hoppscotch-selfhost-desktop/src/components/modals/NativeCACertificates.vue"))["default"]
ModalsNativeClientCertificates: (typeof import("./../../hoppscotch-selfhost-desktop/src/components/modals/NativeClientCertificates.vue"))["default"]
ModalsNativeClientCertsAdd: (typeof import("./../../hoppscotch-selfhost-desktop/src/components/modals/NativeClientCertsAdd.vue"))["default"]
ProfileUserDelete: (typeof import("./components/profile/UserDelete.vue"))["default"]
RealtimeCommunication: (typeof import("./components/realtime/Communication.vue"))["default"]
RealtimeConnectionConfig: (typeof import("./components/realtime/ConnectionConfig.vue"))["default"]
RealtimeLog: (typeof import("./components/realtime/Log.vue"))["default"]
RealtimeLogEntry: (typeof import("./components/realtime/LogEntry.vue"))["default"]
RealtimeSubscription: (typeof import("./components/realtime/Subscription.vue"))["default"]
SettingsExtension: (typeof import("./components/settings/Extension.vue"))["default"]
SettingsNativeInterceptor: (typeof import("./../../hoppscotch-selfhost-desktop/src/components/settings/NativeInterceptor.vue"))["default"]
SettingsProxy: (typeof import("./components/settings/Proxy.vue"))["default"]
Share: (typeof import("./components/share/index.vue"))["default"]
ShareCreateModal: (typeof import("./components/share/CreateModal.vue"))["default"]
ShareCustomizeModal: (typeof import("./components/share/CustomizeModal.vue"))["default"]
ShareModal: (typeof import("./components/share/Modal.vue"))["default"]
ShareRequest: (typeof import("./components/share/Request.vue"))["default"]
ShareTemplatesButton: (typeof import("./components/share/templates/Button.vue"))["default"]
ShareTemplatesEmbeds: (typeof import("./components/share/templates/Embeds.vue"))["default"]
ShareTemplatesLink: (typeof import("./components/share/templates/Link.vue"))["default"]
SmartAccentModePicker: (typeof import("./components/smart/AccentModePicker.vue"))["default"]
SmartChangeLanguage: (typeof import("./components/smart/ChangeLanguage.vue"))["default"]
SmartColorModePicker: (typeof import("./components/smart/ColorModePicker.vue"))["default"]
SmartEnvInput: (typeof import("./components/smart/EnvInput.vue"))["default"]
TabPrimary: (typeof import("./components/tab/Primary.vue"))["default"]
TabSecondary: (typeof import("./components/tab/Secondary.vue"))["default"]
Teams: (typeof import("./components/teams/index.vue"))["default"]
TeamsAdd: (typeof import("./components/teams/Add.vue"))["default"]
TeamsEdit: (typeof import("./components/teams/Edit.vue"))["default"]
TeamsInvite: (typeof import("./components/teams/Invite.vue"))["default"]
TeamsMemberStack: (typeof import("./components/teams/MemberStack.vue"))["default"]
TeamsModal: (typeof import("./components/teams/Modal.vue"))["default"]
TeamsTeam: (typeof import("./components/teams/Team.vue"))["default"]
Tippy: (typeof import("vue-tippy"))["Tippy"]
WorkspaceCurrent: (typeof import("./components/workspace/Current.vue"))["default"]
WorkspaceSelector: (typeof import("./components/workspace/Selector.vue"))["default"]
}
}

10
packages/hoppscotch-common/src/components/app/ActionHandler.vue
View File

@@ -2,6 +2,11 @@
<AppShortcuts :show="showShortcuts" @close="showShortcuts = false" />
<AppShare :show="showShare" @hide-modal="showShare = false" />
<FirebaseLogin v-if="showLogin" @hide-modal="showLogin = false" />
<HttpResponseInterface
v-if="isDrawerOpen"
:show="isDrawerOpen"
@close="isDrawerOpen = false"
/>
</template>
<script setup lang="ts">
@@ -11,6 +16,7 @@ import { defineActionHandler } from "~/helpers/actions"
const showShortcuts = ref(false)
const showShare = ref(false)
const showLogin = ref(false)
const isDrawerOpen = ref(false)
defineActionHandler("flyouts.keybinds.toggle", () => {
showShortcuts.value = !showShortcuts.value
@@ -23,4 +29,8 @@ defineActionHandler("modals.share.toggle", () => {
defineActionHandler("modals.login.toggle", () => {
showLogin.value = !showLogin.value
})
defineActionHandler("response.schema.toggle", () => {
isDrawerOpen.value = !isDrawerOpen.value
})
</script>

6
packages/hoppscotch-common/src/components/app/PaneLayout.vue
View File

@@ -16,7 +16,7 @@
>
<Splitpanes
class="smart-splitter"
:horizontal="COLUMN_LAYOUT"
:horizontal="COLUMN_LAYOUT || forceColumnLayout"
@resize="setPaneEvent($event, 'horizontal')"
>
<Pane
@@ -79,6 +79,10 @@ const props = defineProps({
default: null,
},
isEmbed: {
type: Boolean,
defaul: false,
},
forceColumnLayout: {
type: Boolean,
default: false,
},

205
packages/hoppscotch-common/src/components/http/ResponseInterface.vue Normal file
View File

@@ -0,0 +1,205 @@
<template>
<HoppSmartSlideOver
:show="show"
:title="t('response.data_schema')"
@close="close()"
>
<template #content>
<div class="flex flex-col px-4 flex-1 overflow-y-auto">
<div class="flex flex-col">
<tippy
interactive
trigger="click"
theme="popover"
placement="bottom"
:on-shown="() => tippyActions.focus()"
class="mt-4"
>
<HoppSmartSelectWrapper>
<HoppButtonSecondary
:label="selectedInterface"
outline
class="flex-1 pr-8"
/>
</HoppSmartSelectWrapper>
<template #content="{ hide }">
<div class="flex flex-col space-y-2">
<div class="sticky top-0 z-10 flex-shrink-0 overflow-x-auto">
<input
v-model="searchQuery"
type="search"
autocomplete="off"
class="input flex w-full !bg-primaryContrast p-4 py-2"
:placeholder="`${t('action.search')}`"
/>
</div>
<div
ref="tippyActions"
class="flex flex-col focus:outline-none"
tabindex="0"
@keyup.escape="hide()"
>
<HoppSmartItem
v-for="lang in filteredResponseInterfaces"
:key="lang"
:label="lang"
:info-icon="
lang === selectedInterface ? IconCheck : undefined
"
:active-info-icon="lang === selectedInterface"
@click="
() => {
selectedInterface = lang
hide()
}
"
/>
<HoppSmartPlaceholder
v-if="filteredResponseInterfaces.length === 0"
:text="`${t('state.nothing_found')} ‟${searchQuery}”`"
>
<template #icon>
<icon-lucide-search class="svg-icons opacity-75" />
</template>
</HoppSmartPlaceholder>
</div>
</div>
</template>
</tippy>
</div>
<div
v-if="errorState"
class="my-4 w-full overflow-auto whitespace-normal rounded bg-primaryLight px-4 font-mono text-red-400"
>
{{ t("error.something_went_wrong") }}
</div>
<div
v-else-if="selectedInterface"
class="my-4 rounded border border-dividerLight flex-1 overflow-hidden flex flex-col"
>
<div class="flex items-center justify-between pl-4">
<label class="truncate font-semibold text-secondaryLight">
{{ t("request.generated_code") }}
</label>
<div class="flex items-center">
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('state.linewrap')"
:class="{ '!text-accent': WRAP_LINES }"
:icon="IconWrapText"
@click.prevent="toggleNestedSetting('WRAP_LINES', 'codeGen')"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
:title="t('action.download_file')"
:icon="downloadIcon"
@click="downloadResponse"
/>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip', allowHTML: true }"
:title="t('action.copy')"
:icon="copyIcon"
@click="copyResponse"
/>
</div>
</div>
<div
class="h-full relative w-full flex flex-col flex-1 rounded-b border-t border-dividerLight"
>
<div ref="generatedCode" class="absolute inset-0"></div>
</div>
</div>
</div>
</template>
</HoppSmartSlideOver>
</template>
<script setup lang="ts">
import { useCodemirror } from "@composables/codemirror"
import { useI18n } from "@composables/i18n"
import { computed, reactive, ref } from "vue"
import {
getResponseBodyText,
useCopyResponse,
useDownloadResponse,
} from "~/composables/lens-actions"
import { useService } from "dioc/vue"
import { useNestedSetting } from "~/composables/settings"
import interfaceLanguages from "~/helpers/utils/interfaceLanguages"
import { toggleNestedSetting } from "~/newstore/settings"
import { RESTTabService } from "~/services/tab/rest"
import IconCheck from "~icons/lucide/check"
import IconWrapText from "~icons/lucide/wrap-text"
import jsonToLanguage from "~/helpers/utils/json-to-language"
import { watch } from "vue"
const t = useI18n()
defineProps<{
show: boolean
}>()
const emit = defineEmits<{
(e: "close"): void
}>()
const tabs = useService(RESTTabService)
const selectedInterface = ref<(typeof interfaceLanguages)[number]>("TypeScript")
const response = computed(() => {
const res = tabs.currentActiveTab.value.document.response
if (res?.type === "success" || res?.type === "fail") {
return getResponseBodyText(res.body)
}
return ""
})
const errorState = ref(false)
const interfaceCode = ref("")
const setInterfaceCode = async () => {
const res = await jsonToLanguage(selectedInterface.value, response.value)
interfaceCode.value = res.lines.join("\n")
}
watch(selectedInterface, setInterfaceCode)
watch(response, setInterfaceCode, { immediate: true })
const close = () => {
emit("close")
}
// Template refs
const tippyActions = ref<any | null>(null)
const generatedCode = ref<any | null>(null)
const WRAP_LINES = useNestedSetting("WRAP_LINES", "codeGen")
useCodemirror(
generatedCode,
interfaceCode,
reactive({
extendedEditorConfig: {
mode: "text/plain",
readOnly: true,
lineWrapping: WRAP_LINES,
},
linter: null,
completer: null,
environmentHighlights: false,
})
)
const searchQuery = ref("")
const filteredResponseInterfaces = computed(() => {
return interfaceLanguages.filter((lang) =>
lang.toLowerCase().includes(searchQuery.value.toLowerCase())
)
})
const { copyIcon, copyResponse } = useCopyResponse(interfaceCode)
const { downloadIcon, downloadResponse } = useDownloadResponse(
"",
interfaceCode
)
</script>

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

@@ -53,7 +53,7 @@
>
<HoppButtonSecondary
v-tippy="{ theme: 'tooltip' }"
:title="t('app.copy_interface_type')"
:title="t('action.more')"
:icon="IconMore"
/>
<template #content="{ hide }">
@@ -64,15 +64,14 @@
@keyup.escape="hide()"
>
<HoppSmartItem
v-for="(language, index) in interfaceLanguages"
:key="index"
:label="language"
:icon="
copiedInterfaceLanguage === language
? copyInterfaceIcon
: IconCopy
:label="t('response.generate_data_schema')"
:icon="IconNetwork"
@click="
() => {
invokeAction('response.schema.toggle')
hide()
}
"
@click="runCopyInterface(language)"
/>
</div>
</template>
@@ -234,7 +233,7 @@ import IconWrapText from "~icons/lucide/wrap-text"
import IconFilter from "~icons/lucide/filter"
import IconMore from "~icons/lucide/more-horizontal"
import IconHelpCircle from "~icons/lucide/help-circle"
import IconCopy from "~icons/lucide/copy"
import IconNetwork from "~icons/lucide/network"
import * as LJSON from "lossless-json"
import * as O from "fp-ts/Option"
import * as E from "fp-ts/Either"
@@ -254,13 +253,11 @@ import {
useCopyResponse,
useResponseBody,
useDownloadResponse,
useCopyInterface,
} from "@composables/lens-actions"
import { defineActionHandler } from "~/helpers/actions"
import { defineActionHandler, invokeAction } from "~/helpers/actions"
import { getPlatformSpecialKey as getSpecialKey } from "~/helpers/platformutils"
import { useNestedSetting } from "~/composables/settings"
import { toggleNestedSetting } from "~/newstore/settings"
import interfaceLanguages from "~/helpers/utils/interfaceLanguages"
const t = useI18n()
@@ -272,13 +269,6 @@ const { responseBodyText } = useResponseBody(props.response)
const toggleFilter = ref(false)
const filterQueryText = ref("")
const copiedInterfaceLanguage = ref("")
const runCopyInterface = (language: string) => {
copyInterface(language).then(() => {
copiedInterfaceLanguage.value = language
})
}
type BodyParseError =
| { type: "JSON_PARSE_FAILED" }
@@ -362,7 +352,6 @@ const filterResponseError = computed(() =>
)
const { copyIcon, copyResponse } = useCopyResponse(jsonBodyText)
const { copyInterfaceIcon, copyInterface } = useCopyInterface(jsonBodyText)
const { downloadIcon, downloadResponse } = useDownloadResponse(
"application/json",
jsonBodyText

14
packages/hoppscotch-common/src/composables/lens-actions.ts
View File

@@ -172,13 +172,17 @@ export function useResponseBody(response: HoppRESTResponse): {
response.type === "extension_error"
)
return ""
if (typeof response.body === "string") return response.body
const res = new TextDecoder("utf-8").decode(response.body)
// HACK: Temporary trailing null character issue from the extension fix
return res.replace(/\0+$/, "")
return getResponseBodyText(response.body)
})
return {
responseBodyText,
}
}
export function getResponseBodyText(body: ArrayBuffer): string {
if (typeof body === "string") return body
const res = new TextDecoder("utf-8").decode(body)
// HACK: Temporary trailing null character issue from the extension fix
return res.replace(/\0+$/, "")
}

1
packages/hoppscotch-common/src/helpers/actions.ts
View File

@@ -61,6 +61,7 @@ export type HoppAction =
| "settings.theme.dark" // Use dark theme
| "settings.theme.black" // Use black theme
| "response.preview.toggle" // Toggle response preview
| "response.schema.toggle" // Toggle response data schema
| "response.file.download" // Download response as file
| "response.copy" // Copy response to clipboard
| "modals.login.toggle" // Login to Hoppscotch