Initial code #1
Initial code #1
Conversation
…wagtail-cookiecutter-package
| @@ -1 +1,66 @@ | |||
| # Contributing to shortcode | |||
| # Contributing | |||
There was a problem hiding this comment.
Note:
I've moved the contributing docs here to keep the readme clean, as well as added a section # Tips on working with the package locally to share my own notes on using cookiecutter-wagtail-package.
| @@ -12,6 +12,13 @@ declare module '*.svg' { | |||
| declare global { | |||
| // Wagtail globals | |||
|
|
|||
| interface Window { | |||
There was a problem hiding this comment.
Note:
Some of these types aren't exported e.g. import type { TooltipEntity } from 'draftail';, so as not to waste time on resolving this i've defined them as any.
For example, I can't define:
const { TooltipEntity } = window.draftail;
as
import type { TooltipEntity as TooltipEntityType } from 'draftail';`
const { TooltipEntity as TooltipEntityType} = window.draftail
| @@ -0,0 +1,5 @@ | |||
| /* | |||
There was a problem hiding this comment.
Note:
Not needed but seemed like a waste to remove code that might be needed in the future?
| helpText: string; | ||
| }; | ||
|
|
||
| const getShortcodeConfig = (): WagtailShortcodeConfig => { |
There was a problem hiding this comment.
Note:
Defining this as a config with it's own type seems like a more future proof option, rather then specifyling this as help-text only
| const { helpText } = getShortcodeConfig(); | ||
|
|
||
| // eslint-disable-next-line no-alert | ||
| const shortcodeValue = window.prompt(helpText, defaultValue); |
There was a problem hiding this comment.
Note:
As mentioned on slack, there are obvious limitations to basic text formating, if needed I'll open up a seperate PR with draft code for adding a model.
| return DOM.create_element( | ||
| "a", | ||
| { | ||
| "shortcode": props.get("shortcode"), |
There was a problem hiding this comment.
Looks like you're storing it in the shortcode attribute rather than the href, which they originally suggested on the call. IMO this is fine, but worth double checking this afternoon with them that the db format for a shortcode will be x, any conversion to FE will be done by the LinkHandler + additional python code they write.
There was a problem hiding this comment.
Thats a good point.
I figured it could cause less confusion between creating the entity on the front-end (createEntity() in main.tsx), then passing that value as a prop here (shortcode_entity_decorator) and then getting the value from ShortcodeEntityElementHandler again to the content state.
However I've gone with href now as it's probably better to maintain a database state closer to what they're expecting. To try and tackle any potential confusion I've added comments and labeled variables like so:
"href": props.get("href"), # the shortcode value
...
href: shortcodeValue,
...
const shortcodeValue = data.href || null;
There was a problem hiding this comment.
Scratch the above, using href conflicts with wagtail's default external link handler/entity, use of the shortcode attribute seems like the safer option.
This reverts commit f85614d.
|
Hey @jacobtoppm, |
The PR adds the inital setup and functionaility for this package to work.
Custom draftail entity, client side code, wagtail hooks, and documentation around use and references to adding a link handler.
For testing I'd recommend cloning the repo locally, and then installing it inside the wagtail bakery demo for now, there is a test app within the repo, however I haven't commited any page models or data for it yet.
pip install -e ../wagtail-shortcodeScreenshots
ref 1
ref 2