Changing bookmark category

.gitignore

@@ -1,3 +1,3 @@
 node_modules/
+data/
 .env
-*.sqlite

client/src/components/Bookmarks/BookmarkForm/BookmarkForm.tsx

@@ -17,7 +17,7 @@ interface ComponentProps {
   addCategory: (formData: NewCategory) => void;
   addBookmark: (formData: NewBookmark) => void;
   updateCategory: (id: number, formData: NewCategory) => void;
-  updateBookmark: (id: number, formData: NewBookmark, categoryWasChanged: boolean) => void;
+  updateBookmark: (id: number, formData: NewBookmark, previousCategoryId: number) => void;
   createNotification: (notification: NewNotification) => void;
 }
 
@@ -90,7 +90,7 @@ const BookmarkForm = (props: ComponentProps): JSX.Element => {
         setCategoryName({ name: '' });
       } else if (props.contentType === ContentType.bookmark && props.bookmark) {
         // Update bookmark
-        props.updateBookmark(props.bookmark.id, formData, props.bookmark.categoryId !== formData.categoryId);
+        props.updateBookmark(props.bookmark.id, formData, props.bookmark.categoryId);
         setFormData({
           name: '',
           url: '',

client/src/store/actions/bookmark.ts

@@ -218,13 +218,10 @@ export const deleteBookmark = (bookmarkId: number, categoryId: number) => async
  */
 export interface UpdateBookmarkAction {
   type: ActionTypes.updateBookmark,
-  payload: {
+  payload: Bookmark
-    bookmark: Bookmark,
-    categoryWasChanged: boolean
-  }
 }
 
-export const updateBookmark = (bookmarkId: number, formData: NewBookmark, categoryWasChanged: boolean) => async (dispatch: Dispatch) => {
+export const updateBookmark = (bookmarkId: number, formData: NewBookmark, previousCategoryId: number) => async (dispatch: Dispatch) => {
   try {
     const res = await axios.put<ApiResponse<Bookmark>>(`/api/bookmarks/${bookmarkId}`, formData);
     
@@ -236,13 +233,31 @@ export const updateBookmark = (bookmarkId: number, formData: NewBookmark, catego
       }
     })
 
-    dispatch<UpdateBookmarkAction>({
+    // Check if category was changed
-      type: ActionTypes.updateBookmark,
+    const categoryWasChanged = formData.categoryId !== previousCategoryId;
-      payload: {
+
-        bookmark: res.data.data,
+    if (categoryWasChanged) {
-        categoryWasChanged
+      // Delete bookmark from old category
-      }
+      dispatch<DeleteBookmarkAction>({
-    })
+        type: ActionTypes.deleteBookmark,
+        payload: {
+          bookmarkId,
+          categoryId: previousCategoryId
+        }
+      })
+
+      // Add bookmark to the new category
+      dispatch<AddBookmarkAction>({
+        type: ActionTypes.addBookmark,
+        payload: res.data.data
+      })
+    } else {
+      // Else update only name/url
+      dispatch<UpdateBookmarkAction>({
+        type: ActionTypes.updateBookmark,
+        payload: res.data.data
+      })
+    }
   } catch (err) {
     console.log(err);
   }

client/src/store/reducers/bookmark.ts

@@ -30,28 +30,36 @@ const getCategoriesSuccess = (state: State, action: Action): State => {
 }
 
 const addCategory = (state: State, action: Action): State => {
-  const tmpCategories = [...state.categories, {
-    ...action.payload,
-    bookmarks: []
-  }];
-
   return {
     ...state,
-    categories: tmpCategories
+    categories: [
+      ...state.categories,
+      {
+        ...action.payload,
+        bookmarks: []
+      }
+    ]
   }
 }
 
 const addBookmark = (state: State, action: Action): State => {
-  const tmpCategories = [...state.categories];
+  const categoryIndex = state.categories.findIndex((category: Category) => category.id === action.payload.categoryId);
-  const tmpCategory = tmpCategories.find((category: Category) => category.id === action.payload.categoryId);
-
-  if (tmpCategory) {
-    tmpCategory.bookmarks.push(action.payload);
-  }
 
   return {
     ...state,
-    categories: tmpCategories
+    categories: [
+      ...state.categories.slice(0, categoryIndex),
+      {
+        ...state.categories[categoryIndex],
+        bookmarks: [
+          ...state.categories[categoryIndex].bookmarks,
+          {
+            ...action.payload
+          }
+        ]
+      },
+      ...state.categories.slice(categoryIndex + 1)
+    ]
   }
 }
 
@@ -70,11 +78,14 @@ const pinCategory = (state: State, action: Action): State => {
 }
 
 const deleteCategory = (state: State, action: Action): State => {
-  const tmpCategories = [...state.categories].filter((category: Category) => category.id !== action.payload);
+  const categoryIndex = state.categories.findIndex((category: Category) => category.id === action.payload);
 
   return {
     ...state,
-    categories: tmpCategories
+    categories: [
+      ...state.categories.slice(0, categoryIndex),
+      ...state.categories.slice(categoryIndex + 1)
+    ]
   }
 }
 
@@ -100,6 +111,7 @@ const deleteBookmark = (state: State, action: Action): State => {
     categoryInUpdate.bookmarks = categoryInUpdate.bookmarks.filter((bookmark: Bookmark) => bookmark.id !== action.payload.bookmarkId);
   }
 
+  
   return {
     ...state,
     categories: tmpCategories
@@ -107,21 +119,8 @@ const deleteBookmark = (state: State, action: Action): State => {
 }
 
 const updateBookmark = (state: State, action: Action): State => {
-  const { bookmark, categoryWasChanged } = action.payload;
+  let categoryIndex = state.categories.findIndex((category: Category) => category.id === action.payload.categoryId);
-  const tmpCategories = [...state.categories];
+  let bookmarkIndex = state.categories[categoryIndex].bookmarks.findIndex((bookmark: Bookmark) => bookmark.id === action.payload.id);
-
-  let categoryIndex = state.categories.findIndex((category: Category) => category.id === bookmark.categoryId);
-  let bookmarkIndex = state.categories[categoryIndex].bookmarks.findIndex((bookmark: Bookmark) => bookmark.id === bookmark.id);
-
-  // if (categoryWasChanged) {
-  //   const categoryInUpdate = tmpCategories.find((category: Category) => category.id === bookmark.categoryId);
-
-  //   if (categoryInUpdate) {
-  //     categoryInUpdate.bookmarks = categoryInUpdate.bookmarks.filter((_bookmark: Bookmark) => _bookmark.id === bookmark.id);
-  //   }
-
-  //   console.log(categoryInUpdate);
-  // }
 
   return {
     ...state,
@@ -132,7 +131,7 @@ const updateBookmark = (state: State, action: Action): State => {
         bookmarks: [
           ...state.categories[categoryIndex].bookmarks.slice(0, bookmarkIndex),
           {
-            ...bookmark
+            ...action.payload
           },
           ...state.categories[categoryIndex].bookmarks.slice(bookmarkIndex + 1)
         ]

db.js

@@ -2,13 +2,15 @@ const { Sequelize } = require('sequelize');
 
 const sequelize = new Sequelize({
   dialect: 'sqlite',
-  storage: './db.sqlite'
+  storage: './data/db.sqlite',
+  logging: false
 });
 
 const connectDB = async () => {
   try {
     await sequelize.authenticate({ logging: false });
     console.log('Connected to database'.cyan.underline);
+    
     await sequelize.sync({
       // alter: true,
       logging: false