Implement Browser Notification Issue using onMessageReceived

Sendbird Chat UIKit React
1

Previously I used sendbird uikit v2 and I successfully implemented this code to send notifications to users. but after I upgraded to the latest sendbird uikit v3, this code doesn’t work, please help.

import React, { useEffect } from "react";
import {
	useSendbirdStateContext,
	sendBirdSelectors,
	withSendBird,
} from "sendbird-uikit";
import Cookies from "js-cookie";
import moment from "moment";
import { usePostNotification } from "@/hooks/notificationHooks";
import { playAudioContext } from "@/hooks/useAudioContext";

const NotificationHandler = (props) => {
	const { sdk } = props;
	const context = useSendbirdStateContext();
	const sdkInstance = sendBirdSelectors.getSdk(context);
	const UNIQUE_HANDLER_ID = Date.now();
	const userId = Cookies.get("id");

	const { mutateAsync: postNotification } = usePostNotification();

	const sendPushNotification = async (value) => {
		const messageContent = value.message || value.name;

		const payload = {
			title: "Chat baru dari " + value?._sender?.nickname,
			message: `[${moment().format("HH:mm")}] ` + messageContent,
			coach_id: `${userId}`,
			channel_url: value?.channelUrl,
			timestamp: value?.createdAt,
		};

		try {
			const response = await postNotification(payload);
			if (response.status === 200) playAudioContext();
		} catch (error) {}
	};

	useEffect(() => {
		if (sdkInstance && sdkInstance.ChannelHandler) {
			let ChannelHandler = new sdkInstance.ChannelHandler();
			ChannelHandler.onMessageReceived = function (_, message) {
				if (message && message._sender.userId !== userId)
					sendPushNotification(message);
			};
			sdk.addChannelHandler(UNIQUE_HANDLER_ID, ChannelHandler);
		}

		return () => {
			if (sdkInstance && sdkInstance.removeChannelHandler) {
				sdk.removeChannelHandler(UNIQUE_HANDLER_ID);
			}
		};
	}, [sdk]);

	return <div />;
};

const mapStoreToProps = (store) => {
	const sdk = sendBirdSelectors.getSdk(store);
	return {
		sdk,
	};
};

export default withSendBird(NotificationHandler, mapStoreToProps);

[UIKit Version]
@sendbird/uikit-react": “^3.6.2”