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

feat: rich text and user mention components (DHIS2-15522) #1525

Merged
merged 35 commits into from
Jun 6, 2024

Conversation

edoardo
Copy link
Member

@edoardo edoardo commented Jun 28, 2023

Implements DHIS2-15522

Relates to dhis2/dashboard-app#2474


Key features

  1. Rich text editor and parser components
  2. User mention component
  3. Add inputHeight option for RichTextEditor for controlling the height of the textarea used internally in the editor

Description

The rich text parser was still used from d2-ui-rich-text component.
The Interpretation components in analytics had a new implementation without d2 and MUI for both the rich text editor and the user mention.
This PR is taking those out of the Interpretation component and exporting them on their own, also, the tests originally in the d2-ui package have been moved over to analytics.

Apps that use d2-ui-rich-text and/or d2-ui-mentions-wrapper can update to these new components.

The rich text editor is more advanced compared to the original one and it provides a UI with a series of buttons for the various functionalities.


TODO


Known issues

  1. This seems to be fixed now but needs more testing: A vertical scrollbar appears in the interpretations component. This seems to be related to the height: 100% of the textarea and to the overflow-y: auto on the edit div around it, which were added to allow the textarea to follow the size of the parent (https://dhis2.atlassian.net/browse/DHIS2-15535)
Screenshot 2023-07-14 at 14 47 49

Screenshots

Example of use in LL (no visual changes here):
Screenshot 2023-06-28 at 15 47 01

Example of use in dashboard:
(before)
Screenshot 2023-06-28 at 15 46 04

(after)
Screenshot 2023-06-28 at 15 46 22

@edoardo edoardo marked this pull request as ready for review June 29, 2023 13:44
@jenniferarnesen jenniferarnesen self-assigned this Jul 3, 2023
@edoardo edoardo marked this pull request as draft September 14, 2023 12:06
"Moved" from d2-ui-rich-text.
RichText has the Jest tests from the old d2-ui implementation.
This allows for customization of the textarea height.
When the same query is run multiple times, data does not change and the
useEffect does not trigger.
By looking at fetching instead, we can set data every time the query is
completed.
@edoardo edoardo force-pushed the feat/rich-text-user-mention-components branch from 5afcf61 to 6ecad89 Compare February 7, 2024 15:13
@edoardo edoardo force-pushed the feat/rich-text-user-mention-components branch from 6ecad89 to fcccbbc Compare February 8, 2024 09:00
@edoardo edoardo marked this pull request as ready for review March 18, 2024 15:37
@edoardo edoardo changed the title feat: rich text and user mention components feat: rich text and user mention components (DHIS2-15522) Jun 6, 2024
@edoardo edoardo merged commit 5681126 into master Jun 6, 2024
3 checks passed
@edoardo edoardo deleted the feat/rich-text-user-mention-components branch June 6, 2024 14:17
dhis2-bot added a commit that referenced this pull request Jun 6, 2024
# [26.7.0](v26.6.14...v26.7.0) (2024-06-06)

### Features

* rich text and user mention components (DHIS2-15522) ([#1525](#1525)) ([5681126](5681126))
@dhis2-bot
Copy link
Contributor

🎉 This PR is included in version 26.7.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants