From 7425a754831c89f70c73f9d0124ffd3ffe4ecc70 Mon Sep 17 00:00:00 2001 From: msfstef Date: Wed, 24 Apr 2024 17:36:41 +0300 Subject: [PATCH] Update README to fix importing the toolbar --- components/toolbar/README.md | 15 ++++++--------- 1 file changed, 6 insertions(+), 9 deletions(-) diff --git a/components/toolbar/README.md b/components/toolbar/README.md index 78a5d35953..6ef50c1e4f 100644 --- a/components/toolbar/README.md +++ b/components/toolbar/README.md @@ -28,18 +28,15 @@ Add the toolbar to your project's `devDependencies` in `package.json` } ``` -First some imports - -```typescript -import { addToolbar } from '@electric-sql/debug-toolbar' -import '@electric-sql/debug-toolbar/dist/index.cjs.css' -``` - -Then in your code after calling `electrify` pass the electric client into `addToolbar`: +In your code after calling `electrify`, if in debug mode, import and pass the electric client into `addToolbar`: ```typescript const electric = await electrify(conn, schema, config) -addToolbar(electric) + +if (config.debug) { + import('@electric-sql/debug-toolbar') + .then(({ addToolbar }) => addToolbar(electric)) +} ``` This will add the toolbar to the bottom of your window