From 6187870b779489619abfb7aee3dc758d52632c60 Mon Sep 17 00:00:00 2001 From: Andrew Jiang Date: Wed, 13 Nov 2024 19:25:04 -0500 Subject: [PATCH] fix: auth rendering on playground (#1813) --- .../src/playground/auth/PlaygroundOAuthForm.tsx | 11 ++++------- .../app/src/playground/code-snippets/resolver.ts | 5 ++++- .../endpoint/PlaygroundEndpointContent.tsx | 5 ++++- .../ui/app/src/playground/utils/auth-headers.ts | 6 +++--- packages/ui/app/src/playground/utils/oauth.ts | 9 +++------ .../app/src/playground/utils/should-render-auth.ts | 14 ++++++++++++++ 6 files changed, 32 insertions(+), 18 deletions(-) create mode 100644 packages/ui/app/src/playground/utils/should-render-auth.ts diff --git a/packages/ui/app/src/playground/auth/PlaygroundOAuthForm.tsx b/packages/ui/app/src/playground/auth/PlaygroundOAuthForm.tsx index eb822aebb4..a2f8204683 100644 --- a/packages/ui/app/src/playground/auth/PlaygroundOAuthForm.tsx +++ b/packages/ui/app/src/playground/auth/PlaygroundOAuthForm.tsx @@ -17,7 +17,7 @@ import { PlaygroundBearerAuthForm } from "./PlaygroundBearerAuthForm"; function FoundOAuthReferencedEndpointForm({ context, - oAuthClientCredentialsReferencedEndpoint, + referencedEndpoint, closeContainer, disabled, }: { @@ -25,7 +25,7 @@ function FoundOAuthReferencedEndpointForm({ * this must be the OAuth endpoint. */ context: EndpointContext; - oAuthClientCredentialsReferencedEndpoint: APIV1Read.OAuthClientCredentialsReferencedEndpoint; + referencedEndpoint: APIV1Read.OAuthClientCredentials.ReferencedEndpoint; closeContainer: () => void; disabled?: boolean; }): ReactElement { @@ -45,7 +45,7 @@ function FoundOAuthReferencedEndpointForm({ formState, endpoint: context.endpoint, proxyEnvironment, - oAuthClientCredentialsReferencedEndpoint, + referencedEndpoint, baseUrl, setValue, closeContainer, @@ -150,12 +150,10 @@ function FoundOAuthReferencedEndpointForm({ function OAuthReferencedEndpointForm({ referencedEndpoint, - oAuthClientCredentialsReferencedEndpoint, closeContainer, disabled, }: { referencedEndpoint: APIV1Read.OAuthClientCredentials.ReferencedEndpoint; - oAuthClientCredentialsReferencedEndpoint: APIV1Read.OAuthClientCredentialsReferencedEndpoint; closeContainer: () => void; disabled?: boolean; }) { @@ -172,7 +170,7 @@ function OAuthReferencedEndpointForm({ return ( @@ -194,7 +192,6 @@ export function PlaygroundOAuthForm({ referencedEndpoint: (referencedEndpoint) => ( diff --git a/packages/ui/app/src/playground/code-snippets/resolver.ts b/packages/ui/app/src/playground/code-snippets/resolver.ts index 762f03ec72..0c90b9173b 100644 --- a/packages/ui/app/src/playground/code-snippets/resolver.ts +++ b/packages/ui/app/src/playground/code-snippets/resolver.ts @@ -6,6 +6,7 @@ import { UnreachableCaseError } from "ts-essentials"; import { provideRegistryService } from "../../services/registry"; import { PlaygroundAuthState, PlaygroundEndpointRequestFormState } from "../types"; import { buildAuthHeaders, convertToCustomSnippetPayload } from "../utils"; +import { shouldRenderAuth } from "../utils/should-render-auth"; import { CurlSnippetBuilder } from "./builders/curl"; import { PythonRequestSnippetBuilder } from "./builders/python"; import { TypescriptFetchSnippetBuilder } from "./builders/typescript"; @@ -91,7 +92,9 @@ export class PlaygroundCodeSnippetResolver { setOAuthValue: (value: (prev: any) => any) => void, ) { const authHeaders = buildAuthHeaders( - this.context.auth, + this.context.auth != null && shouldRenderAuth(this.context.endpoint, this.context.auth) + ? this.context.auth + : undefined, authState, { redacted: isAuthHeadersRedacted }, { diff --git a/packages/ui/app/src/playground/endpoint/PlaygroundEndpointContent.tsx b/packages/ui/app/src/playground/endpoint/PlaygroundEndpointContent.tsx index e9ba05112b..fdd6851a2b 100644 --- a/packages/ui/app/src/playground/endpoint/PlaygroundEndpointContent.tsx +++ b/packages/ui/app/src/playground/endpoint/PlaygroundEndpointContent.tsx @@ -4,6 +4,7 @@ import { Dispatch, ReactElement, SetStateAction, useDeferredValue } from "react" import { PlaygroundAuthorizationFormCard } from "../auth"; import { PlaygroundEndpointRequestFormState } from "../types"; import { PlaygroundResponse } from "../types/playgroundResponse"; +import { shouldRenderAuth } from "../utils/should-render-auth"; import { PlaygroundEndpointContentLayout } from "./PlaygroundEndpointContentLayout"; import { PlaygroundEndpointForm } from "./PlaygroundEndpointForm"; import { PlaygroundEndpointFormButtons } from "./PlaygroundEndpointFormButtons"; @@ -33,7 +34,9 @@ export function PlaygroundEndpointContent({ const form = (
- {context.auth != null && } + {context.auth != null && shouldRenderAuth(context.endpoint, context.auth) && ( + + )}
diff --git a/packages/ui/app/src/playground/utils/auth-headers.ts b/packages/ui/app/src/playground/utils/auth-headers.ts index 457dab1999..55d921eda8 100644 --- a/packages/ui/app/src/playground/utils/auth-headers.ts +++ b/packages/ui/app/src/playground/utils/auth-headers.ts @@ -15,7 +15,7 @@ export function buildAuthHeaders( { redacted }: { redacted: boolean }, oAuthClientCredentialReferencedEndpointLoginFlowProps?: Omit< OAuthClientCredentialReferencedEndpointLoginFlowProps, - "oAuthClientCredentialsReferencedEndpoint" + "referencedEndpoint" >, ): Record { const headers: Record = {}; @@ -48,7 +48,7 @@ export function buildAuthHeaders( visitDiscriminatedUnion(oAuth.value)._visit({ clientCredentials: (oAuthClientCredentials) => { visitDiscriminatedUnion(oAuthClientCredentials.value)._visit({ - referencedEndpoint: (oAuthClientCredentialsReferencedEndpoint) => { + referencedEndpoint: (referencedEndpoint) => { const token = authState.oauth?.selectedInputMethod === "credentials" ? authState.oauth?.accessToken @@ -69,7 +69,7 @@ export function buildAuthHeaders( formState, endpoint, proxyEnvironment, - oAuthClientCredentialsReferencedEndpoint, + referencedEndpoint, baseUrl, setValue: setOAuthValue, }).catch(noop); diff --git a/packages/ui/app/src/playground/utils/oauth.ts b/packages/ui/app/src/playground/utils/oauth.ts index af7f32fbdd..d697b0b97c 100644 --- a/packages/ui/app/src/playground/utils/oauth.ts +++ b/packages/ui/app/src/playground/utils/oauth.ts @@ -11,7 +11,7 @@ export interface OAuthClientCredentialReferencedEndpointLoginFlowProps { formState: PlaygroundEndpointRequestFormState; endpoint: EndpointDefinition; proxyEnvironment: string; - oAuthClientCredentialsReferencedEndpoint: APIV1Read.OAuthClientCredentialsReferencedEndpoint; + referencedEndpoint: APIV1Read.OAuthClientCredentialsReferencedEndpoint; baseUrl: string | undefined; setValue: (value: (prev: any) => any) => void; closeContainer?: () => void; @@ -22,7 +22,7 @@ export const oAuthClientCredentialReferencedEndpointLoginFlow = async ({ formState, endpoint, proxyEnvironment, - oAuthClientCredentialsReferencedEndpoint, + referencedEndpoint, baseUrl, setValue, closeContainer, @@ -57,10 +57,7 @@ export const oAuthClientCredentialReferencedEndpointLoginFlow = async ({ json: async (jsonRes) => { if (jsonRes.response.ok) { try { - const accessToken = jsonpath.query( - jsonRes.response, - oAuthClientCredentialsReferencedEndpoint.accessTokenLocator, - )?.[0]; + const accessToken = jsonpath.query(jsonRes.response, referencedEndpoint.accessTokenLocator)?.[0]; setValue((prev) => ({ ...prev, selectedInputMethod: "credentials", diff --git a/packages/ui/app/src/playground/utils/should-render-auth.ts b/packages/ui/app/src/playground/utils/should-render-auth.ts new file mode 100644 index 0000000000..ab4cdf2b56 --- /dev/null +++ b/packages/ui/app/src/playground/utils/should-render-auth.ts @@ -0,0 +1,14 @@ +import { ApiDefinition } from "@fern-api/fdr-sdk"; + +export function shouldRenderAuth(endpoint: ApiDefinition.EndpointDefinition, auth: ApiDefinition.AuthScheme): boolean { + if ( + auth.type === "oAuth" && + auth.value.type === "clientCredentials" && + auth.value.value.type === "referencedEndpoint" + ) { + if (auth.value.value.endpointId === endpoint.id) { + return false; + } + } + return true; +}