The first step on cleaning up our client-side metadata configuration. With this approach, the values are computed in the `wagtail_config` template tag and passed into the template using Django's json_script.
Then, it's parsed on the client-side and set as `global.wagtailConfig` to retain compatibility with existing code that rely on `window.wagtailConfig`.
This allows us to remove our existing approach of putting metadata values in a `<script>` tag using Django templates directly in the HTML, without changing too much of the existing code, and allowing new code to import the values as `WAGTAIL_CONFIG` from `wagtailConfig.js` instead of using `window.wagtailConfig`. It also means we remove the inline script tag from the core admin base template.
Refactor wagtailConfig util
- Avoid extraneous named exports when they are included in the named WAGTAIL_CONFIG
- Simplify locale map generation
- Avoid reading from global, instead export util that can be used as a global
- Update unit tests for more robust checks
Instead of relying on global window.chooserUrls, add the support for also passing in entityType config objects that serve the same purpose.
Update JS unit tests to reflect that the future will no longer support the window.chooserUrls
- `uuid` update is required to avoid import errors - https://github.com/uuidjs/uuid/blob/main/CHANGELOG.md#900-2022-09-05
- Add stubs for window.scrollTo to avoid console errors when running tests
- Filter out warnings for Draftail React warnings, these are unlikely to be resolved anytime soon and add noise to the Jests tests that are unhelpful
- Closes #10043
Previously, anything invoking the chooser modal needed to make its own call to ModalWorkflow, which meant it needed to import the corresponding 'onloadHandlers' dict, know the appropriate chosen response identifier to listen to, and know how to modify the chooser URL to pass parameters (if applicable). This would mean a lot of duplicated logic if there were multiple places where the modal is invoked.
Here we introduce a ChooserModal base class which encapsulates those details - a caller just needs to instantiate it with the base URL, and call `open` on it to open the modal (passing an options dict and a response callback).
* Make "Are you sure?" on comment reply deletion correct size
* Update wording of warning after editing comment
* Tighten up height of comment warnings
* Add warning to bottom of draft comments
* Add a warning to bottom of edited comments
* Add a warning at the bottom of comments with unsaved replies
* Set role="status" on the comment notice
Adds inline commenting to the Draftail editor (FE only), and refactors field level comments to subscribe to updates from the store directly
* Refactor field level comments to subscribe to updates directly from the commenting store, rather than calling methods on supplied widgets and annotations directly from the commenting app
* Update Draftail and React-Redux packages in preparation for Draftail inline commenting
* Add CommentableEditor version of Draftail as controlled component, in preparation for manipulating state from the comments system
* Only initialize CommentableEditor if comments are on and the contentpath is valid. Add a comment-adding control to CommentableEditor
* Update eslint
* Remove comment adding control from Draftail if comments are disabled
* fixup! Only initialize CommentableEditor if comments are on and the contentpath is valid. Add a comment-adding control to CommentableEditor
* Add decorator to comments, allowing them to be focused
* Add inline styling to comments
* Make Draftail instance accessible via the DOM node on CommentableEditor as well
* Force rerender for styles and decorators when necessary, and filter out deleted comments
* Remove comment styles when saving Draftail content
* Fix formatting error
* Remove unnecessary comment
* Don't use addition for string concatenation
* Newline
* Add explanatory comment about save logic
* fixup! Don't use addition for string concatenation
* Use more idiomatic undefined check
* Fix aria-label for comment button
* Use span to decorate link
Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>
* Update getFullSelectionState comment
Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>
* Reorder selection state generation
Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>
* Remove unused argument
Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>
* Make draftail position comments by median annotation, and pin by clicked comment
* Remove inline return
* Make setPinnedComment an option on setFocusedComment
* Add JSDoc comments and remove unused attribute
* use decoratorRef instead of Ref for clarity in annotation
* fixup! Update eslint
* Update Draftail snapshot
* Move entrypoint
* Prettier reformat and eslint fix
* Use Typescript for CommentableEditor
* Install types for react-redux and draft-js
* Remove unused popPage from interface
* Add draftjs-filters as an explicit dependency
* fixup! Use Typescript for CommentableEditor
* Add explicit type for timeout
Co-authored-by: Thibaud Colas <thibaudcolas@gmail.com>
* Initial working version of comment frontend in edit view
* Make comment js text translatable
* Add comment icon
* Basic hardcoded comment adding widget
* Create widget object and register it with the comment app to subscribe to updates about related annotations and whether comments are shown
* Add data-contentpath attributes to field (and data-contentpath-disabled to fields which prevent a stable contentpath existing at this point - ie ListBlock block positions are not uniquely identified), and to ensure newly generated streamfield blocks also have a stable contentpath identifiable from the frontend, make streamfield uuids generate clientside
* Make comments detect new contentpaths, and move hardcoded comment widget on chooser template into js initialisation, also making new comment buttons init properly in new streamfield blocks
* Fix tests to expect contentpaths
* Remove two step comment widget initialisation, and replace with stored callbacks for widgets that try to initialise themselves before the comment app itself. Refactor widgets to receive the makeComment function directly from the commenting system via an onRegister method to accommodate this
* Use object argument instead of positional for FieldLevelCommentWidget constructor
* Use json_script to pass author to the comments system
* Ensure that when you open the explorer the focus moves to the first link of the menu, and add a label for the explorer navigation
* Add dialog role to pages explorer popup, and ensure that there is an option to close the dialog window when tabbing by making the close button visually hidden rather than display none
* Adds clearer text to the close button for modals
* Use existing wagtailConfig.STRINGS to store the new translatable string for JS, rather than introducing a new library.
* Update list of string constants for translation in the tests file
* Remove aria-hidden on modal dialog close button
Instead of passing an 'onload' JS function as part of the AJAX response for each step of the workflow,
we specify all onload handlers up-front when initialising ModalWorkflow, and return a 'step' field
in the response to indicate which one to trigger.
* Expose Draftail package as global variable for reuse
* Expose Wagtail React components for reuse
* Expose Draftail-related React components for reuse
