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.

Sign up for GitHub

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

Jump to bottom

fix(rich-text-editor): DLT-2017 emojis positioning #486

Merged
merged 5 commits into from
Sep 5, 2024
Merged

fix(rich-text-editor): DLT-2017 emojis positioning #486

merged 5 commits into from
Sep 5, 2024

Conversation

juliodialpad
Copy link
Collaborator

Fix DtRichTextEditor emojis positioning

Obligatory GIF (super important!)

Obligatory GIF

🛠️ Type Of Change

These types will increment the version number on release:

  • Fix

📖 Jira Ticket

https://dialpad.atlassian.net/browse/DLT-2017

📖 Description

  • Changed nodeInputRule to a custom Input rule to be able to replace the emojis the correct way.
  • Added custom backspace behavior to delete the emoji instead of "undo" the inserting.
  • Removed the space that was added after the emoji when added through suggestion plugin.
  • General cleanup and import reordering.

💡 Context

  • Issues reported while inserting emojis.

📝 Checklist

For all PRs:

  • I have ensured no private Dialpad links or info are in the code or pull request description (Dialtone is a public repo!).
  • I have reviewed my changes.
  • I have considered the performance impact of my change.

For all Vue changes:

  • I have made my changes in Vue 2 and Vue 3. Note: you may sync your changes from Vue 2 to Vue 3 (or vice versa) using the ./scripts/dialtone-vue-sync.sh script. Read docs here: Dialtone Vue Sync Script
  • I have validated components keyboard navigation.

📷 Screenshots / GIFs

  • Before
Screen.Recording.2024-09-04.at.12.49.01.p.m.mov
  • After
Screen.Recording.2024-09-04.at.12.50.03.p.m.mov

@juliodialpad juliodialpad self-assigned this Sep 4, 2024
@github-actions GitHub Actions
Copy link

github-actions bot commented Sep 4, 2024

Please add either the visual-test-ready or no-visual-test label to this PR depending on whether you want to run visual tests or not.
It is recommended to run visual tests if your PR changes any UI. ‼️

@juliodialpad juliodialpad changed the title fix(rich-text-editor): emojis positioning fix(rich-text-editor): DLT-2017 emojis positioning Sep 4, 2024
@juliodialpad juliodialpad added the visual-test-ready Add this tag when the PR is ready for visual test, to trigger GHA visual tests label Sep 4, 2024
@socket-security Socket Security
Copy link

socket-security bot commented Sep 5, 2024 •
edited
Loading

New and removed dependencies detected. Learn more about Socket for GitHub ↗︎

Package New capabilities Transitives Size Publisher
npm/@tiptap/core@2.6.6 None 0 2.31 MB nperez0111
npm/@tiptap/extension-blockquote@2.6.6 None 0 159 kB nperez0111
npm/@tiptap/extension-bold@2.6.6 None 0 169 kB nperez0111
npm/@tiptap/extension-bullet-list@2.6.6 None 0 192 kB nperez0111
npm/@tiptap/extension-code-block@2.6.6 None 0 224 kB nperez0111
npm/@tiptap/extension-document@2.6.6 None 0 145 kB nperez0111
npm/@tiptap/extension-hard-break@2.6.6 None 0 166 kB nperez0111
npm/@tiptap/extension-history@2.6.6 None 0 160 kB nperez0111
npm/@tiptap/extension-italic@2.6.6 None 0 169 kB nperez0111
npm/@tiptap/extension-link@2.6.6 None 0 288 kB nperez0111
npm/@tiptap/extension-list-item@2.6.6 None 0 155 kB nperez0111
npm/@tiptap/extension-mention@2.6.6 None 0 215 kB nperez0111
npm/@tiptap/extension-ordered-list@2.6.6 None 0 202 kB nperez0111
npm/@tiptap/extension-paragraph@2.6.6 None 0 154 kB nperez0111
npm/@tiptap/extension-placeholder@2.6.6 None 0 177 kB nperez0111
npm/@tiptap/extension-strike@2.6.6 None 0 165 kB nperez0111
npm/@tiptap/extension-text-align@2.6.6 None 0 169 kB nperez0111
npm/@tiptap/extension-text@2.6.6 None 0 145 kB nperez0111
npm/@tiptap/extension-underline@2.6.6 None 0 159 kB nperez0111
npm/@tiptap/pm@2.6.6 None 0 24.5 kB nperez0111
npm/@tiptap/suggestion@2.6.6 None 0 264 kB nperez0111
npm/@tiptap/vue-2@2.6.6 None +4 1.15 MB nperez0111
npm/@tiptap/vue-3@2.6.6 None +4 1.2 MB nperez0111

🚮 Removed packages: npm/@tiptap/core@2.3.0), npm/@tiptap/extension-blockquote@2.3.0), npm/@tiptap/extension-bold@2.3.0), npm/@tiptap/extension-bullet-list@2.3.0), npm/@tiptap/extension-code-block@2.3.0), npm/@tiptap/extension-document@2.3.0), npm/@tiptap/extension-hard-break@2.3.0), npm/@tiptap/extension-history@2.3.0), npm/@tiptap/extension-italic@2.3.0), npm/@tiptap/extension-link@2.3.0), npm/@tiptap/extension-list-item@2.3.0), npm/@tiptap/extension-mention@2.3.0), npm/@tiptap/extension-ordered-list@2.3.0), npm/@tiptap/extension-paragraph@2.3.0), npm/@tiptap/extension-placeholder@2.3.0), npm/@tiptap/extension-strike@2.3.0), npm/@tiptap/extension-text-align@2.3.0), npm/@tiptap/extension-text@2.3.0), npm/@tiptap/extension-underline@2.3.0), npm/@tiptap/pm@2.3.0), npm/@tiptap/suggestion@2.3.0), npm/@tiptap/vue-2@2.3.0), npm/@tiptap/vue-3@2.3.0)

View full report↗︎

@github-actions GitHub Actions
Copy link

github-actions bot commented Sep 5, 2024

✔️ Deploy previews ready!
😎 Dialtone preview: https://dialtone.dialpad.com/deploy-previews/pr-486/
😎 Dialtone-vue 2 preview: https://dialtone.dialpad.com/vue/deploy-previews/pr-486/
😎 Dialtone-vue 3 the preview: https://dialtone.dialpad.com/vue3/deploy-previews/pr-486/

@juliodialpad juliodialpad merged commit b857386 into staging Sep 5, 2024
13 checks passed
@juliodialpad juliodialpad deleted the fix/rich-text-editor/emojis-positioning branch September 5, 2024 20:11
juliodialpad pushed a commit that referenced this pull request Sep 5, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone/v9.73.0-beta.1
de0b6a4 
# [9.73.0-beta.1](dialtone/v9.72.1...dialtone/v9.73.0-beta.1) (2024-09-05)

### Bug Fixes

* NO-JIRA merge staging into beta ([#478](#478)) ([09f1165](09f1165))
* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))

### Code Refactoring

* **Badge, Emoji Tabset, Empty State:** remove DtIcon ([#481](#481)) ([0fa1280](0fa1280))

### Features

* **Avatar:** DLT-1916 remove dt-icon ([#466](#466)) ([6ef90db](6ef90db))
* **Keyboard Shortcut To Unread Pill:** DLT-1916 remove dt-icon ([#482](#482)) ([277ae13](277ae13))
juliodialpad pushed a commit that referenced this pull request Sep 5, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone-vue2/v2.159.0-beta.1
253d46f 
# [2.159.0-beta.1](dialtone-vue2/v2.158.0...dialtone-vue2/v2.159.0-beta.1) (2024-09-05)

### Bug Fixes

* NO-JIRA merge staging into beta ([#478](#478)) ([09f1165](09f1165))
* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))

### Code Refactoring

* **Badge, Emoji Tabset, Empty State:** remove DtIcon ([#481](#481)) ([0fa1280](0fa1280))

### Features

* **Keyboard Shortcut To Unread Pill:** DLT-1916 remove dt-icon ([#482](#482)) ([277ae13](277ae13))
juliodialpad pushed a commit that referenced this pull request Sep 5, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone-vue3/v3.152.0-beta.1
f4d7298 
# [3.152.0-beta.1](dialtone-vue3/v3.151.0...dialtone-vue3/v3.152.0-beta.1) (2024-09-05)

### Bug Fixes

* NO-JIRA merge staging into beta ([#478](#478)) ([09f1165](09f1165))
* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))

### Code Refactoring

* **Badge, Emoji Tabset, Empty State:** remove DtIcon ([#481](#481)) ([0fa1280](0fa1280))

### Features

* **Avatar:** DLT-1916 remove dt-icon ([#466](#466)) ([6ef90db](6ef90db))
* **Keyboard Shortcut To Unread Pill:** DLT-1916 remove dt-icon ([#482](#482)) ([277ae13](277ae13))
juliodialpad pushed a commit that referenced this pull request Sep 9, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone/v9.72.2
7e017a7 
## [9.72.2](dialtone/v9.72.1...dialtone/v9.72.2) (2024-09-09)

### Bug Fixes

* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))
juliodialpad pushed a commit that referenced this pull request Sep 9, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone-vue2/v2.158.1
47b82cf 
## [2.158.1](dialtone-vue2/v2.158.0...dialtone-vue2/v2.158.1) (2024-09-09)

### Bug Fixes

* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))
juliodialpad pushed a commit that referenced this pull request Sep 9, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone-vue3/v3.151.1
38619aa 
## [3.151.1](dialtone-vue3/v3.151.0...dialtone-vue3/v3.151.1) (2024-09-09)

### Bug Fixes

* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))
juliodialpad pushed a commit that referenced this pull request Sep 19, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone-vue2/v2.158.1-alpha.1
e540b52 
## [2.158.1-alpha.1](dialtone-vue2/v2.158.0...dialtone-vue2/v2.158.1-alpha.1) (2024-09-19)

### Bug Fixes

* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))
* **Tooltip:** DLT-2039 flush promises when external anchor ([#499](#499)) ([5c4bdb7](5c4bdb7))
* **Tooltip:** NO-JIRA null protection on unmount ([307b619](307b619))
juliodialpad pushed a commit that referenced this pull request Sep 19, 2024
@semantic-release-bot
chore(release): NO-JIRA dialtone-vue3/v3.151.1-alpha.1
54bd689 
## [3.151.1-alpha.1](dialtone-vue3/v3.151.0...dialtone-vue3/v3.151.1-alpha.1) (2024-09-19)

### Bug Fixes

* **Rich Text Editor:** DLT-2017 emojis positioning ([#486](#486)) ([b857386](b857386))
* **Tooltip:** DLT-2039 flush promises when external anchor ([#499](#499)) ([5c4bdb7](5c4bdb7))
* **Tooltip:** NO-JIRA null protection on unmount ([307b619](307b619))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@braddialpad braddialpad braddialpad approved these changes

@iropolo iropolo Awaiting requested review from iropolo iropolo is a code owner

@francisrupert francisrupert Awaiting requested review from francisrupert francisrupert is a code owner

@ninamarina ninamarina Awaiting requested review from ninamarina ninamarina is a code owner

Assignees

@juliodialpad juliodialpad

Labels
visual-test-ready Add this tag when the PR is ready for visual test, to trigger GHA visual tests
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@juliodialpad @braddialpad