Merge pull request #2289 from marmelab/next

[WIP] Prepare 2.3 release

Author: fzaninotto

.babelrc

@@ -1,14 +1,56 @@
 {
-    "presets": ["es2015", "stage-0", "react"],
-    "plugins": [
-        "transform-react-jsx",
-        "add-module-exports",
-        ["babel-plugin-transform-builtin-extend", {
-            "globals": ["Error"]
-        }],
-        ["transform-runtime", {
-            "polyfill": false,
-            "regenerator": true
-        }]
-    ]
+    "env": {
+        "cjs": {
+            "presets": [
+                ["env", {
+                    "targets": {
+                        "browsers": ["last 2 versions"]
+                    }
+                }],
+                "react"
+            ],
+            "plugins": [
+                "transform-react-jsx",
+                "add-module-exports",
+                ["babel-plugin-transform-builtin-extend", {
+                    "globals": ["Error"]
+                }],
+                ["transform-runtime", {
+                    "polyfill": false,
+                    "regenerator": true
+                }],
+                "transform-class-properties",
+                "transform-object-rest-spread",
+                "transform-export-extensions",
+                "transform-async-to-generator",
+                "syntax-trailing-function-commas"
+            ]
+        },
+        "esm": {
+            "presets": [
+                ["env", {
+                    "modules": false,
+                    "targets": {
+                        "browsers": ["last 2 versions"]
+                    }
+                }],
+                "react"
+            ],
+            "plugins": [
+                "transform-react-jsx",
+                ["babel-plugin-transform-builtin-extend", {
+                    "globals": ["Error"]
+                }],
+                ["transform-runtime", {
+                    "polyfill": false,
+                    "regenerator": true
+                }],
+                "transform-class-properties",
+                "transform-object-rest-spread",
+                "transform-export-extensions",
+                "transform-async-to-generator",
+                "syntax-trailing-function-commas"
+            ]
+        },
+    },
 }

.gitignore

@@ -3,6 +3,7 @@ yarn-error.log
 lerna-debug.log
 node_modules
 lib
+esm
 es6
 docs/_site/
 packages/react-admin/docs

CHANGELOG.md

@@ -1,5 +1,52 @@
 # Changelog
 
+## v2.3.0
+
+* [`Actions`] Move `<Refresh>` to `<AppBar>` ([fzaninotto](https://github.com/fzaninotto))
+* [`Actions`] Remove the `<ListButton>` ([fzaninotto](https://github.com/fzaninotto))
+* [`Actions`] Update `<Button>` to adapt the icon size to the button size ([fzaninotto](https://github.com/fzaninotto))
+* [`AppBar`] Add `<UserMenu>` to group user-related actions (and `<Logout>`) ([fzaninotto](https://github.com/fzaninotto))
+* [`AppBar`] Add Headroom effect (show/hide on scroll) ([zyhou](https://github.com/zyhou))
+* [`ArrayInput`] Add debounce to `crudGetMatching` calls ([djhi](https://github.com/djhi))
+* [`ArrayInput`] Allow the `<FormDataConsumer>` to be used inside an `ArrayInput` ([djhi](https://github.com/djhi))
+* [`AutocompleteArrayInput`] Fix select on click ([djhi](https://github.com/djhi))
+* [`Datagrid`] Add padding right to the last column ([fzaninotto](https://github.com/fzaninotto))
+* [`Datagrid`] Hide the sort icons when the column is not active ([fzaninotto](https://github.com/fzaninotto))
+* [`Edit`] Add the `<TitleForRecord>` component (replacement for `<RecordTitle>`) ([fzaninotto](https://github.com/fzaninotto))
+* [`Edit`] Move the `<Delete>` button down to the Toolbar ([fzaninotto](https://github.com/fzaninotto))
+* [`Edit`] Use material design recommended margin for content ([fzaninotto](https://github.com/fzaninotto))
+* [`FormDataConsumer`] Fix wrong warning ([djhi](https://github.com/djhi))
+* [`FormInput`] Add the component to the export ([pedrohh](https://github.com/pedrohh))
+* [`Input`] Add `<AutocompleteArrayInput>` for editing one-to-many relationships with a large number of options ([djhi](https://github.com/djhi))
+* [`List`] Add `<BulkActionToolbar>` as a replacement for the `<BulkActions>` ([fzaninotto](https://github.com/fzaninotto))
+* [`List`] Display the `Filter` on the top left of the content ([fzaninotto](https://github.com/fzaninotto))
+* [`Login`] Replace the lock icon to allow forward compatibility with `@material-ui/icons` 2.0 ([djhi](https://github.com/djhi))
+* [`Pagination`] Add the ability to set the number of rows per page ([fzaninotto](https://github.com/fzaninotto))
+* [`RichTextInput`] Add support for `fullWidth` prop ([natrim](https://github.com/natrim))
+* [`Sidebar`] Add the ability to change the width ([fzaninotto](https://github.com/fzaninotto))
+* [`TabbedLayout`, `TabbedForm`] Let large forms extend horizontally, remove overflow scroll ([djhi](https://github.com/djhi))
+* [`Title`] Move the content to the `AppBar` ([fzaninotto](https://github.com/fzaninotto))
+* [`tree`] Introduce `ra-tree-core` and `ra-tree-ui-materialui` to display and edit tress structures in a List view (Labs) ([djhi](https://github.com/djhi))
+* [console] Add deprecation warnings (when not in production mode) ([djhi](https://github.com/djhi))
+* [Demo] Fix and upgrade GraphQL and Graphcool demos ([djhi](https://github.com/djhi))
+* [Demo] Improve fake data to have real avatars, consistent emails, and better looking reviews ([fzaninotto](https://github.com/fzaninotto))
+* [GraphQL] Add 'How does it work' section to the `ra-data-graphql` README ([Weakky](https://github.com/Weakky))
+* [GraphQL] Add a link to a Prisma `dataProvider` ([Weakky](https://github.com/Weakky))
+* [GraphQL] Allow easier per-query override ([djhi](https://github.com/djhi))
+* [npm] Expose `esm` modules to enable tree shaking (and smaller bundle size) ([Kmaschta](https://github.com/Kmaschta))
+* [npm] Remove babel `stage-0` preset and use `preset-env` instead ([Kmaschta](https://github.com/Kmaschta))
+* [redux] Allow to use <Admin> inside an external <Provider> ([fzaninotto](https://github.com/fzaninotto))
+
+Deprecations:
+
+* `<Admin>` `menu` prop. To override the menu component, use a [custom layout](#appLayout) instead.
+* `<AppBarMobile>`. The `<AppBar>` component is now responsive.
+* `<BulkActions>`. Use `<BulkActionToolbar>` instead.
+* `<Header>`. Use `<Title>` instead.
+* `<RecordTitle>`. Use `<TitleForRecord>` instead.
+* `<ViewTitle>`. Use `<Title>` instead.
+* GraphQL provides `override` prop. Use `buildQuery` instead.
+
 ## v2.2.4
 
 * Fix `<SaveButton>` misaligned `<CircularProgress>` ([natrim](https://github.com/natrim))

Makefile

@@ -9,7 +9,7 @@ install: package.json ## install dependencies
 run: run-simple
 
 run-simple: ## run the simple example
-	@yarn -s run-simple
+	@BABEL_ENV=cjs yarn -s run-simple
 
 run-tutorial: ## run the tutorial example
 	@yarn -s run-tutorial
@@ -28,56 +28,64 @@ run-graphcool-demo: ## run the demo example
 
 build-ra-core:
 	@echo "Transpiling ra-core files...";
-	@cd ./packages/ra-core && yarn -s build
+	@cd ./packages/ra-core && yarn -s build && yarn -s build-esm
 
 build-ra-ui-materialui:
 	@echo "Transpiling ra-ui-materialui files...";
-	@cd ./packages/ra-ui-materialui && yarn -s build
+	@cd ./packages/ra-ui-materialui && yarn -s build && yarn -s build-esm
 
 build-react-admin:
 	@echo "Transpiling react-admin files...";
 	@rm -rf ./packages/react-admin/docs
-	@cd ./packages/react-admin && yarn -s build
+	@cd ./packages/react-admin && yarn -s build && yarn -s build-esm
 	@mkdir packages/react-admin/docs
 	@cp docs/*.md packages/react-admin/docs
 
 build-ra-data-fakerest:
 	@echo "Transpiling ra-data-fakerest files...";
-	@cd ./packages/ra-data-fakerest && yarn -s build
+	@cd ./packages/ra-data-fakerest && yarn -s build && yarn -s build-esm
 
 build-ra-data-json-server:
 	@echo "Transpiling ra-data-json-server files...";
-	@cd ./packages/ra-data-json-server && yarn -s build
+	@cd ./packages/ra-data-json-server && yarn -s build && yarn -s build-esm
 
 build-ra-data-simple-rest:
 	@echo "Transpiling ra-data-simple-rest files...";
-	@cd ./packages/ra-data-simple-rest && yarn -s build
+	@cd ./packages/ra-data-simple-rest && yarn -s build && yarn -s build-esm
 
 build-ra-data-graphql:
 	@echo "Transpiling ra-data-graphql files...";
-	@cd ./packages/ra-data-graphql && yarn -s build
+	@cd ./packages/ra-data-graphql && yarn -s build && yarn -s build-esm
 
 build-ra-data-graphcool:
 	@echo "Transpiling ra-data-graphcool files...";
-	@cd ./packages/ra-data-graphcool && yarn -s build
+	@cd ./packages/ra-data-graphcool && yarn -s build && yarn -s build-esm
 
 build-ra-data-graphql-simple:
 	@echo "Transpiling ra-data-graphql-simple files...";
-	@cd ./packages/ra-data-graphql-simple && yarn -s build
+	@cd ./packages/ra-data-graphql-simple && yarn -s build && yarn -s build-esm
 
 build-ra-input-rich-text:
 	@echo "Transpiling ra-input-rich-text files...";
-	@cd ./packages/ra-input-rich-text && yarn -s build
+	@cd ./packages/ra-input-rich-text && yarn -s build && yarn -s build-esm
 
 build-ra-realtime:
 	@echo "Transpiling ra-realtime files...";
-	@cd ./packages/ra-realtime && yarn -s build
+	@cd ./packages/ra-realtime && yarn -s build && yarn -s build-esm
+
+build-ra-tree-core:
+	@echo "Transpiling ra-tree-core files...";
+	@cd ./packages/ra-tree-core && yarn -s build && yarn -s build-esm
+
+build-ra-tree-ui-materialui:
+	@echo "Transpiling ra-tree-ui-materialui files...";
+	@cd ./packages/ra-tree-ui-materialui && yarn -s build && yarn -s build-esm
 
 build-data-generator:
 	@echo "Transpiling data-generator files...";
-	@cd ./examples/data-generator && yarn -s build
+	@cd ./examples/data-generator && yarn -s build && yarn -s build-esm
 
-build: build-ra-core build-ra-ui-materialui build-react-admin build-ra-data-fakerest build-ra-data-json-server build-ra-data-simple-rest build-ra-data-graphql build-ra-data-graphcool build-ra-data-graphql-simple build-ra-input-rich-text build-ra-realtime build-data-generator ## compile ES6 files to JS
+build: build-ra-core build-ra-ui-materialui build-react-admin build-ra-data-fakerest build-ra-data-json-server build-ra-data-simple-rest build-ra-data-graphql build-ra-data-graphcool build-ra-data-graphql-simple build-ra-input-rich-text build-ra-realtime build-ra-tree-core build-ra-tree-ui-materialui build-data-generator ## compile ES6 files to JS
 
 doc: ## compile doc as html and launch doc web server
 	@yarn -s doc
@@ -108,12 +116,12 @@ test-unit-watch: ## launch unit tests and watch for changes
 test-e2e: ## launch end-to-end tests
 	@if [ "$(build)" != "false" ]; then \
 		echo 'Building example code (call "make build=false test-e2e" to skip the build)...'; \
-		cd examples/simple && yarn -s build; \
+		cd examples/simple && BABEL_ENV=cjs yarn -s build; \
 	fi
 
 	@NODE_ENV=test cd cypress && yarn -s test
 
 
 test-e2e-local: ## launch end-to-end tests for development
-	echo 'Starting e2e tests environment. Ensure you started the simple example first (make run-simple)'
-	cd cypress && yarn -s start
+	@echo 'Starting e2e tests environment. Ensure you started the simple example first (make run-simple)'
+	@cd cypress && yarn -s start

cypress/integration/create.js

@@ -1,11 +1,13 @@
 import createPageFactory from '../support/CreatePage';
+import editPageFactory from '../support/EditPage';
 import showPageFactory from '../support/ShowPage';
 import loginPageFactory from '../support/LoginPage';
 
 describe('Create Page', () => {
     const CreatePage = createPageFactory('/#/posts/create');
     const UserCreatePage = createPageFactory('/#/users/create');
     const ShowPage = showPageFactory('/#/posts/14/show');
+    const EditPage = editPageFactory('/#/posts/14');
     const LoginPage = loginPageFactory('/#/login');
 
     beforeEach(() => {
@@ -14,6 +16,10 @@ describe('Create Page', () => {
         CreatePage.navigate();
     });
 
+    it('should show the correct title in the appBar', () => {
+        cy.get(CreatePage.elements.title).contains('Create Post');
+    });
+
     it('should put the current date in the field by default', () => {
         const currentDate = new Date();
         const currentDateString = currentDate.toISOString().slice(0, 10);
@@ -33,11 +39,25 @@ describe('Create Page', () => {
         );
     });
 
-  it('should have a working array input with references', () => {
+    it('should have a working array input with references', () => {
         cy.get(CreatePage.elements.addAuthor).click();
         cy.get(CreatePage.elements.input('authors[0].user_id')).should(
             el => expect(el).to.exist
         );
+        cy.get(CreatePage.elements.input('authors[0].role')).should(
+            el => expect(el).to.not.exist
+        );
+    });
+
+    it('should have a working array input with a scoped FormDataConsumer', () => {
+        cy.get(CreatePage.elements.addAuthor).click();
+        CreatePage.setValues([
+            {
+                type: 'input',
+                name: 'authors[0].user_id',
+                value: 'Annamarie Mayer{enter}',
+            },
+        ]);
         cy.get(CreatePage.elements.input('authors[0].role')).should(
             el => expect(el).to.exist
         );
@@ -60,7 +80,8 @@ describe('Create Page', () => {
         CreatePage.setValues(values);
         CreatePage.submit();
         ShowPage.waitUntilVisible();
-        ShowPage.delete();
+        EditPage.navigate();
+        EditPage.delete();
     });
 
     it('should stay at create page after create success with "Save and add"', () => {
@@ -83,8 +104,8 @@ describe('Create Page', () => {
             expect(el).to.have.value('')
         ); // new empty form
 
-        ShowPage.navigate();
-        ShowPage.delete();
+        EditPage.navigate();
+        EditPage.delete();
     });
 
     it('should allow to call a custom action updating values before submit', () => {
@@ -111,7 +132,8 @@ describe('Create Page', () => {
         ShowPage.waitUntilVisible();
         ShowPage.gotoTab(3);
         cy.contains('10');
-        ShowPage.delete();
+        EditPage.navigate();
+        EditPage.delete();
     });
 
     it('should not accept creation without required fields', () => {

cypress/integration/custom-forms.js

@@ -1,9 +1,9 @@
 import createPageFactory from '../support/CustomFormPage';
-import showPageFactory from '../support/ShowPage';
+import editPageFactory from '../support/EditPage';
 
 describe('Custom Forms', () => {
     const CreatePage = createPageFactory('#/comments/create');
-    const ShowPage = showPageFactory('#/posts/14/show');
+    const EditPage = editPageFactory('#/posts/14');
 
     beforeEach(() => CreatePage.navigate());
 
@@ -28,7 +28,7 @@ describe('Custom Forms', () => {
         CreatePage.setInputValue('textarea', 'teaser', 'Bazingaaaaaaaa!');
         cy.get(CreatePage.elements.modalSubmitButton).click();
         cy.contains('Bazinga!');
-        ShowPage.navigate();
-        ShowPage.delete();
+        EditPage.navigate();
+        EditPage.delete();
     });
 });

cypress/integration/customPages.js

@@ -8,7 +8,7 @@ describe('Custom Pages', () => {
     describe('Without Layout', () => {
         it('should not display the layout', () => {
             CustomPageNoLayout.navigate();
-            cy.contains('Example Admin').should(el => expect(el).to.not.exist);
+            cy.get('main').should(el => expect(el).to.not.exist);
         });
 
         it('should have retrieved the number of posts', () => {
@@ -19,7 +19,7 @@ describe('Custom Pages', () => {
     describe('With Layout', () => {
         it('should display the layout', () => {
             CustomPageWithLayout.navigate();
-            cy.contains('Example Admin');
+            cy.get('main').should(el => expect(el).to.exist);
         });
 
         it('should have retrieved the number of posts', () => {

cypress/integration/edit.js

@@ -6,6 +6,15 @@ describe('Edit Page', () => {
     const CreatePostPage = createPageFactory('/#/posts/create');
     const EditCommentPage = editPageFactory('/#/comments/5');
 
+    describe('Title', () => {
+        it('should show the correct title in the appBar', () => {
+            EditPostPage.navigate();
+            cy.get(EditPostPage.elements.title).contains(
+                'Post "Sed quo et et fugiat modi"'
+            );
+        });
+    });
+
     describe('TabbedForm', () => {
         beforeEach(() => EditPostPage.navigate());