apply PR review

Signed-off-by: Virginie Ky <virginie.ky@gmail.com>
This commit is contained in:
Virginie Ky 2020-03-13 16:16:41 +01:00
parent f9574aac62
commit f4d1359f50
3 changed files with 46 additions and 27 deletions

View File

@ -1,4 +1,4 @@
import React, { useReducer, useState, useEffect } from 'react';
import React, { useReducer, useState, useEffect, useRef } from 'react';
import { includes } from 'lodash';
import { useHistory, useLocation } from 'react-router-dom';
import { Header } from '@buffetjs/custom';
@ -35,6 +35,7 @@ const HomePage = () => {
const [searchValue, setSearchValue] = useState(query.get('_q') || '');
const { push } = useHistory();
const { search } = useLocation();
const isMounted = useRef();
const { data, dataToDelete } = reducerState.toJS();
const pluginName = formatMessage({ id: getTrad('plugin.name') });
@ -47,7 +48,12 @@ const HomePage = () => {
}, [debouncedSearch]);
useEffect(() => {
isMounted.current = true;
fetchData();
return () => {
isMounted.current = false;
};
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [search]);
@ -59,7 +65,9 @@ const HomePage = () => {
method: 'DELETE',
});
} catch (err) {
strapi.notification.error('notification.error');
if (isMounted.current) {
strapi.notification.error('notification.error');
}
}
};
@ -71,12 +79,16 @@ const HomePage = () => {
method: 'GET',
});
dispatch({
type: 'GET_DATA_SUCCEEDED',
data,
});
if (isMounted.current) {
dispatch({
type: 'GET_DATA_SUCCEEDED',
data,
});
}
} catch (err) {
strapi.notification.error('notification.error');
if (isMounted.current) {
strapi.notification.error('notification.error');
}
}
};

View File

@ -1,4 +1,4 @@
import { List, fromJS } from 'immutable';
import { fromJS } from 'immutable';
const initialState = fromJS({
data: [],
@ -8,7 +8,7 @@ const initialState = fromJS({
const reducer = (state, action) => {
switch (action.type) {
case 'GET_DATA_SUCCEEDED':
return state.update('data', () => action.data);
return state.update('data', () => fromJS(action.data));
case 'ON_CHANGE_DATA_TO_DELETE': {
const { value, id } = action;
@ -17,18 +17,19 @@ const reducer = (state, action) => {
return dataToDelete.push(id);
});
}
const index = state.get('dataToDelete').findIndex(item => item === id);
return state.removeIn(['dataToDelete', index]);
}
case 'TOGGLE_SELECT_ALL': {
const isSelected = List(state.get('data')).size === List(state.get('dataToDelete')).size;
const isSelected = state.get('data').size === state.get('dataToDelete').size;
if (isSelected) {
return state.update('dataToDelete', () => List([]));
return state.update('dataToDelete', () => fromJS([]));
}
return state.update('dataToDelete', () => List(state.get('data').map(item => item.id)));
return state.update('dataToDelete', () => state.get('data').map(item => item.get('id')));
}
default:
return state;

View File

@ -1,11 +1,11 @@
import { List, fromJS } from 'immutable';
import { fromJS } from 'immutable';
import reducer, { initialState } from '../reducer';
describe('Upload | containers | HomePage | reducer', () => {
it('should update data with received data', () => {
const state = initialState;
const receivedData = [
const receivedData = fromJS([
{
id: 1,
name: 'Capture décran 2020-02-25 à 15.43.44.png',
@ -26,7 +26,7 @@ describe('Upload | containers | HomePage | reducer', () => {
created_at: '2020-03-04T14:16:35.148Z',
updated_at: '2020-03-04T14:16:35.148Z',
},
];
]);
const action = {
type: 'GET_DATA_SUCCEEDED',
@ -53,7 +53,7 @@ describe('Upload | containers | HomePage | reducer', () => {
});
it('should remove a media to dataToDelete if value is false', () => {
const data = [
const data = fromJS([
{
id: 1,
name: 'Capture décran 2020-02-25 à 15.43.44.png',
@ -74,21 +74,23 @@ describe('Upload | containers | HomePage | reducer', () => {
created_at: '2020-03-04T14:16:35.148Z',
updated_at: '2020-03-04T14:16:35.148Z',
},
];
const state = initialState.set('data', data).set('dataToDelete', List([1, 2]));
]);
const dataToDelete = fromJS([1, 2]);
const state = initialState.set('data', data).set('dataToDelete', dataToDelete);
const action = {
type: 'ON_CHANGE_DATA_TO_DELETE',
id: 2,
};
const expectedState = state.set('dataToDelete', List([1]));
const expectedState = state.set('dataToDelete', fromJS([1]));
expect(reducer(state, action)).toEqual(expectedState);
});
it('should empty dataToDelete if all items are selected', () => {
const data = [
const data = fromJS([
{
id: 1,
name: 'Capture décran 2020-02-25 à 15.43.44.png',
@ -109,20 +111,22 @@ describe('Upload | containers | HomePage | reducer', () => {
created_at: '2020-03-04T14:16:35.148Z',
updated_at: '2020-03-04T14:16:35.148Z',
},
];
const state = initialState.set('data', data).set('dataToDelete', List([1, 2]));
]);
const dataToDelete = fromJS([1, 2]);
const state = initialState.set('data', data).set('dataToDelete', dataToDelete);
const action = {
type: 'TOGGLE_SELECT_ALL',
};
const expectedState = state.set('dataToDelete', List([]));
const expectedState = state.set('dataToDelete', fromJS([]));
expect(reducer(state, action)).toEqual(expectedState);
});
it('should fill dataToDelete if all items are not selected', () => {
const data = [
const data = fromJS([
{
id: 1,
name: 'Capture décran 2020-02-25 à 15.43.44.png',
@ -143,14 +147,16 @@ describe('Upload | containers | HomePage | reducer', () => {
created_at: '2020-03-04T14:16:35.148Z',
updated_at: '2020-03-04T14:16:35.148Z',
},
];
const state = initialState.set('data', data).set('dataToDelete', List([1]));
]);
const dataToDelete = fromJS([]);
const state = initialState.set('data', data).set('dataToDelete', dataToDelete);
const action = {
type: 'TOGGLE_SELECT_ALL',
};
const expectedState = state.set('dataToDelete', List([1, 2]));
const expectedState = state.set('dataToDelete', fromJS([1, 2]));
expect(reducer(state, action)).toEqual(expectedState);
});