mirror of
https://github.com/strapi/strapi.git
synced 2025-11-07 21:58:23 +00:00
delete multiple medias
Signed-off-by: Virginie Ky <virginie.ky@gmail.com>
This commit is contained in:
parent
f0240a2c5e
commit
8ed0849432
@ -16,7 +16,7 @@ const Card = ({ checked, id, name, size, small, type, onChange, url }) => {
|
||||
<CardImgWrapper small={small} checked={checked}>
|
||||
<CardPreview type={type} url={url} />
|
||||
<div className="card-control-wrapper">
|
||||
<Checkbox name={id} onChange={onChange} value={checked} />
|
||||
<Checkbox name={`${id}`} onChange={onChange} value={checked} />
|
||||
</div>
|
||||
</CardImgWrapper>
|
||||
<Title fontSize="md" fontWeight="bold" ellipsis>
|
||||
@ -41,7 +41,7 @@ Card.defaultProps = {
|
||||
Card.propTypes = {
|
||||
checked: PropTypes.bool,
|
||||
name: PropTypes.string,
|
||||
id: PropTypes.string.isRequired,
|
||||
id: PropTypes.number.isRequired,
|
||||
onChange: PropTypes.func,
|
||||
size: PropTypes.number,
|
||||
small: PropTypes.bool,
|
||||
|
||||
@ -51,6 +51,18 @@ const HomePage = () => {
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [search]);
|
||||
|
||||
const deleteMedia = async id => {
|
||||
const requestURL = getRequestUrl(`files/${id}`);
|
||||
|
||||
try {
|
||||
await request(`${requestURL}${search}`, {
|
||||
method: 'DELETE',
|
||||
});
|
||||
} catch (err) {
|
||||
strapi.notification.error('notification.error');
|
||||
}
|
||||
};
|
||||
|
||||
const fetchData = async () => {
|
||||
const requestURL = getRequestUrl('files');
|
||||
|
||||
@ -91,7 +103,7 @@ const HomePage = () => {
|
||||
const handleChangeCheck = ({ target: { name, value } }) => {
|
||||
dispatch({
|
||||
type: 'ON_CHANGE_DATA_TO_DELETE',
|
||||
id: name,
|
||||
id: parseInt(name, 10),
|
||||
value,
|
||||
});
|
||||
};
|
||||
@ -139,10 +151,15 @@ const HomePage = () => {
|
||||
});
|
||||
};
|
||||
|
||||
const handleDeleteMedias = async () => {
|
||||
await Promise.all(dataToDelete.map(id => deleteMedia(id)));
|
||||
|
||||
fetchData();
|
||||
};
|
||||
|
||||
const handleSelectAll = () => {
|
||||
dispatch({
|
||||
type: 'TOGGLE_SELECT_ALL',
|
||||
value: !areAllCheckboxesSelected,
|
||||
});
|
||||
};
|
||||
|
||||
@ -163,7 +180,7 @@ const HomePage = () => {
|
||||
color: 'cancel',
|
||||
// TradId from the strapi-admin package
|
||||
label: formatMessage({ id: 'app.utils.delete' }),
|
||||
onClick: () => {},
|
||||
onClick: handleDeleteMedias,
|
||||
type: 'button',
|
||||
},
|
||||
{
|
||||
@ -211,7 +228,7 @@ const HomePage = () => {
|
||||
onClick={handleDeleteFilter}
|
||||
/>
|
||||
</ControlsWrapper>
|
||||
<List onChange={handleChangeCheck} selectedItems={dataToDelete} />
|
||||
<List data={data} onChange={handleChangeCheck} selectedItems={dataToDelete} />
|
||||
<ListEmpty onClick={() => handleClickToggleModal()} />
|
||||
<PageFooter
|
||||
context={{ emitEvent: () => {} }}
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { fromJS } from 'immutable';
|
||||
import { List, fromJS } from 'immutable';
|
||||
|
||||
const initialState = fromJS({
|
||||
data: [],
|
||||
@ -22,13 +22,13 @@ const reducer = (state, action) => {
|
||||
return state.removeIn(['dataToDelete', index]);
|
||||
}
|
||||
case 'TOGGLE_SELECT_ALL': {
|
||||
const { value } = action;
|
||||
const isSelected = List(state.get('data')).size === List(state.get('dataToDelete')).size;
|
||||
|
||||
if (!value) {
|
||||
return state.update('dataToDelete', () => []);
|
||||
if (isSelected) {
|
||||
return state.update('dataToDelete', () => List([]));
|
||||
}
|
||||
|
||||
return state.update('dataToDelete', () => state.get('data').map(item => item.get('id')));
|
||||
return state.update('dataToDelete', () => List(state.get('data').map(item => item.id)));
|
||||
}
|
||||
default:
|
||||
return state;
|
||||
|
||||
@ -1,4 +1,4 @@
|
||||
import { fromJS } from 'immutable';
|
||||
import { List, fromJS } from 'immutable';
|
||||
import reducer, { initialState } from '../reducer';
|
||||
|
||||
describe('Upload | containers | HomePage | reducer', () => {
|
||||
@ -75,14 +75,82 @@ describe('Upload | containers | HomePage | reducer', () => {
|
||||
updated_at: '2020-03-04T14:16:35.148Z',
|
||||
},
|
||||
];
|
||||
const state = initialState.set('data', data).set('dataToDelete', fromJS([1, 2]));
|
||||
const state = initialState.set('data', data).set('dataToDelete', List([1, 2]));
|
||||
|
||||
const action = {
|
||||
type: 'ON_CHANGE_DATA_TO_DELETE',
|
||||
id: 2,
|
||||
};
|
||||
|
||||
const expectedState = state.set('dataToDelete', fromJS([1]));
|
||||
const expectedState = state.set('dataToDelete', List([1]));
|
||||
|
||||
expect(reducer(state, action)).toEqual(expectedState);
|
||||
});
|
||||
|
||||
it('should empty dataToDelete if all items are selected', () => {
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Capture d’écran 2020-02-25 à 15.43.44.png',
|
||||
ext: '.png',
|
||||
mime: 'image/png',
|
||||
size: 146.25,
|
||||
url: '/uploads/ba0c3352c4b14132aed3fcf3110b481c.png',
|
||||
created_at: '2020-03-04T09:45:32.444Z',
|
||||
updated_at: '2020-03-04T09:45:32.444Z',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'photo_2020-02-27 17.07.08.jpeg',
|
||||
ext: '.jpeg',
|
||||
mime: 'image/jpeg',
|
||||
size: 140.64,
|
||||
url: '/uploads/1d2ac677ea194b48bbe55ecec1b452d6.jpeg',
|
||||
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 action = {
|
||||
type: 'TOGGLE_SELECT_ALL',
|
||||
};
|
||||
|
||||
const expectedState = state.set('dataToDelete', List([]));
|
||||
|
||||
expect(reducer(state, action)).toEqual(expectedState);
|
||||
});
|
||||
|
||||
it('should fill dataToDelete if all items are not selected', () => {
|
||||
const data = [
|
||||
{
|
||||
id: 1,
|
||||
name: 'Capture d’écran 2020-02-25 à 15.43.44.png',
|
||||
ext: '.png',
|
||||
mime: 'image/png',
|
||||
size: 146.25,
|
||||
url: '/uploads/ba0c3352c4b14132aed3fcf3110b481c.png',
|
||||
created_at: '2020-03-04T09:45:32.444Z',
|
||||
updated_at: '2020-03-04T09:45:32.444Z',
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
name: 'photo_2020-02-27 17.07.08.jpeg',
|
||||
ext: '.jpeg',
|
||||
mime: 'image/jpeg',
|
||||
size: 140.64,
|
||||
url: '/uploads/1d2ac677ea194b48bbe55ecec1b452d6.jpeg',
|
||||
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 action = {
|
||||
type: 'TOGGLE_SELECT_ALL',
|
||||
};
|
||||
|
||||
const expectedState = state.set('dataToDelete', List([1, 2]));
|
||||
|
||||
expect(reducer(state, action)).toEqual(expectedState);
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user