From 35db4c669adbcf702d955d2e895329e888e22093 Mon Sep 17 00:00:00 2001
From: Abhinav Rastogi <abhinav.rastogi@harness.io>
Date: Mon, 12 Dec 2022 16:42:03 +0530
Subject: [PATCH] update docs for ProxiedSignInPage

Signed-off-by: Abhinav Rastogi <abhinav.rastogi@harness.io>
---
 docs/auth/index.md | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/docs/auth/index.md b/docs/auth/index.md
index 5702e96cee..fa185c0c23 100644
--- a/docs/auth/index.md
+++ b/docs/auth/index.md
@@ -150,6 +150,31 @@ const app = createApp({
 });
 ```
 
+If the provider in auth backend expects additional headers such as `x-provider-token`, there is now a way to configure that in `ProxiedSignInPage` using the optional `headers` prop.
+
+Example:
+
+```tsx
+<ProxiedSignInPage
+  {...props}
+  provider="my-custom-provider"
+  headers={{ 'x-some-key': someValue }}
+/>
+```
+
+Headers can also be returned in an async manner:
+
+```tsx
+<ProxiedSignInPage
+  {...props}
+  provider="my-custom-provider"
+  headers={async () => {
+    const someValue = await someFn();
+    return { 'x-some-key': someValue };
+  }}
+/>
+```
+
 A downside of this method is that it can be cumbersome to set up for local development.
 As a workaround for this, it's possible to dynamically select the sign-in page based on
 what environment the app is running in, and then use a different sign-in method for local