Skip to content

fix: Image resize, Link selector in Modals, Delete/ sync images and so much more #1896

Merged
sriramveeraghanta merged 10 commits intodevelopfrom
tip-tap-fixes
Aug 19, 2023
Merged

fix: Image resize, Link selector in Modals, Delete/ sync images and so much more #1896
sriramveeraghanta merged 10 commits intodevelopfrom
tip-tap-fixes

Conversation

@Palanikannan1437
Copy link
Member

@Palanikannan1437 Palanikannan1437 commented Aug 17, 2023

  1. Added image resize functionality

Currently uses react-moveable, but I'll soon add a custom tiptap plugin to remove the dependancy. User can resize the editor by first selecting it followed by dragging the nodes on the right and left and shown in this demo. It's state is saved with the "Save" state of the editor.

image-resize-tiptap.mov
  1. Fixed link selector by preventing unnecessary form triggers on modals

Previously the link form on submit used to trigger the parent form (in case of Modals) on submit, now I've handled Enter key down events and form submit events via a onClick/onKeyDown functions.

Currently only http and https protocols are allowed and validated against.

  1. Images are now uploaded and saved at 35% of the width, and then can be resized as per user's convenience

  2. Added alerts behaviour if the user tries to reload while the editor's state isn't saved and synced with Image Uploading as well

alerts.on.reload.mov
  1. Removed shadow to maintain consistency across design in light mode

  2. Added custom delete plugin that checks for various cases and deletes images ONLY if the image node is deleted!

    • Added various checks for detecting oldState and newState at every transaction instead of relying on React's state of the editor!
    • Added checks to detect every set of Transaction and only delete if the node is not in the editor after a "remove"/"displacement" action.
    • While comparing the oldState and newState, previously the check only took into consideration about the position and id, now it takes in the scenario if the "image" is still present in the entire editor and only then deletes it from the backend!

@vercel
Copy link

vercel bot commented Aug 17, 2023

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
plane ❌ Failed (Inspect) Aug 19, 2023 6:23am
4 Ignored Deployments
Name Status Preview Comments Updated (UTC)
plane-dev ⬜️ Ignored (Inspect) Visit Preview Aug 19, 2023 6:23am
plane-space-dev ⬜️ Ignored (Inspect) Visit Preview Aug 19, 2023 6:23am
plane-space-stage ⬜️ Ignored (Inspect) Visit Preview Aug 19, 2023 6:23am
plane-staging ⬜️ Ignored (Inspect) Visit Preview Aug 19, 2023 6:23am

@Palanikannan1437 Palanikannan1437 marked this pull request as ready for review August 17, 2023 16:49
@Palanikannan1437 Palanikannan1437 marked this pull request as draft August 18, 2023 04:03
@Palanikannan1437 Palanikannan1437 marked this pull request as ready for review August 18, 2023 12:44
@Palanikannan1437 Palanikannan1437 changed the title fix: Image resize and Link selector in Modals fix: Image resize, Link selector in Modals, Delete/ sync images and so much more Aug 18, 2023
workspaceSlug={workspaceSlug as string}
ref={editorRef}
value={
value && value !== "" && Object.keys(value).length > 0
Copy link
Member

Choose a reason for hiding this comment

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

Here, value and watch("description_html") hold the same value, double check is redundant. Can we remove watch("description_html")?

Copy link
Member Author

Choose a reason for hiding this comment

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

Ohh yeah sure! I've done it!

@sriramveeraghanta sriramveeraghanta merged commit d470adf into develop Aug 19, 2023
@sriramveeraghanta sriramveeraghanta deleted the tip-tap-fixes branch February 10, 2026 13:43
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants