implemented category create before reorder

Author: velopert

velog-frontend/src/containers/write/CategoryEditModalContainer.js

@@ -46,7 +46,7 @@ class CategoryEditModalContainer extends Component<Props> {
     const shouldUpdate = categories.filter(c => c.edited && !c.temp && !c.hide);
 
     try {
-      const create = shouldCreate.map(c => WriteActions.createCategory(c.name));
+      const create = shouldCreate.map(c => WriteActions.createCategory(c.name, c.id));
       const remove = shouldRemove.map(c => WriteActions.deleteCategory(c.id));
       const update = shouldUpdate.map(c => WriteActions.updateCategory({
         id: c.id,
@@ -55,7 +55,9 @@ class CategoryEditModalContainer extends Component<Props> {
       await Promise.all(create);
       await Promise.all(remove);
       await Promise.all(update);
-      const categoryOrders = categories.map((category, i) => ({ id: category.id, order: i }))
+      if (!this.props.categories) return;
+      const categoryOrders = this.props.categories.map(
+        (category, i) => ({ id: category.id, order: i }))
         .toJS();
       await WriteActions.reorderCategories(categoryOrders);
     } catch (e) {

velog-frontend/src/store/modules/write.js

@@ -43,7 +43,7 @@ export type WriteActionCreators = {
   toggleEditCategory(id: string): any,
   changeCategoryName({ id: string, name: string }): any,
   hideCategory(id: string): any,
-  createCategory(name: string): any,
+  createCategory(name: string, id: string): any,
   deleteCategory(id: string): any,
   updateCategory({ id: string, name: string }): any,
   reorderCategory({ from: number, to: number }): any,
@@ -65,13 +65,14 @@ export const actionCreators = {
   toggleEditCategory: createAction(TOGGLE_EDIT_CATEGORY, id => id),
   changeCategoryName: createAction(CHANGE_CATEGORY_NAME, ({ id, name }) => ({ id, name })),
   hideCategory: createAction(HIDE_CATEGORY, id => id),
-  createCategory: createAction(CREATE_CATEGORY, MeAPI.createCategory),
+  createCategory: createAction(CREATE_CATEGORY, MeAPI.createCategory, (name, id) => id),
   deleteCategory: createAction(DELETE_CATEGORY, MeAPI.deleteCategory),
   updateCategory: createAction(UPDATE_CATEGORY, MeAPI.updateCategory),
   reorderCategory: createAction(REORDER_CATEGORY),
   reorderCategories: createAction(REORDER_CATEGORIES, MeAPI.reorderCategories),
 };
 
+
 export type Category = {
   id: string,
   order: number,
@@ -241,6 +242,14 @@ export default handleActions({
       true,
     );
   },
+  ...pender({
+    type: CREATE_CATEGORY,
+    onSuccess: (state, action) => {
+      const index = state.categoryModal.categories.findIndex(
+        category => category.id === action.meta);
+      return state.setIn(['categoryModal', 'categories', index, 'id'], action.payload.data.id);
+    },
+  }),
   [REORDER_CATEGORY]: (state, { payload: { from, to } }) => {
     const fromItem = state.categoryModal.categories.get(from);
     return state.withMutations((s) => {