plugins/slate: Add list fix lost in merge (#588)

Signed-off-by: aeneasr <aeneas.rekkas@serlo.org>
react-page · Sep 4, 2018 · 1023ffb · 1023ffb
1 parent 595ce09
commit 1023ffb
Show file tree

Hide file tree

Showing 5 changed files with 118 additions and 103 deletions.
diff --git a/packages/plugins/content/slate/src/helpers.js b/packages/plugins/content/slate/src/helpers.js
@@ -62,22 +62,16 @@ export const ToolbarButton = ({
   onClick,
   disabled = false
 }: {
-  icon: string,
-  isActive: string,
-  onClick(): void,
-  disabled?: boolean
-}) => (
-  <IconButton
-    onClick={onClick}
-    style={
-      isActive
-        ? { color: 'rgb(0, 188, 212)' }
-        : disabled
-          ? { color: 'gray' }
-          : { color: 'white' }
-    }
-    disabled={disabled}
-  >
-    {icon}
-  </IconButton>
-)
+    icon: string,
+    isActive: string,
+    onClick(): void,
+    disabled?: boolean
+  }) => (
+    <IconButton
+      onClick={onClick}
+      style={isActive ? { color: 'rgb(0, 188, 212)' } : disabled ? { color: 'gray' } : { color: 'white' }}
+      disabled={disabled}
+    >
+      {icon}
+    </IconButton>
+  )
diff --git a/packages/plugins/content/slate/src/index.js b/packages/plugins/content/slate/src/index.js
@@ -25,7 +25,7 @@
 /* eslint no-duplicate-imports: ["off"] */
 /* eslint prefer-reflect: ["off"] */
 import Subject from '@material-ui/icons/Subject'
-import { pathOr } from 'ramda'
+import { compose, flatten, map, prop, pathOr } from 'ramda'
 import Html from 'slate-html-serializer'
 import React from 'react'
 import { ActionTypes } from 'redux-undo'
@@ -37,6 +37,8 @@ import * as hooks from './hooks'
 import parse5 from 'parse5'
 import v002 from './migrations/v002'
 
+const createPlugins = compose(flatten, map(prop('plugins')))
+
 export const createInitialState = hooks.createInitialState
 
 export const html = new Html({
@@ -48,7 +50,7 @@ export const defaultPlugins = hooks.defaultPlugins
 
 export default (plugins: Plugin[] = hooks.defaultPlugins) => {
   const props = {}
-  props.plugins = plugins
+  props.plugins = (plugins ? plugins : []).concat(createPlugins(plugins))
   props.onKeyDown = (
     e: Event,
     data: { key: string, isMod: boolean, isShift: boolean },
@@ -60,7 +62,10 @@ export default (plugins: Plugin[] = hooks.defaultPlugins) => {
     }
 
     if (data.isShift && data.key === 'enter') {
-      return state.change().insertText('\n').value
+      return state
+        .change()
+        .insertText('\n')
+        .value
     }
 
     for (let i = 0; i < plugins.length; i++) {
@@ -134,7 +139,9 @@ export default (plugins: Plugin[] = hooks.defaultPlugins) => {
       }
 
       setTimeout(() => {
-        props.state.editorState.change().focus()
+        props.state.editorState
+          .change()
+          .focus()
       }, 0)
     },
 
@@ -144,7 +151,9 @@ export default (plugins: Plugin[] = hooks.defaultPlugins) => {
       }
 
       props.onChange({
-        editorState: props.state.editorState.change().blur().value
+        editorState: props.state.editorState
+          .change()
+          .blur().value
       })
     },
 

diff --git a/packages/plugins/content/slate/src/plugins/code/index.js b/packages/plugins/content/slate/src/plugins/code/index.js
@@ -46,7 +46,10 @@ export default class CodePlugin extends Plugin {
         e.preventDefault()
 
         onChange({
-          value: editorState.change().toggleMark(type).value
+          value: editorState
+            .change()
+            .toggleMark(type)
+            .value
         })
       }
 
@@ -69,7 +72,8 @@ export default class CodePlugin extends Plugin {
         onChange({
           value: editorState
             .change()
-            .setBlocks(isActive ? this.DEFAULT_NODE : type).value
+            .setBlocks(isActive ? this.DEFAULT_NODE : type)
+            .value
         })
       }
 
@@ -115,9 +119,7 @@ export default class CodePlugin extends Plugin {
     if (object.object === 'mark') {
       switch (object.type) {
         case CODE:
-          return (
-            <code className="ory-plugins-content-slate-code">{children}</code>
-          )
+          return <code className="ory-plugins-content-slate-code">{children}</code>
       }
     } else if (object.object === 'block') {
       switch (object.type) {
@@ -136,11 +138,7 @@ export default class CodePlugin extends Plugin {
 
     switch (mark.type) {
       case CODE:
-        return (
-          <code {...attributes} className="ory-plugins-content-slate-code">
-            {children}
-          </code>
-        )
+        return <code {...attributes} className="ory-plugins-content-slate-code">{children}</code>
     }
   }
 
@@ -149,7 +147,7 @@ export default class CodePlugin extends Plugin {
 
     switch (node.type) {
       case CODE:
-        return <Code {...props} />
+        return <Code {...props}/>
     }
   }
 }
diff --git a/packages/plugins/content/slate/src/plugins/link/index.js b/packages/plugins/content/slate/src/plugins/link/index.js
@@ -70,7 +70,10 @@ class LinkButton extends Component {
     )
 
     if (hasLinks) {
-      const newState = editorState.change().unwrapInline(A).value
+      const newState = editorState
+        .change()
+        .unwrapInline(A)
+        .value
       onChange({ value: newState })
     } else if (editorState.selection.isExpanded) {
       this.setState({
@@ -94,7 +97,10 @@ class LinkButton extends Component {
   handleClose = () => {
     this.setState({ open: false })
 
-    const newState = this.props.editorState.change().focus().value
+    const newState = this.props.editorState
+      .change()
+      .focus()
+      .value
     window.setTimeout(() => this.props.onChange({ value: newState }), 1)
   }
 
@@ -114,7 +120,8 @@ class LinkButton extends Component {
           type: A,
           data: { href: this.state.href }
         })
-        .collapseToEnd().value
+        .collapseToEnd()
+        .value
 
       window.setTimeout(() => this.props.onChange({ value: newState }), 1)
       window.setTimeout(() => this.props.focus(), 100)
@@ -135,7 +142,8 @@ class LinkButton extends Component {
         data: { href: this.state.href }
       })
       .collapseToEnd()
-      .focus().value
+      .focus()
+      .value
 
     this.props.onChange({ value: newState })
     window.setTimeout(() => this.props.focus(), 100)
@@ -150,26 +158,24 @@ class LinkButton extends Component {
   }
 
   render() {
-    const actions = (
-      <React.Fragment>
-        <Button
-          variant="flat"
-          label="Cancel"
-          color="primary"
-          onClick={this.handleClose}
-        >
-          Cancel
-        </Button>
-        <Button
-          variant="flat"
-          label="Ok"
-          color="primary"
-          onClick={this.handleSubmit}
-        >
-          Ok
-        </Button>
-      </React.Fragment>
-    )
+    const actions = <React.Fragment>
+      <Button
+        variant='flat'
+        label="Cancel"
+        color="primary"
+        onClick={this.handleClose}
+      >
+        Cancel
+      </Button>
+      <Button
+        variant='flat'
+        label="Ok"
+        color="primary"
+        onClick={this.handleSubmit}
+      >
+        Ok
+      </Button>
+    </React.Fragment>
     const { editorState } = this.props
 
     const hasLinks = editorState.inlines.some(
@@ -265,7 +271,9 @@ export default class LinkPlugin extends Plugin {
   renderNode = props => {
     switch (props.node.type) {
       case A: {
-        return <Link {...props} />
+        return (
+          <Link {...props} />
+        )
       }
     }
   }