Keep seeing the Connect builder.io popup on local

General
1

Builder public api key
9f751a108477495b8d80c49dcb4b25ba

What are you trying to accomplish
Trying to close the builder.io connect page

Screenshot

image
image1198×508 27 KB

Code stack you are integrating Builder with
react typescript in vitejs

Just installed the builder.io on my application, and this popup keeps showing on every page/routes and even though i already went through the get started steps. and it says success this popup shows again when i navigate to a different page

dependencies: {
  "@builder.io/sdk-react": "^3.0.1",
},

devDependencies: {
  "@builder.io/dev-tools": "^1.3.3",
}

// The builderpage component.
// ... rest of the code

const MODEL_NAME = "page";

export default function CatchAllBuilderRoutes() {
  const { pathname } = useLocation();
  const [notFound, setNotFound] = useState(false);
  const [content, setContent] = useState<BuilderContent | null>(null);

  useEffect(() => {
    fetchOneEntry({
      model: MODEL_NAME,
      apiKey: BUILDER_API_KEY,
      userAttributes: {
        urlPath: pathname,
      },
      options: getBuilderSearchParams(new URL(location.href).searchParams),
    })
      .then((content) => {
        if (content) {
          setContent(content);
        }
        setNotFound(!content);
      })
      .catch((err) => {
        // eslint-disable-next-line no-console
        console.log("CatchAllBuilderRoutes: ", err);
      });
  }, [pathname]);

  // If no page is found, return
  // a 404 page from your code.
  if (notFound && !isPreviewing()) {
    return <CustomError statusCode={HttpStatusCode.NotFound} />;
  }

  // return the page when found
  return (
    <div className="w-full">
        <Content
          content={content}
          model={MODEL_NAME}
          apiKey={BUILDER_API_KEY}
          customComponents={customComponents}
        />
    </div>
  );
}
2

Hey @aeLrak , React Gen2 is currently not compatible with Builder Devtools. If you’d like to use the Builder Devtools, you can switch to React Gen1.

Alternatively, you can still use React Gen2 by manually setting up the integration. Check out our guide on integrating Builder with your app to get started. Let me know if you have any questions!