Zendesk chat disappears on page change - NextJS implementation



Data ultimo post: 29 dic 2023

I'm adding zendesk chat script to a NextJS 13 application. When the page change, the <iframe> of the chat is gone. Chat box disappears. How can i fix it?

Here is the implementation details:

'use client';

import { useEffect, useState } from 'react';

let zafClient = null;

export function useZafClient() {

  const [client, setClient] = useState(zafClient);

  console.log(zafClient);

  useEffect(() => {

    if (!client && typeof window.ZAFClient !== 'undefined') {

      zafClient = window.ZAFClient.init();

      console.log({ zafClient }, 'init');

      setClient(zafClient);

      if (zafClient) {

        console.log('invoke');

        zafClient.invoke('resize', { width: '100%', height: '200px' });

      }

    }

  }, [client]);

  return client;

}
const ZendeskChat = () => {
  const scriptUrl = 'https://static.zdassets.com/ekr/snippet.js?key=xxxxxxx';
  const scriptId = 'ze-snippet';

  useZafClient();

  return <Script src={scriptUrl} id={scriptId} type="text/javascript" />;
};

export default ZendeskChat;
export default async function RootLayout({ children, params }: LayoutProps) {

  const { locale } = params;

  return (

    <html lang={locale} className={roboto.variable}>

      <body>{children}</body>

      <ZendeskChat />

    </html>

  );

}

in Manifest.json

  "location": {

    "chat": {

      "chat_sidebar": "localhost:3000"

    }

  }

 Thank you!

Best, 

Fandy


0

4

0 commenti

Accedi per aggiungere un commento.

Non hai trovato quello che cerchi?

Nuovo post