openpanel/packages/devtools/src/provider.tsx
Stefan Pejcic 09f9f9502d packages
2024-11-07 19:03:37 +01:00

25 lines
1.1 KiB
TypeScript

import React from "react";
import { DevToolsContextProvider } from "@refinedev/devtools-shared";
import { getDevtoolsUrlFromEnv } from "./utilities/get-devtools-url-from-env";
type Props = React.PropsWithChildren<{
/**
* Devtools URL to connect to the server. This will also be used for the WebSocket connections and serving the Devtools UI.
* By default, it will use the `REFINE_DEVTOOLS_PORT` environment variable to construct to URL or use `5001` as the default port.
* If you're using `refine dev` command, it will try to automatically set the environment variable for you and use it.
* If environment variable is not working for you, you can manually set the URL as a string or a tuple of `[httpUrl: string, wsUrl: string]`.
*/
url?: string | [httpUrl: string, wsUrl: string];
}>;
export const DevtoolsProvider =
__DEV_CONDITION__ !== "development"
? ({ children }: Props) => children as any
: ({ children, url = getDevtoolsUrlFromEnv() }: Props) => {
return (
<DevToolsContextProvider url={url}>
{children}
</DevToolsContextProvider>
);
};