diff --git a/client/src/actions/lists.js b/client/src/actions/lists.js
index fcab0fc..4f85864 100644
--- a/client/src/actions/lists.js
+++ b/client/src/actions/lists.js
@@ -60,60 +60,62 @@ const handleListUpdate = (list) => ({
},
});
-const deleteList = (id) => ({
- type: ActionTypes.LIST_DELETE,
+const sortList = (id, data) => ({
+ type: ActionTypes.LIST_SORT,
payload: {
id,
+ data,
},
});
-deleteList.success = (list) => ({
- type: ActionTypes.LIST_DELETE__SUCCESS,
+sortList.success = (list, cards) => ({
+ type: ActionTypes.LIST_SORT__SUCCESS,
payload: {
list,
+ cards,
},
});
-deleteList.failure = (id, error) => ({
- type: ActionTypes.LIST_DELETE__FAILURE,
+sortList.failure = (id, error) => ({
+ type: ActionTypes.LIST_SORT__FAILURE,
payload: {
id,
error,
},
});
-const handleListDelete = (list) => ({
- type: ActionTypes.LIST_DELETE_HANDLE,
+const handleListSort = (list, cards) => ({
+ type: ActionTypes.LIST_SORT_HANDLE,
payload: {
list,
+ cards,
},
});
-const sortList = (id, data) => ({
- type: ActionTypes.LIST_SORT,
+const deleteList = (id) => ({
+ type: ActionTypes.LIST_DELETE,
payload: {
id,
- data,
},
});
-sortList.success = (list) => ({
- type: ActionTypes.LIST_SORT__SUCCESS,
+deleteList.success = (list) => ({
+ type: ActionTypes.LIST_DELETE__SUCCESS,
payload: {
list,
},
});
-sortList.failure = (id, error) => ({
- type: ActionTypes.LIST_SORT__FAILURE,
+deleteList.failure = (id, error) => ({
+ type: ActionTypes.LIST_DELETE__FAILURE,
payload: {
id,
error,
},
});
-const handleListSort = (list) => ({
- type: ActionTypes.LIST_SORT_HANDLE,
+const handleListDelete = (list) => ({
+ type: ActionTypes.LIST_DELETE_HANDLE,
payload: {
list,
},
@@ -124,8 +126,8 @@ export default {
handleListCreate,
updateList,
handleListUpdate,
- deleteList,
- handleListDelete,
sortList,
handleListSort,
+ deleteList,
+ handleListDelete,
};
diff --git a/client/src/api/lists.js b/client/src/api/lists.js
index aa36f0a..2ed11c5 100755
--- a/client/src/api/lists.js
+++ b/client/src/api/lists.js
@@ -1,4 +1,5 @@
import socket from './socket';
+import { transformCard } from './cards';
/* Actions */
@@ -7,13 +8,33 @@ const createList = (boardId, data, headers) =>
const updateList = (id, data, headers) => socket.patch(`/lists/${id}`, data, headers);
-const sortList = (id, data, headers) => socket.post(`/lists/${id}/sort`, data, headers);
+const sortList = (id, data, headers) =>
+ socket.post(`/lists/${id}/sort`, data, headers).then((body) => ({
+ ...body,
+ included: {
+ ...body.included,
+ cards: body.included.cards.map(transformCard),
+ },
+ }));
const deleteList = (id, headers) => socket.delete(`/lists/${id}`, undefined, headers);
+/* Event handlers */
+
+const makeHandleListSort = (next) => (body) => {
+ next({
+ ...body,
+ included: {
+ ...body.included,
+ cards: body.included.cards.map(transformCard),
+ },
+ });
+};
+
export default {
createList,
updateList,
sortList,
deleteList,
+ makeHandleListSort,
};
diff --git a/client/src/components/List/ActionsStep.jsx b/client/src/components/List/ActionsStep.jsx
index d4e8b39..bc04826 100755
--- a/client/src/components/List/ActionsStep.jsx
+++ b/client/src/components/List/ActionsStep.jsx
@@ -5,17 +5,17 @@ import { Menu } from 'semantic-ui-react';
import { Popup } from '../../lib/custom-ui';
import { useSteps } from '../../hooks';
+import ListSortStep from '../ListSortStep';
import DeleteStep from '../DeleteStep';
import styles from './ActionsStep.module.scss';
-import SortStep from '../SortStep';
const StepTypes = {
DELETE: 'DELETE',
SORT: 'SORT',
};
-const ActionsStep = React.memo(({ onNameEdit, onCardAdd, onDelete, onSort, onClose }) => {
+const ActionsStep = React.memo(({ onNameEdit, onCardAdd, onSort, onDelete, onClose }) => {
const [t] = useTranslation();
const [step, openStep, handleBack] = useSteps();
@@ -29,16 +29,29 @@ const ActionsStep = React.memo(({ onNameEdit, onCardAdd, onDelete, onSort, onClo
onClose();
}, [onCardAdd, onClose]);
+ const handleSortClick = useCallback(() => {
+ openStep(StepTypes.SORT);
+ }, [openStep]);
+
const handleDeleteClick = useCallback(() => {
openStep(StepTypes.DELETE);
}, [openStep]);
- const handleSortClick = useCallback(() => {
- openStep(StepTypes.SORT);
- }, [openStep]);
+ const handleSortTypeSelect = useCallback(
+ (type) => {
+ onSort({
+ type,
+ });
+
+ onClose();
+ },
+ [onSort, onClose],
+ );
if (step && step.type) {
switch (step.type) {
+ case StepTypes.SORT:
+ return ;
case StepTypes.DELETE:
return (
);
- case StepTypes.SORT:
- return ;
default:
}
}
@@ -64,11 +75,6 @@ const ActionsStep = React.memo(({ onNameEdit, onCardAdd, onDelete, onSort, onClo