Replace current comment editor with Contract Signature wysiwyg

Description

Lets use our own wysiwyg editor for comments and description edition.

  • copy document-sign/src/main/resources/static/wysiwyg to standalone project
  • convert to typescript, prepare build
    • esbuild
    • lint
  • Replace document-sign/src/main/resources/static/wysiwyg with artifact
  • prepare sandbox
  • possibility to customize toolbar (custom elements)
  • Contract Signature toolbar, Jira comment tool bar
    • ADF ↔︎ HTML converter
  • Replace markdown comment with Wysiwyg editor

Child issues

Issue Type Icon ESFJ-861 Extract wysiwyg to separate project Priority: Medium
Released
Issue Type Icon ESFJ-862 Wysiwyg - Create same toolbar as Jira comment toolbar Priority: Medium
Released
Issue Type Icon ESFJ-863 Wysiwyg - Convert ADF to HTML and back Priority: Medium
Released
Issue Type Icon ESFJ-864 Wysiwyg - support what Jira comment editor offers Priority: Medium
Withdrawn
Issue Type Icon ESFJ-865 Replace markdown comment editor wirth our Wysiwyg editor Priority: Medium
Withdrawn

Linked issues

relates to
Issue Type Icon ESFC-198 Allow External User to edit and remove comments (comments created by them) Priority: Medium
Released

Activity

Automation for Jira 18 July 2024, 13:38

Hello @Piotr Haraburda,

Please merge code to dev branch.
This is the best moment to add more information that can be helpful to prepare release notes.

  • Can you prepare short overview of change that can be used in release notes?

  • Please provide short GIF that showcase feature.

  • If GIF make no sense, can you provide image that highlights feature that can be used in release notes (cropped & annotated)?

Automation for Jira 18 July 2024, 13:38

Hello @Piotr Haraburda

This is the best moment to add more information that can be helpful for tester.

  • What areas are affected?

  • What are potential edge cases?

  • Was it checked for XSS problems?

  • Does change affect security, is new data exposed?

Please attach - Before / After screenshot if possible.

Automation for Jira 18 July 2024, 13:38

Hello @Piotr Haraburda,
Task is ready for review.

@Piotr Haraburda please make sure reviewer
have easy access to contend to be reviewed.

If this is code change. Please make sure PR is created.
If this is new documentation, blogpost, etc. Please provide link to page.

Piotr Haraburda 1 March 2024, 13:01

@Krzysztof Bogdan Yes, there are zero results seen here for now, because I didnt push any of them. I forgot about subbranches and tried to do everything on one, main ESFJ-325 branch. Now, I will divide my work into smaller tasks. I also reported my progress daily, although not by comments but in work log descriptions so thats my fault. Since now, I extracted wysiwyg to separate project, converted everything to typescript, checked for typescript errors and eslint errors, used esbuild to get an artifact, tested it on local site. Right now I am working again with Eslint but with "noImplicitAny": true and "strict": true settings as you told me to. I have some problematic errors with code structure and constructors, I have to manually convert functions to classes and change their constructing methods so it takes me some time. I could push my results to https://warsaw-dynamics.atlassian.net/browse/ESFJ-861 as my artifact is fully working, although eslint still gives some errors for now. Sorry for that but it is not an easy task I think

Krzysztof Bogdan 1 March 2024, 12:36

@Piotr Haraburda It takes too long.
1week of work and zero results.

Please report your progres daily as comment.
Please describe to me how you see this spliced to milestones, roadmap?
How to split it do smaller deliverables?

Krzysztof Bogdan 9 February 2024, 10:46

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

37

38

39

40

41

42

43

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="wysiwyg.js"></script>
</head>
<body>
<div id="commnet-editor"></div>
<script>
 
  
    const editor = new Wysiwyg({
        theme: 'jira',
        toolbar: [
            {
                name: 'Text styles',
                items: ['h1', 'h2', 'h3', 'h4', 'h5', 'h6', 'p']
            },
            {
                name: 'Bold',
                items: ['bold']
            },
            {
                name: 'Italic',
                items: ['italic']
            },
            {
                name: 'More formatting',
                items: ['underline', 'strikethrough', 'superscript', 'subscript']
            },
            
            ...
        ]
    })
    document.getElementById('commnet-editor')
        .appendChild(editor);
</script>
 
  
</body>
</html>