Latest changes from marmelab

CHANGELOG.md

@@ -1,5 +1,59 @@
 # Changelog
 
+## v3.11.1
+
+* Fix select empty option in `<AutocompleteInput>` does not reset the input ([5698](https://github.com/marmelab/react-admin/pull/5698)) ([AnkitaGupta111](https://github.com/AnkitaGupta111))
+* Fix `<Empty>` list component does not display when the `Resource` has no `create` component ([5688](https://github.com/marmelab/react-admin/pull/5688)) ([djhi](https://github.com/djhi))
+* Fix `<ExportButton>` doesn't take permanent `filter` into account ([5675](https://github.com/marmelab/react-admin/pull/5675)) ([fzaninotto](https://github.com/fzaninotto))
+* Fix `<Confirm>` dialog shows a scroll bar on mobile ([5674](https://github.com/marmelab/react-admin/pull/5674)) ([rkfg](https://github.com/rkfg))
+* Fix `<ReferenceField>` and `<ReferenceArrayField>` performance by showing loader only after a delay ([5668](https://github.com/marmelab/react-admin/pull/5668)) ([djhi](https://github.com/djhi))
+* [Doc] Fix link to react-final-form `Field` documentation in CreateEdit chapter ([5689](https://github.com/marmelab/react-admin/pull/5689)) ([WiXSL](https://github.com/WiXSL))
+* [Doc] Fix outdated Hasura Data Provider reference ([5686](https://github.com/marmelab/react-admin/pull/5686)) ([djhi](https://github.com/djhi))
+* [Doc] Fix syntax in actions example for `useUpdate` ([5681](https://github.com/marmelab/react-admin/pull/5681)) ([abdenny](https://github.com/abdenny))
+* [Doc] Fix custom theme doc doesn't explain how to override default theme ([5676](https://github.com/marmelab/react-admin/pull/5676)) ([fzaninotto](https://github.com/fzaninotto))
+* [Doc] Fix typos in Tutorial doc ([5669](https://github.com/marmelab/react-admin/pull/5669)) ([paulo9mv](https://github.com/paulo9mv))
+
+## v3.11.0
+
+Starting with this version, 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>
+);
+```
+
+* Add domain telemetry on app mount ([5631](https://github.com/marmelab/react-admin/pull/5631)) ([djhi](https://github.com/djhi))
+* Add ability to access (and override) side effects in `SaveContext` ([5604](https://github.com/marmelab/react-admin/pull/5604)) ([djhi](https://github.com/djhi))
+* Add support for `disabled` in `<ArrayInput>` ([5618](https://github.com/marmelab/react-admin/pull/5618)) ([fzaninotto](https://github.com/fzaninotto))
+* Add ability to customize the notification element in the `<Login>` page ([5630](https://github.com/marmelab/react-admin/pull/5630)) ([hieusmiths](https://github.com/hieusmiths))
+* Disable ripple effect on Buttons for improved performance ([5598](https://github.com/marmelab/react-admin/pull/5598)) ([fzaninotto](https://github.com/fzaninotto))
+* Fix `<TestContext>` doesn't contain `notifications` node ([5659](https://github.com/marmelab/react-admin/pull/5659)) ([fzaninotto](https://github.com/fzaninotto))
+* Fix `<Filter>` fails to show compound filters with no default value ([5657](https://github.com/marmelab/react-admin/pull/5657)) ([fzaninotto](https://github.com/fzaninotto))
+* Fix "Missing translation" console error when the `dataProvider` fails ([5655](https://github.com/marmelab/react-admin/pull/5655)) ([fzaninotto](https://github.com/fzaninotto))
+* Fix `<FilterListItem>` doesn't appear selected when more than one filter is applied ([5644](https://github.com/marmelab/react-admin/pull/5644)) ([fzaninotto](https://github.com/fzaninotto))
+* Fix `usePermissions` always triggers a re-render even though the permissions are unchanged ([5607](https://github.com/marmelab/react-admin/pull/5607)) ([fzaninotto](https://github.com/fzaninotto))
+* [Doc] Add `rowStyle` example usage to `<SimpleList>` jsDoc ([5661](https://github.com/marmelab/react-admin/pull/5661)) ([vdimitroff](https://github.com/vdimitroff))
+* [Doc] Fix `<ReferenceField link>` prop type to show that it accepts a function ([5660](https://github.com/marmelab/react-admin/pull/5660)) ([vdimitroff](https://github.com/vdimitroff))
+* [Doc] Fix missing import in `List` example ([5658](https://github.com/marmelab/react-admin/pull/5658)) ([WiXSL](https://github.com/WiXSL))
+* [Doc] Fix syntax error in `<List exporter>` prop usage ([5649](https://github.com/marmelab/react-admin/pull/5649)) ([WiXSL](https://github.com/WiXSL))
+* [Doc] Fix Sidebar size change resets the theme color ([5646](https://github.com/marmelab/react-admin/pull/5646)) ([zheya08](https://github.com/zheya08))
+* [Doc] Fix `<ReferenceInput>` and `<ReferenceArrayInput>` JSDocs point to the wrong `dataProvider` method ([5645](https://github.com/marmelab/react-admin/pull/5645)) ([WiXSL](https://github.com/WiXSL))
+* [Doc] Add mention of saved queries in List chapter ([5638](https://github.com/marmelab/react-admin/pull/5638)) ([fzaninotto](https://github.com/fzaninotto))
+* [Doc] Fix `<Admin history>` prop injection documentation misses package version constraint ([5538](https://github.com/marmelab/react-admin/pull/5538)) ([fzaninotto](https://github.com/fzaninotto))
+
 ## v3.10.4
 
 * Fix `ra-data-simple-rest` delete method fails because of bad header ([5628](https://github.com/marmelab/react-admin/pull/5628)) ([fzaninotto](https://github.com/fzaninotto))
@@ -1973,7 +2027,7 @@ This new release is not backwards compatible with 1.x. Please refer to [the Upgr
 * Fix date filters ([djhi](https://github.com/djhi))
 * Fix typo in custom actions documentation ([RWOverdijk](https://github.com/RWOverdijk))
 
-## v.1.3.0
+## v1.3.0
 
 * Add permissions handling ([djhi](https://github.com/djhi))
 * Add Not Found page ([fzaninotto](https://github.com/fzaninotto))

docs/Actions.md

@@ -528,6 +528,7 @@ const ApproveButton = ({ record }) => {
         'comments',
         record.id,
         { isApproved: true },
+        record,
         {
             undoable: true,
             onSuccess: ({ data }) => {

docs/CreateEdit.md

@@ -1092,37 +1092,7 @@ export const UserCreate = (props) => (
 
 **Tip**: The props you pass to `<SimpleForm>` and `<TabbedForm>` are passed to the [<Form>](https://final-form.org/docs/react-final-form/api/Form) of `react-final-form`.
 
-**Tip**: The `validate` function can return a promise for asynchronous validation. For instance:
-
-```jsx
-const validateUserCreation = async (values) => {
-    const errors = {};
-    if (!values.firstName) {
-        errors.firstName = ['The firstName is required'];
-    }
-    if (!values.age) {
-        errors.age = ['The age is required'];
-    } else if (values.age < 18) {
-        errors.age = ['Must be over 18'];
-    }
-
-    const isEmailUnique = await checkEmailIsUnique(values.userName);
-    if (!isEmailUnique) {
-        errors.email = ['Email already used'];
-    }
-    return errors
-};
-
-export const UserCreate = (props) => (
-    <Create {...props}>
-        <SimpleForm validate={validateUserCreation}>
-            <TextInput label="First Name" source="firstName" />
-            <TextInput label="Email" source="email" />
-            <TextInput label="Age" source="age" />
-        </SimpleForm>
-    </Create>
-);
-```
+**Tip**: The `validate` function can return a promise for asynchronous validation. See [the Server-Side Validation section](#server-side-validation) below.
 
 ### Per Input Validation: Built-in Field Validators
 
@@ -1285,11 +1255,47 @@ export const ProductEdit = ({ ...props }) => (
 ```
 {% endraw %}
 
-**Tip**: The props of your Input components are passed to a `react-final-form` [<Field>](https://final-form.org/docs/react-final-form/api/Field) component.
+**Tip**: The props of your Input components are passed to a `react-final-form` [Field](https://final-form.org/docs/react-final-form/api/Field) component.
 
 **Tip**: You can use *both* Form validation and input validation.
 
-**Tip**: The custom validator function can return a promise for asynchronous validation. For instance:
+**Tip**: The custom validator function can return a promise, e.g. to use server-side validation. See next section for details.
+
+### Server-Side Validation
+
+You can validate the entire form data server-side by returning a Promise in the form `validate` function. For instance:
+
+```jsx
+const validateUserCreation = async (values) => {
+    const errors = {};
+    if (!values.firstName) {
+        errors.firstName = ['The firstName is required'];
+    }
+    if (!values.age) {
+        errors.age = ['The age is required'];
+    } else if (values.age < 18) {
+        errors.age = ['Must be over 18'];
+    }
+
+    const isEmailUnique = await checkEmailIsUnique(values.userName);
+    if (!isEmailUnique) {
+        errors.email = ['Email already used'];
+    }
+    return errors
+};
+
+export const UserCreate = (props) => (
+    <Create {...props}>
+        <SimpleForm validate={validateUserCreation}>
+            <TextInput label="First Name" source="firstName" />
+            <TextInput label="Email" source="email" />
+            <TextInput label="Age" source="age" />
+        </SimpleForm>
+    </Create>
+);
+```
+
+Per Input validators can also return a Promise to call the server for validation. For instance:
 
 ```jsx
 const validateEmailUnicity = async (value) => {
@@ -1321,7 +1327,8 @@ export const UserCreate = (props) => (
 );
 ```
 
-**Important**: Note that asynchronous validators are not supported on the `ArrayInput` component due to a limitation of [react-final-form-arrays](https://github.com/final-form/react-final-form-arrays).
+**Important**: Note that asynchronous validators are not supported on the `<ArrayInput>` component due to a limitation of [react-final-form-arrays](https://github.com/final-form/react-final-form-arrays).
+
 ## Submit On Enter
 
 By default, pressing `ENTER` in any of the form fields submits the form - this is the expected behavior in most cases. However, some of your custom input components (e.g. Google Maps widget) may have special handlers for the `ENTER` key. In that case, to disable the automated form submission on enter, set the `submitOnEnter` prop of the form component to `false`:

docs/DataProviders.md

@@ -77,7 +77,8 @@ Developers from the react-admin community have open-sourced Data Providers for m
 * **[Firebase Realtime Database](https://firebase.google.com/docs/database)**: [aymendhaya/ra-data-firebase-client](https://github.com/aymendhaya/ra-data-firebase-client).
 * **[GraphQL](https://graphql.org/)**: [marmelab/ra-data-graphql](https://github.com/marmelab/react-admin/tree/master/packages/ra-data-graphql) (uses [Apollo](https://www.apollodata.com/))
 * **[HAL](http://stateless.co/hal_specification.html)**: [b-social/ra-data-hal](https://github.com/b-social/ra-data-hal)
-* **[Hasura](https://github.com/hasura/graphql-engine)**: [hasura/ra-data-hasura](https://github.com/hasura/graphql-engine/tree/master/community/tools/ra-data-hasura)
+* **[Hasura V1](https://github.com/hasura/graphql-engine)**: [hasura/ra-data-hasura](https://github.com/hasura/ra-data-hasura), communicates with Hasura V1, using standard REST and not GraphQL
+* **[Hasura](https://github.com/hasura/graphql-engine)**: [Steams/ra-data-hasura-graphql](https://github.com/Steams/ra-data-hasura-graphql), auto generates valid GraphQL queries based on the properties exposed by the Hasura API.
 * **[Hydra](https://www.hydra-cg.com/) / [JSON-LD](https://json-ld.org/)**: [api-platform/admin/hydra](https://github.com/api-platform/admin/blob/master/src/hydra/dataProvider.js)
 * **[IndexedDB](https://developer.mozilla.org/en-US/docs/Web/API/IndexedDB_API)**: [tykoth/ra-data-dexie](https://github.com/tykoth/ra-data-dexie)
 * **[JSON API](https://jsonapi.org/)**: [henvo/ra-jsonapi-client](https://github.com/henvo/ra-jsonapi-client)

docs/List.md

@@ -1392,6 +1392,20 @@ export const PostList = (props) => (
 
 You can use a similar approach to customize the list filter completely, e.g. to display the filters in a sidebar, or as a line in the datagrid, etc.
 
+### Global Search
+
+Although list filters allow to make precise queries using per-field criteria, users often prefer simpler interfaces like full-text search. After all, that's what they use every day on search engines, email clients, and in their file explorer. 
+
+If you want to display a full-text search allowing to look for any record in the admin using a single form input, check out [ra-search](https://marmelab.com/ra-enterprise/modules/ra-search), an [Enterprise Edition](https://marmelab.com/ra-enterprise)<img class="icon" src="./img/premium.svg" /> module.
+
+![ra-search basic](https://marmelab.com/ra-enterprise/modules/assets/ra-search-overview.gif)
+
+`ra-search` can plug to any existing search engine (ElasticSearch, Lucene, or custom search engine), and lets you customize the search results to provide quick navigation to related items, turniun the search engine into an "Omnibox": 
+
+![ra-search demo](https://marmelab.com/ra-enterprise/modules/assets/ra-search-demo.gif)
+
+For mode details about the global search, check the [`ra-search` module](https://marmelab.com/ra-enterprise/modules/ra-search) in React-Admin Enterprise Edition. 
+
 ## Sorting The List
 
 <table><tbody><tr style="border:none">
@@ -1898,7 +1912,7 @@ You can find many usage examples of `useListContext` in this page, including:
 - [Building an Aside Component](#aside-aside-component)
 - [Building a Custom Empty Page](#empty-empty-page-component)
 - [Building a Custom Filter](#building-a-custom-filter)
-- [Building a Custom Sort Control](##building-a-custom-sort-control)
+- [Building a Custom Sort Control](#building-a-custom-sort-control)
 - [Building a Custom Pagination Control](#building-a-custom-pagination-control)
 - [Building a Custom Iterator](#using-a-custom-iterator)
 

docs/Reference.md

@@ -106,6 +106,7 @@ title: "Reference"
 * [`<RowForm>`](https://marmelab.com/ra-enterprise/modules/ra-editable-datagrid#rowform)<img class="icon" src="./img/premium.svg" />
 * `<SaveButton>`
 * [`<SavedFilterList>`](https://marmelab.com/ra-enterprise/modules/ra-preferences#savedquerieslist-and-filterwithsave-store-user-queries-in-preferences)<img class="icon" src="./img/premium.svg" />
+* [`<Search>`](https://marmelab.com/ra-enterprise/modules/ra-search#the-search-component)<img class="icon" src="./img/premium.svg" />
 * `<SearchInput>`
 * [`<SelectArrayInput>`](./Inputs.md#selectarrayinput)
 * [`<SelectColumnsButton>`](https://marmelab.com/ra-enterprise/modules/ra-preferences#selectcolumnsbutton-store-datagrid-columns-in-preferences)<img class="icon" src="./img/premium.svg" />
@@ -189,6 +190,7 @@ title: "Reference"
 * `useReferenceInputController`
 * `useReferenceManyFieldController`
 * [`useRefresh`](./Actions.md#handling-side-effects-in-usedataprovider)
+* [`useSearch`](https://marmelab.com/ra-enterprise/modules/ra-search#the-usesearch-hook)<img class="icon" src="./img/premium.svg" />
 * [`useSetLocale`](./Translation.md#usesetlocale-changing-locale-at-runtime)
 * [`useShowController`](./Show.md#useshowcontroller)
 * `useSortState`

docs/Theming.md

@@ -310,15 +310,18 @@ const App = () => (
 
 ## Writing a Custom Theme
 
-If you need more fine-tuning, you'll need to write your own `theme` object, following [Material UI themes documentation](https://material-ui.com/customization/themes/). Material UI merges custom theme objects with the default theme.
+If you need more fine-tuning, you'll need to write your own `theme` object, following [Material UI themes documentation](https://material-ui.com/customization/themes/).
+
+For instance, here is how to override the default react-admin theme:
 
 ```jsx
-import { createMuiTheme } from '@material-ui/core/styles';
+import { defaultTheme } from 'react-admin';
+import merge from 'lodash/merge';
 import indigo from '@material-ui/core/colors/indigo';
 import pink from '@material-ui/core/colors/pink';
 import red from '@material-ui/core/colors/red';
 
-const myTheme = createMuiTheme({
+const myTheme = merge({}, defaultTheme, {
     palette: {
         primary: indigo,
         secondary: pink,
@@ -328,13 +331,7 @@ const myTheme = createMuiTheme({
     },
     typography: {
         // Use the system font instead of the default Roboto font.
-        fontFamily: [
-            '-apple-system',
-            'BlinkMacSystemFont',
-            '"Segoe UI"',
-            'Arial',
-            'sans-serif',
-        ].join(','),
+        fontFamily: ['-apple-system', 'BlinkMacSystemFont', '"Segoe UI"', 'Arial', 'sans-serif'].join(','),
     },
     overrides: {
         MuiButton: { // override the styles of all instances of this component
@@ -346,7 +343,7 @@ const myTheme = createMuiTheme({
 });
 ```
 
-The `myTheme` object contains the following keys:
+A `theme` object can contain the following keys:
 
 * `breakpoints`
 * `direction`
@@ -355,9 +352,9 @@ The `myTheme` object contains the following keys:
 * `palette`
 * `props`
 * `shadows`
-* `typography`
-* `transitions`
 * `spacing`
+* `transitions`
+* `typography`
 * `zIndex`
 
 **Tip**: Check [Material UI default theme documentation](https://material-ui.com/customization/default-theme/) to see the default values and meaning for these keys.
@@ -894,6 +891,8 @@ The `MenuItemLink` component make use of the React Router [NavLink](https://reac
 
 **Tip**: If you need a multi-level menu, or a Mega Menu opening panels with custom content, check out [the `ra-navigation`<img class="icon" src="./img/premium.svg" /> module](https://marmelab.com/ra-enterprise/modules/ra-navigation) (part of the [Enterprise Edition](https://marmelab.com/ra-enterprise))
 
+![multi-level menu](https://marmelab.com/ra-enterprise/modules/assets/ra-multilevelmenu-item.gif)
+
 ![MegaMenu and Breadcrumb](https://marmelab.com/ra-enterprise/modules/assets/ra-multilevelmenu-categories.gif)
 
 ## Using a Custom Login Page

docs/Tutorial.md

@@ -472,7 +472,7 @@ import {
     Edit,
     SimpleForm,
     ReferenceInput,
-    SelectIpnut,
+    SelectInput,
     TextInput,
 } from 'react-admin';
 
@@ -534,7 +534,7 @@ import {
 +   Create,
     SimpleForm,
     ReferenceInput,
-    SelectIpnut,
+    SelectInput,
     TextInput,
 } from 'react-admin';
 

lerna.json

@@ -4,5 +4,5 @@
     "examples/data-generator",
     "packages/*"
   ],
-  "version": "3.10.4"
+  "version": "3.11.1"
 }

packages/ra-core/package.json

@@ -1,6 +1,6 @@
 {
     "name": "ra-core",
-    "version": "3.10.4",
+    "version": "3.11.1",
     "description": "Core components of react-admin, a frontend Framework for building admin applications on top of REST services, using ES6, React",
     "files": [
         "*.md",

packages/ra-core/src/controller/useListController.ts

@@ -61,6 +61,7 @@ export interface ListControllerProps<RecordType extends Record = Record> {
     displayedFilters: any;
     error?: any;
     exporter?: Exporter | false;
+    filter?: FilterPayload;
     filterValues: any;
     hasCreate: boolean;
     hideFilter: (filterName: string) => void;
@@ -250,6 +251,7 @@ const useListController = <RecordType extends Record = Record>(
         displayedFilters: query.displayedFilters,
         error,
         exporter,
+        filter,
         filterValues: query.filterValues,
         hasCreate,
         hideFilter: queryModifiers.hideFilter,