From 30ce1a531b72dbb6d1754d9e06ae07d9b1fc3db5 Mon Sep 17 00:00:00 2001
From: Alexandru Munteanu <alexandru.munteanu@thinslices.com>
Date: Tue, 23 Jan 2018 13:49:50 +0200
Subject: [PATCH] Move SortableList into new components-faraday package
---
.../src/components/AuthorList/AuthorList.js | 3 +-
.../src/components/AuthorList/StaticList.js | 2 +
.../src/components/SortableList.js | 128 ------------------
.../component-wizard/src/components/index.js | 1 -
packages/xpub-faraday/app/routes.js | 4 +-
packages/xpub-faraday/config/components.json | 3 +-
.../xpub-faraday/webpack/babel-includes.js | 1 +
7 files changed, 7 insertions(+), 135 deletions(-)
delete mode 100644 packages/component-wizard/src/components/SortableList.js
diff --git a/packages/component-wizard/src/components/AuthorList/AuthorList.js b/packages/component-wizard/src/components/AuthorList/AuthorList.js
index a542d73b0..a3f1c3f1c 100644
--- a/packages/component-wizard/src/components/AuthorList/AuthorList.js
+++ b/packages/component-wizard/src/components/AuthorList/AuthorList.js
@@ -10,6 +10,7 @@ import {
withState,
} from 'recompose'
import { change } from 'redux-form'
+import { SortableList } from 'pubsweet-components-faraday/src/components'
import {
addAuthor,
@@ -18,8 +19,6 @@ import {
moveAuthors,
} from '../../redux/authors'
-import SortableList from '../SortableList'
-
import Author from './Author'
import StaticList from './StaticList'
import AuthorAdder from './AuthorAdder'
diff --git a/packages/component-wizard/src/components/AuthorList/StaticList.js b/packages/component-wizard/src/components/AuthorList/StaticList.js
index a0da93729..ba44a4c67 100644
--- a/packages/component-wizard/src/components/AuthorList/StaticList.js
+++ b/packages/component-wizard/src/components/AuthorList/StaticList.js
@@ -10,6 +10,7 @@ export default ({
editComponent,
setAuthorEdit,
parseAuthorType,
+ ...rest
}) => (
<div>
{authors.map(
@@ -32,6 +33,7 @@ export default ({
countryParser={countryParser}
parseAuthorType={parseAuthorType}
removeAuthor={removeAuthor}
+ {...rest}
/>
),
)}
diff --git a/packages/component-wizard/src/components/SortableList.js b/packages/component-wizard/src/components/SortableList.js
deleted file mode 100644
index b52ad3f7a..000000000
--- a/packages/component-wizard/src/components/SortableList.js
+++ /dev/null
@@ -1,128 +0,0 @@
-import React from 'react'
-import { compose } from 'recompose'
-import { findDOMNode } from 'react-dom'
-import { DragSource, DropTarget } from 'react-dnd'
-
-const itemSource = {
- beginDrag(props) {
- return { index: props.index }
- },
-}
-
-const itemTarget = {
- hover({ moveItem, index }, monitor, component) {
- const dragIndex = monitor.getItem().index
- const hoverIndex = index
-
- // Don't replace items with themselves
- if (dragIndex === hoverIndex) {
- return
- }
-
- const hoverBoundingRect = findDOMNode(component).getBoundingClientRect() // eslint-disable-line
- const hoverMiddleY = (hoverBoundingRect.bottom - hoverBoundingRect.top) / 2
- const clientOffset = monitor.getClientOffset()
- const hoverClientY = clientOffset.y - hoverBoundingRect.top
-
- if (dragIndex < hoverIndex && hoverClientY < hoverMiddleY) {
- return
- }
-
- if (dragIndex > hoverIndex && hoverClientY > hoverMiddleY) {
- return
- }
- if (typeof moveItem === 'function') {
- moveItem(dragIndex, hoverIndex)
- }
- monitor.getItem().index = hoverIndex
- },
- drop({ dropItem }) {
- if (dropItem && typeof dropItem === 'function') dropItem()
- },
-}
-
-const Item = ({
- connectDragPreview,
- connectDragSource,
- connectDropTarget,
- listItem,
- dragHandle,
- isEditing,
- ...rest
-}) =>
- dragHandle
- ? connectDragPreview(
- connectDropTarget(
- <div style={{ flex: 1 }}>
- {React.createElement(listItem, {
- ...rest,
- dragHandle: connectDragSource(
- <div style={{ display: 'flex' }}>
- {React.createElement(dragHandle)}
- </div>,
- ),
- })}
- </div>,
- ),
- )
- : connectDropTarget(
- connectDragSource(
- <div style={{ flex: 1 }}>{React.createElement(listItem, rest)}</div>,
- ),
- )
-
-const DecoratedItem = compose(
- DropTarget('item', itemTarget, (connect, monitor) => ({
- connectDropTarget: connect.dropTarget(),
- isOver: monitor.isOver(),
- })),
- DragSource('item', itemSource, (connect, monitor) => ({
- connectDragSource: connect.dragSource(),
- connectDragPreview: connect.dragPreview(),
- isDragging: monitor.isDragging(),
- })),
-)(Item)
-
-const SortableList = ({
- items,
- moveItem,
- listItem,
- dragHandle,
- editItem,
- ...rest
-}) => (
- <div>
- {items.map((item, i) => (
- <DecoratedItem
- dragHandle={dragHandle}
- index={i}
- isEditing={rest.editedAuthor !== -1}
- key={item.name || Math.random()}
- listItem={listItem}
- moveItem={moveItem}
- {...item}
- {...rest}
- />
- ))}
- </div>
-)
-
-// helper function for sortable lists
-SortableList.moveItem = (items, dragIndex, hoverIndex) => {
- if (dragIndex <= hoverIndex) {
- return [
- ...items.slice(0, dragIndex),
- items[hoverIndex],
- items[dragIndex],
- ...items.slice(hoverIndex + 1),
- ]
- }
- return [
- ...items.slice(0, hoverIndex),
- items[dragIndex],
- items[hoverIndex],
- ...items.slice(dragIndex + 1),
- ]
-}
-
-export default SortableList
diff --git a/packages/component-wizard/src/components/index.js b/packages/component-wizard/src/components/index.js
index 03233dc6e..47b3aab9b 100644
--- a/packages/component-wizard/src/components/index.js
+++ b/packages/component-wizard/src/components/index.js
@@ -3,6 +3,5 @@ export { default as Progress } from './Progress'
export { default as Dropdown } from './Dropdown'
export { default as WizardPage } from './WizardPage'
export { default as WizardStep } from './WizardStep'
-export { default as SortableList } from './SortableList'
export { default as WizardFormStep } from './WizardFormStep'
export { default as AutosaveIndicator } from './AutosaveIndicator'
diff --git a/packages/xpub-faraday/app/routes.js b/packages/xpub-faraday/app/routes.js
index bc297cdbf..0679a1da9 100644
--- a/packages/xpub-faraday/app/routes.js
+++ b/packages/xpub-faraday/app/routes.js
@@ -1,7 +1,5 @@
import React from 'react'
import { Route } from 'react-router-dom'
-import { DragDropContext } from 'react-dnd'
-import HTML5Backend from 'react-dnd-html5-backend'
import App from 'pubsweet-component-xpub-app/src/components'
@@ -36,4 +34,4 @@ const Routes = () => (
</App>
)
-export default DragDropContext(HTML5Backend)(Routes)
+export default Routes
diff --git a/packages/xpub-faraday/config/components.json b/packages/xpub-faraday/config/components.json
index d2f94630a..0868d8175 100644
--- a/packages/xpub-faraday/config/components.json
+++ b/packages/xpub-faraday/config/components.json
@@ -4,5 +4,6 @@
"pubsweet-component-xpub-dashboard",
"xpub-faraday-server",
"pubsweet-component-ink-backend",
- "pubsweet-component-wizard"
+ "pubsweet-component-wizard",
+ "pubsweet-components-faraday"
]
diff --git a/packages/xpub-faraday/webpack/babel-includes.js b/packages/xpub-faraday/webpack/babel-includes.js
index cf4c70690..3a619ed55 100644
--- a/packages/xpub-faraday/webpack/babel-includes.js
+++ b/packages/xpub-faraday/webpack/babel-includes.js
@@ -8,6 +8,7 @@ module.exports = [
/pubsweet-[^/]+\/src/,
/xpub-[^/]+\/src/,
/component-[^/]+\/src/,
+ /components-[^/]+\/src/,
/wax-[^/]+\/src/,
/@pubsweet\/[^/]+\/src/,
]
--
GitLab