FriendsOfFlarum Rich Text (WYSIWYG)

Shortik

In a lot of cases the image/URL pop-up shows "under" the monitor:

huseyinfiliz

Shortik Thanks for bringing this to my attention! This bug has actually been known for years and exists in the original extension as well.

I'll investigate the issue as soon as I can to try and get it sorted out. Feel free to open an issue on GitHub to help us track it and ensure it doesn't slip our minds.

Shortik

I post it to GitHub.
For now I fixed it by this custom CSS:

.TextEditor-controls .FormDropdown {
  bottom: 100%;
  top: unset;
}

Wlork

I never installed this extension because it was so heavy/slow and that was never fixed.

So, very good news ! Thank you for your work @huseyinfiliz 🙂

huseyinfiliz

Wlork Yes, I was also hesitant about using it on my own forum. Thanks to Flarum 2.x's lazy load feature and the switch to the Tiptap editor, we've improved the initial load size by 97%. It really is awesome!

(350kb -> 12kb)

Wlork

@huseyinfiliz

I was able to test this extension.

Yesterday, I encountered a bug. Activating the extension deleted my CSS... BUT ! I don't think it was caused by this extension. It's just that the CSS editor isn't working properly in beta 2.0. As you know, the issue has already been reported to IanM 🙂

Otherwise, I find that it works very well.

However, I do have a suggestion.

Does the extension take FoF Formatting into account?

When I post an image, video or RS (instagram, X, etc) link, it doesn't display directly, as you can see in the screenshot. For the preview, we like everything to be displayed, especially when we create a discussion.

Subarist

FoF Bot First beta release for Flarum 2.x.

Highlights

Editor migrated to Tiptap 3: extension-based architecture, cleaner and more maintainable than raw ProseMirror
Lazy loading: editor code now loads only when the composer is opened. Main bundle impact drops from 350 KB to 12 KB (97% reduction)
Flarum 2.x compatibility: fully updated for the new extension API, v3, and patternflarum-webpack-configTextEditor._loaders

It’s really fast — it feels like instant loading.

Wlork

@huseyinfiliz

Once this extension is activated, when I go to my settings (profil), I get an error message :

TypeError: can't access property "toArray", this.composerItems() is undefined

FoF Bot

🚀 New Release: 2.0.0-beta.2

Targets Flarum 2.x

Released by: @huseyinfiliz
Release URL: FriendsOfFlarum/rich-textreleases/tag/2.0.0-beta.2

fix: resolve SettingsPage crash due to non-existent composerItems method Wlork by @huseyinfiliz in FriendsOfFlarum/rich-text2

Full Changelog: FriendsOfFlarum/rich-text2.0.0-beta.1 → 2.0.0-beta.2

ClaudiusH

Any chance to see extension upgrade being backported to Flarum 1.x, too? Would love to see a snappier RTE on 1.8 as well

Wlork

FoF Bot

Thank you, it works 🙂

Just to know, you will take FoF Formatting into account to directly display media URLs in preview mode?

huseyinfiliz

ClaudiusH Actually, the 97% reduction in the initial load size and the significantly faster loading times in the 2.x version are primarily thanks to Flarum 2.x's lazy loading capabilities. While Tiptap does support tree shaking, it isn't as impactful as lazy loading in this context.

Switching to Tiptap on Flarum 1.x would likely increase the initial payload size rather than decrease it, as Flarum 1.x lacks this native lazy loading architecture. Because of this, backporting the update wouldn't be practical or provide the performance benefits you are looking for.

huseyinfiliz

Wlork I haven't had a chance to look into this yet, but I believe this feature wasn't available in 1.x either. My primary goal during the 2.x transition was to ensure the exact same experience for active users. However, I will do some research to see how this can be implemented.

Walid

so I've just installed this extension on my local dev env, and while trying to insert a link with the insert a link button I encountered a few issues:

when I type google in the text field and https://www.google.com in the url field, and clicked on insert, it adds a link with the text google but the link isn't no longer for google.com but the page/discussion I'm on (I tried this on a reply to a discussion)
When I try to only use the URL field, the form indicates to me that the Text field is mandatory (I don't think it should be, if left empty, the full url should be used as text) but when I click (focus) on the field to add a text, the URL field resets (become empty)

I'm going to also open an issue on github and edit this with the link as soon as I'm done : here's the issue FriendsOfFlarum/rich-text3

andrewjs18

nice.....I think xenforo is going to use this editor too.

Shortik

I have an issue - it seems like client side issue (JS?).
FoF\Rich text: 1.0.0
Flarum: 1.8.13
After I fill text and URL I hit <Enter> and the page crashes. There is nothing in Network and Console. CPU is about 5 - 10 % but Memory is up to 100 %.

huseyinfiliz

Shortik To help me identify the issue more quickly, have you used askvortsov/flarum-rich-text before? If so, was this error present then as well, or is it a new bug?

luceos

FriendsOfFlarum 2.x is built on Tiptap 3

A dream come true. How did I miss this announcement. Well done!

huseyinfiliz

luceos Thanks so much! It's been a lot of work refactoring it for Flarum 2.x, but definitely worth it ⚡️

Tutrix

@huseyinfiliz
I just tested it. Inserting links works fine, but the display of the text and code is incorrect.
The line spacing is very large, and the three backticks in the code are not applied.
I had not previously installed askvortsov/flarum-rich-text, so I have no basis for comparison.

I typed both versions identically into the editor.