From 49b4b6d07972312adfe36525ffc0a90375104500 Mon Sep 17 00:00:00 2001
From: Owen Pearson <owenp@Owens-MacBook-Pro-2.local>
Date: Wed, 1 Nov 2023 13:25:11 +0000
Subject: [PATCH] fix(react): ensure channel options are passed to channel
 state listener hook

---
 .../src/hooks/useChannelStateListener.ts           | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/src/platform/react-hooks/src/hooks/useChannelStateListener.ts b/src/platform/react-hooks/src/hooks/useChannelStateListener.ts
index 35054bd083..f541023bef 100644
--- a/src/platform/react-hooks/src/hooks/useChannelStateListener.ts
+++ b/src/platform/react-hooks/src/hooks/useChannelStateListener.ts
@@ -1,5 +1,5 @@
 import { Types } from '../../../../../ably.js';
-import { ChannelNameAndId } from '../AblyReactHooks.js';
+import { ChannelNameAndId, ChannelNameAndOptions, channelOptionsWithAgent } from '../AblyReactHooks.js';
 import { useAbly } from './useAbly.js';
 import { useEventListener } from './useEventListener.js';
 
@@ -8,22 +8,24 @@ type ChannelStateListener = (stateChange: Types.ChannelStateChange) => any;
 export function useChannelStateListener(channelName: string, listener?: ChannelStateListener);
 
 export function useChannelStateListener(
-  options: ChannelNameAndId | string,
+  options: ChannelNameAndOptions | string,
   state?: Types.ChannelState | Types.ChannelState[],
   listener?: ChannelStateListener
 );
 
 export function useChannelStateListener(
-  channelNameOrNameAndId: ChannelNameAndId | string,
+  channelNameOrNameAndId: ChannelNameAndOptions | string,
   stateOrListener?: Types.ChannelState | Types.ChannelState[] | ChannelStateListener,
   listener?: (stateChange: Types.ChannelStateChange) => any
 ) {
-  const channelName =
-    typeof channelNameOrNameAndId === 'string' ? channelNameOrNameAndId : channelNameOrNameAndId.channelName;
+  const channelHookOptions =
+    typeof channelNameOrNameAndId === 'object' ? channelNameOrNameAndId : { channelName: channelNameOrNameAndId };
   const id = (channelNameOrNameAndId as ChannelNameAndId)?.id;
 
+  const { channelName, options: channelOptions } = channelHookOptions;
+
   const ably = useAbly(id);
-  const channel = ably.channels.get(channelName);
+  const channel = ably.channels.get(channelName, channelOptionsWithAgent(channelOptions));
 
   const _listener = typeof listener === 'function' ? listener : (stateOrListener as ChannelStateListener);