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

Add direct image upload to the EasyMDE field #3597

Closed

Conversation

erozas
Copy link

@erozas erozas commented Jan 21, 2025

Description

This PR adds a configurable image upload feature for the EasyMDE field.

It works by using the own editor's upload feature that receives a URL for an uploaded file and inserts it into the document.

Checklist:

  • [x ] I have performed a self-review of my own code
  • I have commented my code, particularly in hard-to-understand areas
  • [x ] I have made corresponding changes to the documentation
  • I have added tests that prove my fix is effective or that my feature works

Screenshots & recording

easy-mde-flow.mp4

Manual review steps

The only change needed for this feature to work is to add the image_upload: true flag to a markdown field.

In my case, I added it to the projects in the Avo demo app:

field :description, as: :markdown, height: "350px", image_upload: true

}/${encodeURIComponent(blob.filename)}`;
}

get toolbarItems() {
Copy link

Choose a reason for hiding this comment

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

Function toolbarItems has 32 lines of code (exceeds 25 allowed). Consider refactoring.

Copy link

codeclimate bot commented Jan 21, 2025

Code Climate has analyzed commit 94ad7fe and detected 0 issues on this pull request.

View more on Code Climate.


export default class extends Controller {
static targets = ['element']
static targets = ["element"];
Copy link
Collaborator

Choose a reason for hiding this comment

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

This seems unrelated

}
}

_configureImageUploads(options) {
Copy link
Collaborator

Choose a reason for hiding this comment

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

Let's use the JS private notiation please.

Suggested change
_configureImageUploads(options) {
#configureImageUploads(options) {

Then can be used liek so this.#configureImageUploads()

Copy link
Collaborator

@adrianthedev adrianthedev left a comment

Choose a reason for hiding this comment

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

I haven't looked too much. please clean the PR from liting issues and console logs and re-request review please.

Copy link
Collaborator

@adrianthedev adrianthedev left a comment

Choose a reason for hiding this comment

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

Hey @erozas.
we renamed the markdown field to easy_mde in #3599.
Can you please rebase your PR? Or make another one on the right files?

Sorry, and Thank you!

@erozas erozas closed this Jan 27, 2025
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.

2 participants