Archeus Comments - Answer Overflow

Archeus

•Created by Archeus on 2/18/2024 in #help-and-questions

Typebot embed on GatsbyJS

Fixed this with the GPT-4 assistance. I have no idea if this is the best approach, but it's working. If any of you have more robust implementation for Gatsby, please let me know!

import React, { useState, useEffect, Suspense } from 'react';

// Lazy load the Standard component
const StandardLazy = React.lazy(() => import('@typebot.io/react').then(module => ({ default: module.Standard })));

export const Typebot = ({ blok: { id, width = '100%', height = '600px' } }) => {
  const [isClient, setIsClient] = useState(false);

  useEffect(() => {
    // This effect will only run once, when the component mounts, setting isClient to true
    setIsClient(true);
  }, []);

  return (
    <div style={{ width, height }}>
      {isClient && (
        <Suspense fallback={<div>Loading...</div>}>
          <StandardLazy typebot={id} style={{ width, height }} />
        </Suspense>
      )}
    </div>
  );
};

4 replies

TTypebot

•Created by Archeus on 1/17/2024 in #help-and-questions

Redirect a typebot chat to human agent

I definitely will. Thank you so much for explaining me this! You guys made my day.

9 replies

TTypebot

•Created by Archeus on 1/17/2024 in #help-and-questions

Redirect a typebot chat to human agent

That makes sense. Thank you so much for explaining this on the example.

9 replies

TTypebot