Merge pull request #5631 from marmelab/telemetry

Add domain telemetry on app mount

docs/Admin.md

@@ -32,6 +32,7 @@ Here are all the props accepted by the component:
 - [`i18nProvider`](#i18nprovider)
 - [`title`](#title)
 - [`dashboard`](#dashboard)
+- [`disableTelemetry`](#disableTelemetry)
 - [`catchAll`](#catchall)
 - [`menu`](#menu)
 - [`theme`](#theme)
@@ -138,6 +139,28 @@ const App = () => (
 
 ![Custom home page](./img/dashboard.png)
 
+## `disableTelemetry`
+
+In production, react-admin applications send an anonymous request on mount to a telemetry server operated by marmelab. You can see this request by looking at the Network tab of your browser DevTools:
+
+`https://react-admin-telemetry.marmelab.com/react-admin-telemetry`
+
+The only data sent to the telemetry server is the admin domain (e.g. "example.com") - no personal data is ever sent, and no cookie is included in the response. The react-admin team uses these domains to track the usage of the framework.
+
+You can opt out of telemetry by simply adding `disableTelemetry` to the `<Admin>` component:
+
+```jsx
+// in src/App.js
+import * as React from "react";
+import { Admin } from 'react-admin';
+
+const App = () => (
+    <Admin disableTelemetry>
+        // ...
+    </Admin>
+);
+```
+
 ## `catchAll`
 
 When users type URLs that don't match any of the children `<Resource>` components, they see a default "Not Found" page.

examples/demo/src/App.tsx

@@ -74,6 +74,7 @@ const App = () => {
             loginPage={Login}
             layout={Layout}
             i18nProvider={i18nProvider}
+            disableTelemetry
         >
             <Resource name="customers" {...visitors} />
             <Resource

packages/ra-core/src/core/CoreAdmin.tsx

@@ -55,7 +55,7 @@ export type ChildrenFunction = () => ComponentType[];
  * // it's relatively straightforward to replace it:
  *
  * import * as React from 'react';
-import { useEffect, useState } from 'react';
+ * import { useEffect, useState } from 'react';
  * import {
  *     CoreAdminContext,
  *     CoreAdminUI,
@@ -96,6 +96,7 @@ const CoreAdmin: FunctionComponent<AdminProps> = ({
     customSagas,
     dashboard,
     dataProvider,
+    disableTelemetry,
     history,
     i18nProvider,
     initialState,
@@ -121,6 +122,7 @@ const CoreAdmin: FunctionComponent<AdminProps> = ({
                 layout={appLayout || layout}
                 customRoutes={customRoutes}
                 dashboard={dashboard}
+                disableTelemetry={disableTelemetry}
                 menu={menu}
                 catchAll={catchAll}
                 theme={theme}

packages/ra-core/src/core/CoreAdminUI.tsx

@@ -4,6 +4,7 @@ import {
     FunctionComponent,
     ComponentType,
     useMemo,
+    useEffect,
 } from 'react';
 import { Switch, Route } from 'react-router-dom';
 
@@ -32,6 +33,7 @@ export interface AdminUIProps {
     children?: AdminChildren;
     customRoutes?: CustomRoutes;
     dashboard?: DashboardComponent;
+    disableTelemetry?: boolean;
     layout?: LayoutComponent;
     loading?: LoadingComponent;
     loginPage?: LoginComponent | boolean;
@@ -50,6 +52,7 @@ const CoreAdminUI: FunctionComponent<AdminUIProps> = ({
     children,
     customRoutes = [],
     dashboard,
+    disableTelemetry = false,
     layout = DefaultLayout,
     loading = Noop,
     loginPage = false,
@@ -62,6 +65,21 @@ const CoreAdminUI: FunctionComponent<AdminUIProps> = ({
     const logoutElement = useMemo(() => logout && createElement(logout), [
         logout,
     ]);
+
+    useEffect(() => {
+        if (
+            disableTelemetry ||
+            process.env.NODE_ENV !== 'production' ||
+            typeof window === 'undefined' ||
+            typeof window.location === 'undefined' ||
+            typeof Image === 'undefined'
+        ) {
+            return;
+        }
+        const img = new Image();
+        img.src = `https://react-admin-telemetry.marmelab.com/react-admin-telemetry?domain=${window.location.hostname}`;
+    }, [disableTelemetry]);
+
     return (
         <Switch>
             {loginPage !== false && loginPage !== true ? (

packages/ra-core/src/types.ts

@@ -474,6 +474,7 @@ export interface AdminProps {
     customSagas?: any[];
     dashboard?: DashboardComponent;
     dataProvider: DataProvider | LegacyDataProvider;
+    disableTelemetry?: boolean;
     history?: History;
     i18nProvider?: I18nProvider;
     initialState?: InitialState;

packages/react-admin/src/Admin.tsx

@@ -94,6 +94,7 @@ const Admin: FunctionComponent<AdminProps> = ({
     customSagas,
     dashboard,
     dataProvider,
+    disableTelemetry,
     history,
     i18nProvider,
     initialState,
@@ -137,6 +138,7 @@ const Admin: FunctionComponent<AdminProps> = ({
                 layout={appLayout || layout}
                 customRoutes={customRoutes}
                 dashboard={dashboard}
+                disableTelemetry={disableTelemetry}
                 menu={menu}
                 catchAll={catchAll}
                 theme={theme}