From 3bf0a820238a0cb826e142f41dd30aa478fcf2c5 Mon Sep 17 00:00:00 2001
From: Gary Verhaegen <gary.verhaegen@digitalasset.com>
Date: Mon, 5 Oct 2020 17:05:52 +0200
Subject: [PATCH] react: let user specify reconnectThreshold (#7566)

* react: let user specify reconnectThreshold

Requested by a user on [the forum].

[the forum]: https://discuss.daml.com/t/usestreamquery-disconnecting/1325

CHANGELOG_BEGIN
  * JavaScript Client Libraries: Users of the React wrapper can now
    specify the `reconnectThreshold` parameter of the underlying Ledger
    through LedgerProps. This adds an optional attribute to the
    LedgerProps type, so existing code does not need any change to keep
    working as before (i.e. using the default 30s value).
CHANGELOG_END

* add test
---
 language-support/ts/daml-react/README.md              | 1 +
 language-support/ts/daml-react/createLedgerContext.ts | 5 +++--
 language-support/ts/daml-react/index.test.ts          | 4 ++--
 3 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/language-support/ts/daml-react/README.md b/language-support/ts/daml-react/README.md
index 8542358265..a573b46736 100644
--- a/language-support/ts/daml-react/README.md
+++ b/language-support/ts/daml-react/README.md
@@ -30,6 +30,7 @@ const App: React.FC = () => {
       token: <your authentication token>
       httpBaseUrl?: <optional http base url>
       wsBaseUrl?: <optional websocket base url>
+      reconnectThreshold?: <optional delay in ms>
       party: <the logged in party>
     >
       <MainScreen />
diff --git a/language-support/ts/daml-react/createLedgerContext.ts b/language-support/ts/daml-react/createLedgerContext.ts
index b21dd832c3..e9ba951950 100644
--- a/language-support/ts/daml-react/createLedgerContext.ts
+++ b/language-support/ts/daml-react/createLedgerContext.ts
@@ -23,6 +23,7 @@ export type LedgerProps = {
   httpBaseUrl?: string;
   wsBaseUrl?: string;
   party: Party;
+  reconnectThreshold?: number;
 }
 
 /**
@@ -86,9 +87,9 @@ export function createLedgerContext(contextName="DamlLedgerContext"): LedgerCont
   // not make a new network request although they are required to refresh data.
 
   const ledgerContext = React.createContext<DamlLedgerState | undefined>(undefined);
-  const DamlLedger: React.FC<LedgerProps> = ({token, httpBaseUrl, wsBaseUrl, party, children}) => {
+  const DamlLedger: React.FC<LedgerProps> = ({token, httpBaseUrl, wsBaseUrl, reconnectThreshold, party, children}) => {
     const [reloadToken, setReloadToken] = useState(0);
-    const ledger = useMemo(() => new Ledger({token, httpBaseUrl, wsBaseUrl}), [token, httpBaseUrl, wsBaseUrl]);
+    const ledger = useMemo(() => new Ledger({token, httpBaseUrl, wsBaseUrl, reconnectThreshold}), [token, httpBaseUrl, wsBaseUrl, reconnectThreshold]);
     const state: DamlLedgerState = useMemo(() => ({
       reloadToken,
       triggerReload: (): void => setReloadToken(x => x + 1),
diff --git a/language-support/ts/daml-react/index.test.ts b/language-support/ts/daml-react/index.test.ts
index 79ed253e41..31007ef03c 100644
--- a/language-support/ts/daml-react/index.test.ts
+++ b/language-support/ts/daml-react/index.test.ts
@@ -69,7 +69,7 @@ const TOKEN = 'test_token';
 const PARTY = 'test_party';
 
 function renderDamlHook<P, R>(callback: (props: P) => R): RenderHookResult<P, R> {
-  const wrapper: ComponentType = ({children}) => React.createElement(DamlLedger, {token: TOKEN, party: PARTY}, children);
+  const wrapper: ComponentType = ({children}) => React.createElement(DamlLedger, {token: TOKEN, party: PARTY, reconnectThreshold: 1337}, children);
   return renderHook(callback, {wrapper});
 }
 
@@ -86,7 +86,7 @@ beforeEach(() => {
 test('DamlLedger', () => {
   renderDamlHook(() => { return; });
   expect(mockConstructor).toHaveBeenCalledTimes(1);
-  expect(mockConstructor).toHaveBeenLastCalledWith({token: TOKEN, httpBaseUrl: undefined, wsBaseUrl: undefined});
+  expect(mockConstructor).toHaveBeenLastCalledWith({token: TOKEN, httpBaseUrl: undefined, wsBaseUrl: undefined, reconnectThreshold: 1337});
 });
 
 test('useParty', () => {