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

Refactor the EditorProvider component and extract hooks #27605

Merged
merged 3 commits into from
Dec 10, 2020

Conversation

youknowriad
Copy link
Contributor

With the addition of template mode #26355 and a couple of other things added over time, the EditorProvider component has grown to become a bit mysterious and very hard to understand.

This PR refactors it as a functional component and extract some meaningful hooks from it for better separation of concerns.

  • It extracts a usePostContentEditor to bridge between a posttype/postId and the state in core/data
  • It extracts a useBlockEditorSettings hook to separate the computation of the block editor settings from the initialization work done by EditorProvider.

I think there's a lot more potential for refactoring that can be done, especially related to the initialization effect (why don't we just remove the initialization step completely and have the component react to changes).

This PR kept the flows exactly the same.

@youknowriad youknowriad added the [Type] Code Quality Issues or PRs that relate to code quality label Dec 9, 2020
@youknowriad youknowriad self-assigned this Dec 9, 2020
@github-actions
Copy link

github-actions bot commented Dec 9, 2020

Size Change: +114 B (0%)

Total Size: 1.21 MB

Filename Size Change
build/block-editor/index.js 128 kB +215 B (0%)
build/block-library/index.js 149 kB +12 B (0%)
build/blocks/index.js 48.1 kB +3 B (0%)
build/components/index.js 172 kB +2 B (0%)
build/compose/index.js 10.2 kB -1 B
build/core-data/index.js 15.3 kB -1 B
build/data/index.js 8.98 kB +1 B
build/edit-navigation/index.js 11.1 kB +1 B
build/edit-widgets/index.js 26.3 kB +2 B (0%)
build/editor/index.js 43.3 kB -137 B (0%)
build/element/index.js 4.63 kB +5 B (0%)
build/list-reusable-blocks/index.js 3.1 kB +4 B (0%)
build/media-utils/index.js 5.32 kB +3 B (0%)
build/plugins/index.js 2.54 kB +4 B (0%)
build/reusable-blocks/index.js 2.92 kB -1 B
build/server-side-render/index.js 2.77 kB +2 B (0%)
ℹ️ View Unchanged
Filename Size Change
build/a11y/index.js 1.14 kB 0 B
build/annotations/index.js 3.8 kB 0 B
build/api-fetch/index.js 3.42 kB 0 B
build/autop/index.js 2.83 kB 0 B
build/blob/index.js 665 B 0 B
build/block-directory/index.js 8.72 kB 0 B
build/block-directory/style-rtl.css 943 B 0 B
build/block-directory/style.css 942 B 0 B
build/block-editor/style-rtl.css 11.2 kB 0 B
build/block-editor/style.css 11.2 kB 0 B
build/block-library/editor-rtl.css 9.07 kB 0 B
build/block-library/editor.css 9.07 kB 0 B
build/block-library/style-rtl.css 8.35 kB 0 B
build/block-library/style.css 8.35 kB 0 B
build/block-library/theme-rtl.css 789 B 0 B
build/block-library/theme.css 790 B 0 B
build/block-serialization-default-parser/index.js 1.88 kB 0 B
build/block-serialization-spec-parser/index.js 3.06 kB 0 B
build/components/style-rtl.css 15.4 kB 0 B
build/components/style.css 15.3 kB 0 B
build/data-controls/index.js 827 B 0 B
build/date/index.js 31.8 kB 0 B
build/deprecated/index.js 769 B 0 B
build/dom-ready/index.js 571 B 0 B
build/dom/index.js 4.95 kB 0 B
build/edit-navigation/style-rtl.css 881 B 0 B
build/edit-navigation/style.css 885 B 0 B
build/edit-post/index.js 306 kB 0 B
build/edit-post/style-rtl.css 6.49 kB 0 B
build/edit-post/style.css 6.47 kB 0 B
build/edit-site/index.js 24.7 kB 0 B
build/edit-site/style-rtl.css 3.93 kB 0 B
build/edit-site/style.css 3.93 kB 0 B
build/edit-widgets/style-rtl.css 3.13 kB 0 B
build/edit-widgets/style.css 3.13 kB 0 B
build/editor/editor-styles-rtl.css 476 B 0 B
build/editor/editor-styles.css 478 B 0 B
build/editor/style-rtl.css 3.84 kB 0 B
build/editor/style.css 3.84 kB 0 B
build/escape-html/index.js 735 B 0 B
build/format-library/index.js 6.74 kB 0 B
build/format-library/style-rtl.css 547 B 0 B
build/format-library/style.css 548 B 0 B
build/hooks/index.js 2.27 kB 0 B
build/html-entities/index.js 622 B 0 B
build/i18n/index.js 3.57 kB 0 B
build/is-shallow-equal/index.js 698 B 0 B
build/keyboard-shortcuts/index.js 2.54 kB 0 B
build/keycodes/index.js 1.93 kB 0 B
build/list-reusable-blocks/style-rtl.css 476 B 0 B
build/list-reusable-blocks/style.css 476 B 0 B
build/notices/index.js 1.82 kB 0 B
build/nux/index.js 3.42 kB 0 B
build/nux/style-rtl.css 671 B 0 B
build/nux/style.css 668 B 0 B
build/primitives/index.js 1.43 kB 0 B
build/priority-queue/index.js 789 B 0 B
build/redux-routine/index.js 2.84 kB 0 B
build/rich-text/index.js 13.4 kB 0 B
build/shortcode/index.js 1.69 kB 0 B
build/token-list/index.js 1.27 kB 0 B
build/url/index.js 2.84 kB 0 B
build/viewport/index.js 1.86 kB 0 B
build/warning/index.js 1.14 kB 0 B
build/wordcount/index.js 1.22 kB 0 B

compressed-size-action

}, [] );
const { id, type } = __unstableTemplate ?? post;
const blockEditorProps = usePostContentEditor( type, id );
const editorSettings = useBlockEditorSettings(
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I like it 💯

@youknowriad youknowriad force-pushed the update/refactor-editor-provider branch from 22af4db to d946c4c Compare December 10, 2020 09:29
@youknowriad youknowriad merged commit 225b075 into master Dec 10, 2020
@youknowriad youknowriad deleted the update/refactor-editor-provider branch December 10, 2020 10:02
@github-actions github-actions bot added this to the Gutenberg 9.6 milestone Dec 10, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Type] Code Quality Issues or PRs that relate to code quality
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants