From e2ed21e113592d972a0f22f2d434e05369e265f0 Mon Sep 17 00:00:00 2001 From: David Erwin Date: Mon, 8 May 2017 12:00:22 -0400 Subject: [PATCH] Adding building block documentation --- docs/frontend/PLUGINS.md | 74 +++++++++++++++++++++++++++++++++++++--- 1 file changed, 70 insertions(+), 4 deletions(-) diff --git a/docs/frontend/PLUGINS.md b/docs/frontend/PLUGINS.md index 5a2530523..fa582877c 100644 --- a/docs/frontend/PLUGINS.md +++ b/docs/frontend/PLUGINS.md @@ -34,7 +34,8 @@ export default { }; ``` -### Components +### Creating a Component + We can add our components (or any other javascript code) within the `client` folder. ``` @@ -46,7 +47,6 @@ my-plugin/ └── index.js ``` -#### Creating a Component Our component could look like this: ```js @@ -61,7 +61,7 @@ class MyButton extends Component { export default MyButton; ``` -We are just creating a component that creates a `button`. Now that we created our component we need to specify where it should get injected within Talk! +Here we create a component that renders a `button`. Now that we created our component we need to specify where it should get injected within Talk! To tell Talk where that Component should get injected we need to specify which *Slots* to insert it into. @@ -91,7 +91,73 @@ Here I’m specifying that the MyComponent Component will take place within the Slots properties take an`Array` so we can add as many components as we want. -### Styling our Plugin +## Building Blocks (TBD) + +`Note: the concepts in this section are still to be implemented. Code samples are for discussion and may change.` + +In order to allow you to build more complex plugins, we have wrapped some of our functionality in higher order componenets that expose a simple api. + +### Reactions + +Reactions provide users the ability to 'like', 'respect', etc... comments. + +``` + + + +``` + +Note: some server side work will need to accompany this client side component. See the like and respect plugins as examples. + +### Comment Stream + +Comment streams may be created with filtering and ordering in place: + +* filter by user +* filter by tag +* sort by date ascending / descrnding + +``` + +``` + +### Comment Commit hooks + +// docs for the pre/post comment submit commit hooks + +### Mod Queues + +Moderation queues can be added via configuration objects passed in through plugins. + +Basic mod queues will resemble the current moderation queues but can be generated from different lists of comments. + +* filter by user tag +* filter by comment tag +* filter by comment status +* Custom queries (paired with back end plugins that provide queries to get the data) + +#### Advanced mod queues + +Advanced mod queues can be created giving plugin authors the power to create the cards that appear in the queue, create actions and custom buttons, etc... + +### Custom Configuration + +Plugins may rely on configuration options that admins/moderators can set in the Configuration section. + +Basic settings can be added via json configuration in a plugin. + +* Setting headline +* Setting description +* Setting input type +* Default value +* Variable name + +#### Advanced Custom Configuration (low prioritiy) + +Users can inject configuration interfaces that they create into the configuration allowing for more advanced configuration. + + +## Styling Plugins Talk uses CSS Modules. This basically means that you can also add your CSS Module to your plugin without colliding with the rest of Talk! ##### My Component