Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(react): provide devtools component #61

Open
revolunet opened this issue Apr 26, 2023 · 1 comment
Open

feat(react): provide devtools component #61

revolunet opened this issue Apr 26, 2023 · 1 comment
Labels
📦 devtools enhancement New feature or request

Comments

@revolunet
Copy link
Member

Can we provide a full DevTools react component so we dont have to add this to each project ?

import '@e2esdk/devtools'
import { E2ESDKDevtoolsElement } from '@e2esdk/devtools'
import { useE2ESDKClient } from '@e2esdk/react'
import React from 'react'

export const Devtools = () => {
  const client = useE2ESDKClient()
  const ref = React.useRef<E2ESDKDevtoolsElement>(null)
  React.useEffect(() => {
    if (!ref.current) {
      return
    }
    ref.current.client = client
  }, [client])
  return <e2esdk-devtools ref={ref} theme="dark" />
}
@franky47
Copy link
Contributor

franky47 commented Jun 6, 2023

We could, though this would require an additional library, or some sort of circular dependency between the @socialgouv/e2esdk-react and @socialgouv/e2esdk-devtools packages.

The devtools package already has the e2esdk-react package as a dep (should actually be a devDep), so it could be added there. I'll have to check whether the original idea of having the devtools framework-agnostic still stands (ie: not adding react et al to the deps list).

One caveat though with Next.js is that this component will still have to be dynamically imported on client components only (as WebComponents can't be used in SSR, AFAIK).

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
📦 devtools enhancement New feature or request
Projects
None yet
Development

No branches or pull requests

2 participants