refactor: redux migration - collection click

This commit is contained in:
Anoop M D 2022-03-18 02:59:10 +05:30
parent 63ba4b34c4
commit 9c44221971
5 changed files with 18 additions and 20 deletions

View File

@ -3,8 +3,8 @@ import get from 'lodash/get';
import classnames from 'classnames';
import { IconChevronRight, IconDots } from '@tabler/icons';
import Dropdown from 'components/Dropdown';
import actions from 'providers/Store/actions'
import { useStore } from 'providers/Store';
import { collectionClicked } from 'providers/ReduxStore/slices/collections';
import { useDispatch } from 'react-redux';
import NewRequest from 'components/Sidebar/NewRequest';
import NewFolder from 'components/Sidebar/NewFolder';
import CollectionItem from './CollectionItem';
@ -14,7 +14,7 @@ import StyledWrapper from './StyledWrapper';
const Collection = ({collection}) => {
const [showNewFolderModal, setShowNewFolderModal] = useState(false);
const [showNewRequestModal, setShowNewRequestModal] = useState(false);
const [store, storeDispatch] = useStore();
const dispatch = useDispatch();
const menuDropdownTippyRef = useRef();
const onMenuDropdownCreate = (ref) => menuDropdownTippyRef.current = ref;
@ -40,10 +40,7 @@ const Collection = ({collection}) => {
return;
}
storeDispatch({
type: actions.SIDEBAR_COLLECTION_CLICK,
collectionUid: collection.uid
});
dispatch(collectionClicked(collection.uid));
};
const hideNewFolderModal = () => setShowNewFolderModal(false);

View File

@ -1,5 +1,6 @@
import { createSlice } from '@reduxjs/toolkit'
import { getCollectionsFromIdb } from 'utils/idb';
import { findCollectionByUid } from 'utils/collections';
const initialState = {
collections: []
@ -11,11 +12,18 @@ export const collectionsSlice = createSlice({
reducers: {
loadCollections: (state, action) => {
state.collections = action.payload;
},
collectionClicked: (state, action) => {
const collection = findCollectionByUid(state.collections, action.payload);
if(collection) {
collection.collapsed = !collection.collapsed;
}
}
}
});
export const { loadCollections } = collectionsSlice.actions;
export const { loadCollections, collectionClicked } = collectionsSlice.actions;
export const loadCollectionsFromIdb = () => (dispatch) => {
getCollectionsFromIdb(window.__idb)

View File

@ -1,4 +1,3 @@
const SIDEBAR_COLLECTION_CLICK = "SIDEBAR_COLLECTION_CLICK";
const SIDEBAR_COLLECTION_ITEM_CLICK = "SIDEBAR_COLLECTION_ITEM_CLICK";
const SIDEBAR_COLLECTION_NEW_FOLDER = "SIDEBAR_COLLECTION_NEW_FOLDER";
const SIDEBAR_COLLECTION_NEW_REQUEST = "SIDEBAR_COLLECTION_NEW_REQUEST";
@ -20,7 +19,6 @@ const IDB_COLLECTIONS_SYNC_ERROR = "IDB_COLLECTIONS_SYNC_ERROR";
const HOTKEY_SAVE = "HOTKEY_SAVE";
export default {
SIDEBAR_COLLECTION_CLICK,
SIDEBAR_COLLECTION_ITEM_CLICK,
SIDEBAR_COLLECTION_NEW_FOLDER,
SIDEBAR_COLLECTION_NEW_REQUEST,

View File

@ -41,16 +41,6 @@ const reducer = (state, action) => {
});
}
case actions.SIDEBAR_COLLECTION_CLICK: {
return produce(state, (draft) => {
const collection = findCollectionByUid(draft.collections, action.collectionUid);
if(collection) {
collection.collapsed = !collection.collapsed;
}
});
}
case actions.SIDEBAR_COLLECTION_ITEM_CLICK: {
return produce(state, (draft) => {
const collection = findCollectionByUid(draft.collections, action.collectionUid);

View File

@ -0,0 +1,5 @@
import find from 'lodash/find';
export const findCollectionByUid = (collections, collectionUid) => {
return find(collections, (c) => c.uid === collectionUid);
};