New Link and Separator Block
RPDeshaies opened this issue · comments
🚩 Is your feature request related to a problem? Please describe
Users have often requested the need to include links inside their character sheets.
Either to their own wikis or game SRDs available on the web.
Right now, it's not something that is possible though some templates have a "template link" attached to them but its something controlled by the code and users can't modify them.
Also, users are always looking for better ways to organize their sheets. Right now they can use pages and sections, but they've talked about having a "Separator" or "Header" block that would render a divider along side some text to help organize sections better.
✅ Describe the solution you'd like
Having the ability to have a Link and Separator Block could be beneficial to the community.
Link Block
The Link block could have a block.value of type string than can be edited in advanced mode but when the advanced mode is toggle off, the block could render an AppLink.tsx component that opens the link in a new tab using target="_blank".
I'm not sure if this block would need to have a block.label but I think all blocks have one so we can keep it and just not render it for now.
Also, we should make sure the link is using the proper attributes for security purposes: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a#security_and_privacy
I think the AppLink component already does this but just to make sure
Separator Block
The Separator block could have a block.value of type undefined because there is no value though it would have a label.
The component would then render the block.label and use a material ui <Divider/> below the label.
I'm not 100% sure about what the label should look like, but I think it should be different from the Section labels and the other type of labels because it should act as some sort of separator inside a section
I'm opened to suggestions
✏️ Describe alternatives you've considered
- Players could include links to their wikis inside textbox but it won't render them as links
- Players could use sections and pages to help with organization
📄 Tech Notes
This work should be based off the branch v5.
Right now, blocks are created using a pure function called makeBlock inside the CharacterFactory. I think it could be nice to extract this code inside a BlockFactory and even perhaps move all the factories (Character, Scene, Block) inside a global factories folder at the top of the src hierarchu.
Since all blocks follow a very similar data model, their types are defined using enum dynamic types inside the character types file.
I think we could also extract this inside it's own file for things related to blocks.
Then the blocks are rendered using the BlockByType component which takes care of deciding which type of block to render and update the block data lazily when the sub component updates.
Right now, the BlockByType component isnt available inside storybook, I think if we have the time it could be a very nice addition to quickly see all of the block types and their different variations