ui(admin): fix new roles not mutating swr
This commit is contained in:
parent
25feeaa9f5
commit
ca4046e818
2 changed files with 7 additions and 31 deletions
|
@ -1,14 +1,14 @@
|
||||||
|
import { Form, Formik, FormikHelpers } from 'formik';
|
||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
|
import tw from 'twin.macro';
|
||||||
|
import { object, string } from 'yup';
|
||||||
import createRole from '@/api/admin/roles/createRole';
|
import createRole from '@/api/admin/roles/createRole';
|
||||||
import { AdminContext } from '@/state/admin';
|
import getRoles from '@/api/admin/roles/getRoles';
|
||||||
|
import FlashMessageRender from '@/components/FlashMessageRender';
|
||||||
import Button from '@/components/elements/Button';
|
import Button from '@/components/elements/Button';
|
||||||
import Field from '@/components/elements/Field';
|
import Field from '@/components/elements/Field';
|
||||||
import Modal from '@/components/elements/Modal';
|
import Modal from '@/components/elements/Modal';
|
||||||
import FlashMessageRender from '@/components/FlashMessageRender';
|
|
||||||
import useFlash from '@/plugins/useFlash';
|
import useFlash from '@/plugins/useFlash';
|
||||||
import { Form, Formik, FormikHelpers } from 'formik';
|
|
||||||
import tw from 'twin.macro';
|
|
||||||
import { object, string } from 'yup';
|
|
||||||
|
|
||||||
interface Values {
|
interface Values {
|
||||||
name: string,
|
name: string,
|
||||||
|
@ -26,8 +26,7 @@ const schema = object().shape({
|
||||||
export default () => {
|
export default () => {
|
||||||
const [ visible, setVisible ] = useState(false);
|
const [ visible, setVisible ] = useState(false);
|
||||||
const { clearFlashes, clearAndAddHttpError } = useFlash();
|
const { clearFlashes, clearAndAddHttpError } = useFlash();
|
||||||
|
const { mutate } = getRoles();
|
||||||
const appendRole = AdminContext.useStoreActions(actions => actions.roles.appendRole);
|
|
||||||
|
|
||||||
const submit = ({ name, description }: Values, { setSubmitting }: FormikHelpers<Values>) => {
|
const submit = ({ name, description }: Values, { setSubmitting }: FormikHelpers<Values>) => {
|
||||||
clearFlashes('role:create');
|
clearFlashes('role:create');
|
||||||
|
@ -35,7 +34,7 @@ export default () => {
|
||||||
|
|
||||||
createRole(name, description)
|
createRole(name, description)
|
||||||
.then(role => {
|
.then(role => {
|
||||||
appendRole(role);
|
mutate(data => ({ ...data!, items: data!.items.concat(role) }), false);
|
||||||
setVisible(false);
|
setVisible(false);
|
||||||
})
|
})
|
||||||
.catch(error => {
|
.catch(error => {
|
||||||
|
|
|
@ -1,39 +1,16 @@
|
||||||
import { action, Action } from 'easy-peasy';
|
import { action, Action } from 'easy-peasy';
|
||||||
import { Role } from '@/api/admin/roles/getRoles';
|
|
||||||
|
|
||||||
export interface AdminRoleStore {
|
export interface AdminRoleStore {
|
||||||
data: Role[];
|
|
||||||
selectedRoles: number[];
|
selectedRoles: number[];
|
||||||
|
|
||||||
setRoles: Action<AdminRoleStore, Role[]>;
|
|
||||||
appendRole: Action<AdminRoleStore, Role>;
|
|
||||||
removeRole: Action<AdminRoleStore, number>;
|
|
||||||
|
|
||||||
setSelectedRoles: Action<AdminRoleStore, number[]>;
|
setSelectedRoles: Action<AdminRoleStore, number[]>;
|
||||||
appendSelectedRole: Action<AdminRoleStore, number>;
|
appendSelectedRole: Action<AdminRoleStore, number>;
|
||||||
removeSelectedRole: Action<AdminRoleStore, number>;
|
removeSelectedRole: Action<AdminRoleStore, number>;
|
||||||
}
|
}
|
||||||
|
|
||||||
const roles: AdminRoleStore = {
|
const roles: AdminRoleStore = {
|
||||||
data: [],
|
|
||||||
selectedRoles: [],
|
selectedRoles: [],
|
||||||
|
|
||||||
setRoles: action((state, payload) => {
|
|
||||||
state.data = payload;
|
|
||||||
}),
|
|
||||||
|
|
||||||
appendRole: action((state, payload) => {
|
|
||||||
if (state.data.find(role => role.id === payload.id)) {
|
|
||||||
state.data = state.data.map(role => role.id === payload.id ? payload : role);
|
|
||||||
} else {
|
|
||||||
state.data = [ ...state.data, payload ];
|
|
||||||
}
|
|
||||||
}),
|
|
||||||
|
|
||||||
removeRole: action((state, payload) => {
|
|
||||||
state.data = [ ...state.data.filter(role => role.id !== payload) ];
|
|
||||||
}),
|
|
||||||
|
|
||||||
setSelectedRoles: action((state, payload) => {
|
setSelectedRoles: action((state, payload) => {
|
||||||
state.selectedRoles = payload;
|
state.selectedRoles = payload;
|
||||||
}),
|
}),
|
||||||
|
|
Loading…
Reference in a new issue