Functionality for spoilers (click to show) when adding notes.

[mariusberget92]

Description

Just as the title says. Functionality to add spoilers.

Very much like this

Some hidden stuff not on display until clicked.

Or some other spoiler functionality. Would be nice to have for notes you would like hide some of the content when having the dashboard open, like internal IP addresses and such or something else.

Priority

Low (Nice-to-have)

[github-actions]

Hi 👋. Thank you for submitting your first issue to Homarr. Please ensure that you've provided all nessesary information. You can use the three dots > Edit button to update your post with additional images and information. Depending on the current volume of requests, the team should get in conact with you shortly.

[ajnart]

That's a good suggestion, I believe you might be able to find a way to add this feature using tiptap https://mantine.dev/x/tiptap/

Please tell me if you see docs indicating how to add this feature and I'll see you add it in homarr's note editor 😉

[mariusberget92]

Looks like it's pretty straight forward.
https://mantine.dev/core/spoiler/

import { Spoiler } from '@mantine/core';

function Demo() {
  return (
    <Spoiler maxHeight={120} showLabel="Show more" hideLabel="Hide">
      {/* Content here */}
    </Spoiler>
  );
}

You could also add transition duration by adding the attr: transitionDuration={0} to the <Spoiler ...>

Edit: wait.. I might be stupid. That is for mantine-core, not the TipTap.

[manuel-rw]

This is Mantine core (a standalone component). We'd need to implement custom logic in tiptap to use it. But tiptap should offer a built in solution. Currently cannot search for it because I'm busy.

[SeDemal]

https://tiptap.dev/docs/editor/api/nodes/details
Tiptap pro
I actually wanted to add it too.
There is an unofficial extension we could use, but it not being from tiptap, I don't know how the support for the future is gonna be:
https://github.com/n8b8dy/tiptap-spoiler
(I might just make my own integration out of spite)