Preserve Editor State (#151)

This commit is contained in:
Gregory Schier
2024-12-31 07:31:43 -08:00
committed by GitHub
parent 31f2bff0f6
commit 135c366e32
33 changed files with 295 additions and 177 deletions

View File

@@ -16,7 +16,6 @@ import { useSendAnyHttpRequest } from '../hooks/useSendAnyHttpRequest';
import { useToast } from '../hooks/useToast';
import { useUpdateAnyHttpRequest } from '../hooks/useUpdateAnyHttpRequest';
import { languageFromContentType } from '../lib/contentType';
import { fallbackRequestName } from '../lib/fallbackRequestName';
import { tryFormatJson } from '../lib/formatters';
import {
AUTH_TYPE_BASIC,
@@ -338,6 +337,7 @@ export const RequestPane = memo(function RequestPane({
{activeRequest && (
<>
<UrlBar
stateKey={`url.${activeRequest.id}`}
key={forceUpdateKey + urlKey}
url={activeRequest.url}
method={activeRequest.method}
@@ -384,7 +384,7 @@ export const RequestPane = memo(function RequestPane({
<TabContent value={TAB_HEADERS}>
<HeadersEditor
forceUpdateKey={`${forceUpdateHeaderEditorKey}::${forceUpdateKey}`}
headers={activeRequest.headers}
request={activeRequest}
onChange={(headers) =>
updateRequest.mutate({ id: activeRequestId, update: { headers } })
}
@@ -392,6 +392,7 @@ export const RequestPane = memo(function RequestPane({
</TabContent>
<TabContent value={TAB_PARAMS}>
<UrlParametersEditor
stateKey={`params.${activeRequest.id}`}
forceUpdateKey={forceUpdateKey + urlParametersKey}
pairs={urlParameterPairs}
onChange={(urlParameters) =>
@@ -411,6 +412,7 @@ export const RequestPane = memo(function RequestPane({
language="json"
onChange={handleBodyTextChange}
format={tryFormatJson}
stateKey={`json.${activeRequest.id}`}
/>
) : activeRequest.bodyType === BODY_TYPE_XML ? (
<Editor
@@ -422,24 +424,25 @@ export const RequestPane = memo(function RequestPane({
defaultValue={`${activeRequest.body?.text ?? ''}`}
language="xml"
onChange={handleBodyTextChange}
stateKey={`xml.${activeRequest.id}`}
/>
) : activeRequest.bodyType === BODY_TYPE_GRAPHQL ? (
<GraphQLEditor
forceUpdateKey={forceUpdateKey}
baseRequest={activeRequest}
body={activeRequest.body}
request={activeRequest}
onChange={handleBodyChange}
/>
) : activeRequest.bodyType === BODY_TYPE_FORM_URLENCODED ? (
<FormUrlencodedEditor
forceUpdateKey={forceUpdateKey}
body={activeRequest.body}
request={activeRequest}
onChange={handleBodyChange}
/>
) : activeRequest.bodyType === BODY_TYPE_FORM_MULTIPART ? (
<FormMultipartEditor
forceUpdateKey={forceUpdateKey}
body={activeRequest.body}
request={activeRequest}
onChange={handleBodyChange}
/>
) : activeRequest.bodyType === BODY_TYPE_BINARY ? (
@@ -462,6 +465,7 @@ export const RequestPane = memo(function RequestPane({
heightMode={fullHeight ? 'full' : 'auto'}
defaultValue={`${activeRequest.body?.text ?? ''}`}
onChange={handleBodyTextChange}
stateKey={`other.${activeRequest.id}`}
/>
) : (
<EmptyStateText>Empty Body</EmptyStateText>
@@ -475,7 +479,7 @@ export const RequestPane = memo(function RequestPane({
defaultValue={activeRequest.name}
className="font-sans !text-xl !px-0"
containerClassName="border-0"
placeholder={fallbackRequestName(activeRequest)}
placeholder={activeRequest.id}
onChange={(name) =>
updateRequest.mutate({ id: activeRequestId, update: { name } })
}
@@ -484,6 +488,7 @@ export const RequestPane = memo(function RequestPane({
name="request-description"
placeholder="Request description"
defaultValue={activeRequest.description}
stateKey={`description.${activeRequest.id}`}
onChange={(description) =>
updateRequest.mutate({ id: activeRequestId, update: { description } })
}