Updated group_editor redux to include new keys

• Updated:
- group_editor redux to include new keys: tags, category, isPrivate, isVisible, slug
This commit is contained in:
mgabdev 2020-08-05 23:51:43 -05:00
parent d68ad5f4ab
commit 2702b1a530
2 changed files with 137 additions and 31 deletions

View File

@ -12,6 +12,11 @@ export const GROUP_UPDATE_FAIL = 'GROUP_UPDATE_FAIL'
export const GROUP_EDITOR_TITLE_CHANGE = 'GROUP_EDITOR_TITLE_CHANGE'
export const GROUP_EDITOR_DESCRIPTION_CHANGE = 'GROUP_EDITOR_DESCRIPTION_CHANGE'
export const GROUP_EDITOR_COVER_IMAGE_CHANGE = 'GROUP_EDITOR_COVER_IMAGE_CHANGE'
export const GROUP_EDITOR_ID_CHANGE = 'GROUP_EDITOR_ID_CHANGE'
export const GROUP_EDITOR_TAGS_CHANGE = 'GROUP_EDITOR_TAGS_CHANGE'
export const GROUP_EDITOR_CATEGORY_CHANGE = 'GROUP_EDITOR_CATEGORY_CHANGE'
export const GROUP_EDITOR_IS_PRIVATE_CHANGE = 'GROUP_EDITOR_IS_PRIVATE_CHANGE'
export const GROUP_EDITOR_IS_VISIBLE_CHANGE = 'GROUP_EDITOR_IS_VISIBLE_CHANGE'
export const GROUP_EDITOR_RESET = 'GROUP_EDITOR_RESET'
export const GROUP_EDITOR_SETUP = 'GROUP_EDITOR_SETUP'
@ -23,26 +28,46 @@ export const submit = (routerHistory) => (dispatch, getState) => {
const title = getState().getIn(['group_editor', 'title'])
const description = getState().getIn(['group_editor', 'description'])
const coverImage = getState().getIn(['group_editor', 'coverImage'])
let tags = getState().getIn(['group_editor', 'tags'], '')
tags = `${tags}`.split(',').map((t) => t.trim())
const category = getState().getIn(['group_editor', 'category'])
const isPrivate = getState().getIn(['group_editor', 'isPrivate'])
const isVisible = getState().getIn(['group_editor', 'isVisible'])
const slug = getState().getIn(['group_editor', 'id'])
const options = {
title,
description,
coverImage,
tags,
category,
isPrivate,
isVisible,
slug,
}
if (groupId === null) {
dispatch(create(title, description, coverImage, routerHistory))
dispatch(create(options, routerHistory))
} else {
dispatch(update(groupId, title, description, coverImage, routerHistory))
dispatch(update(groupId, options, routerHistory))
}
};
}
const create = (title, description, coverImage, routerHistory) => (dispatch, getState) => {
const create = (options, routerHistory) => (dispatch, getState) => {
if (!me) return
dispatch(createRequest())
const formData = new FormData()
formData.append('title', title)
formData.append('description', description)
formData.append('title', options.title)
formData.append('description', options.description)
formData.append('tags', options.tags)
formData.append('group_categories_id', options.category)
formData.append('is_private', options.isPrivate)
formData.append('is_visible', options.isVisible)
if (coverImage !== null) {
formData.append('cover_image', coverImage)
if (options.coverImage !== null) {
formData.append('cover_image', options.coverImage)
}
api(getState).post('/api/v1/groups', formData, {
@ -53,7 +78,7 @@ const create = (title, description, coverImage, routerHistory) => (dispatch, get
dispatch(createSuccess(data))
routerHistory.push(`/groups/${data.id}`)
}).catch(err => dispatch(createFail(err)))
};
}
export const createRequest = (id) => ({
@ -71,35 +96,43 @@ export const createFail = (error) => ({
error,
})
const update = (groupId, title, description, coverImage, routerHistory) => (dispatch, getState) => {
const update = (groupId, options, routerHistory) => (dispatch, getState) => {
if (!me) return
dispatch(updateRequest())
const formData = new FormData()
formData.append('title', title)
formData.append('description', description);
formData.append('title', options.title)
formData.append('description', options.description)
formData.append('tags', options.tags)
formData.append('group_categories_id', options.category)
formData.append('is_private', options.isPrivate)
formData.append('is_visible', options.isVisible)
formData.append('slug', options.slug)
if (coverImage !== null) {
formData.append('cover_image', coverImage);
if (options.coverImage !== null) {
formData.append('cover_image', options.coverImage)
}
api(getState).put(`/api/v1/groups/${groupId}`, formData, { headers: { 'Content-Type': 'multipart/form-data' } }).then(({ data }) => {
dispatch(updateSuccess(data));
routerHistory.push(`/groups/${data.id}`);
}).catch(err => dispatch(updateFail(err)));
};
api(getState).put(`/api/v1/groups/${groupId}`, formData, {
headers: {
'Content-Type': 'multipart/form-data'
}
}).then(({ data }) => {
dispatch(updateSuccess(data))
routerHistory.push(`/groups/${data.id}`)
}).catch(err => dispatch(updateFail(err)))
}
export const updateRequest = (id) => ({
type: GROUP_UPDATE_REQUEST,
id,
});
})
export const updateSuccess = (group) => ({
type: GROUP_UPDATE_SUCCESS,
group,
});
})
export const updateFail = (error) => ({
type: GROUP_UPDATE_FAIL,
@ -108,12 +141,12 @@ export const updateFail = (error) => ({
export const resetEditor = () => ({
type: GROUP_EDITOR_RESET
});
})
export const setGroup = (group) => ({
type: GROUP_EDITOR_SETUP,
group,
});
})
export const changeGroupTitle = (title) => ({
type: GROUP_EDITOR_TITLE_CHANGE,
@ -125,6 +158,31 @@ export const changeGroupDescription = (description) => ({
description,
})
export const changeGroupId = (idValue) => ({
type: GROUP_EDITOR_ID_CHANGE,
idValue,
})
export const changeGroupTags = (tags) => ({
type: GROUP_EDITOR_TAGS_CHANGE,
tags,
})
export const changeGroupCategory = (category) => ({
type: GROUP_EDITOR_CATEGORY_CHANGE,
category,
})
export const changeGroupIsPrivate = (isPrivate) => ({
type: GROUP_EDITOR_IS_PRIVATE_CHANGE,
isPrivate,
})
export const changeGroupIsVisible = (isVisible) => ({
type: GROUP_EDITOR_IS_VISIBLE_CHANGE,
isVisible,
})
export const changeGroupCoverImage = (imageData) => ({
type: GROUP_EDITOR_COVER_IMAGE_CHANGE,
value: imageData,

View File

@ -11,7 +11,13 @@ import {
GROUP_EDITOR_TITLE_CHANGE,
GROUP_EDITOR_DESCRIPTION_CHANGE,
GROUP_EDITOR_COVER_IMAGE_CHANGE,
GROUP_EDITOR_ID_CHANGE,
GROUP_EDITOR_TAGS_CHANGE,
GROUP_EDITOR_CATEGORY_CHANGE,
GROUP_EDITOR_IS_PRIVATE_CHANGE,
GROUP_EDITOR_IS_VISIBLE_CHANGE,
} from '../actions/group_editor'
import slugify from '../utils/slugify'
const initialState = ImmutableMap({
groupId: null,
@ -19,7 +25,12 @@ const initialState = ImmutableMap({
isChanged: false,
title: '',
description: '',
id: '',
tags: '',
category: '',
coverImage: null,
isPrivate: false,
isVisible: true,
})
export default function groupEditorReducer(state = initialState, action) {
@ -27,30 +38,67 @@ export default function groupEditorReducer(state = initialState, action) {
case GROUP_EDITOR_RESET:
return initialState
case GROUP_EDITOR_SETUP:
return state.withMutations(map => {
let tags
try {
tags = action.group.get('tags').toJS().join(', ')
} catch (error) {
//
}
return state.withMutations((map) => {
map.set('groupId', action.group.get('id'))
map.set('title', action.group.get('title'))
map.set('description', action.group.get('description'))
map.set('tags', tags)
map.set('isPrivate', action.group.get('is_private'))
map.set('isVisible', action.group.get('is_visible'))
map.set('id', action.group.get('slug'))
map.set('category', action.group.get('category'))
map.set('isSubmitting', false)
})
case GROUP_EDITOR_TITLE_CHANGE:
return state.withMutations(map => {
return state.withMutations((map) => {
map.set('title', action.title)
map.set('isChanged', true)
})
case GROUP_EDITOR_DESCRIPTION_CHANGE:
return state.withMutations(map => {
return state.withMutations((map) => {
map.set('description', action.description)
map.set('isChanged', true)
})
case GROUP_EDITOR_COVER_IMAGE_CHANGE:
return state.withMutations(map => {
return state.withMutations((map) => {
map.set('coverImage', action.value)
map.set('isChanged', true)
})
case GROUP_EDITOR_ID_CHANGE:
return state.withMutations((map) => {
map.set('id', slugify(action.idValue || ''))
map.set('isChanged', true)
})
case GROUP_EDITOR_TAGS_CHANGE:
return state.withMutations((map) => {
map.set('tags', action.tags)
map.set('isChanged', true)
})
case GROUP_EDITOR_CATEGORY_CHANGE:
return state.withMutations((map) => {
map.set('category', action.category)
map.set('isChanged', true)
})
case GROUP_EDITOR_IS_PRIVATE_CHANGE:
return state.withMutations((map) => {
map.set('isPrivate', action.isPrivate)
map.set('isChanged', true)
})
case GROUP_EDITOR_IS_VISIBLE_CHANGE:
return state.withMutations((map) => {
map.set('isVisible', action.isVisible)
map.set('isChanged', true)
})
case GROUP_CREATE_REQUEST:
case GROUP_UPDATE_REQUEST:
return state.withMutations(map => {
return state.withMutations((map) => {
map.set('isSubmitting', true)
map.set('isChanged', false)
})
@ -59,7 +107,7 @@ export default function groupEditorReducer(state = initialState, action) {
return state.set('isSubmitting', false)
case GROUP_CREATE_SUCCESS:
case GROUP_UPDATE_SUCCESS:
return state.withMutations(map => {
return state.withMutations((map) => {
map.set('isSubmitting', false)
map.set('groupId', action.group.id)
})