Fixed mutate queries.

This commit is contained in:
Mike Cao 2023-12-03 21:35:20 -08:00
parent e462a55ab9
commit a4f8ab6ad9
4 changed files with 20 additions and 14 deletions

View File

@ -12,12 +12,12 @@ export function ReportHeader({ icon }) {
const { showToast } = useToasts(); const { showToast } = useToasts();
const { post, useMutation } = useApi(); const { post, useMutation } = useApi();
const router = useRouter(); const router = useRouter();
const { mutate: create, isLoading: isCreating } = useMutation((data: any) => const { mutate: create, isPending: isCreating } = useMutation({
post(`/reports`, data), mutationFn: (data: any) => post(`/reports`, data),
); });
const { mutate: update, isLoading: isUpdating } = useMutation((data: any) => const { mutate: update, isPending: isUpdating } = useMutation({
post(`/reports/${data.id}`, data), mutationFn: (data: any) => post(`/reports/${data.id}`, data),
); });
const { name, description, parameters } = report || {}; const { name, description, parameters } = report || {};
const { websiteId, dateRange } = parameters || {}; const { websiteId, dateRange } = parameters || {};

View File

@ -6,7 +6,9 @@ import useMessages from 'components/hooks/useMessages';
export function PasswordEditForm({ onSave, onClose }) { export function PasswordEditForm({ onSave, onClose }) {
const { formatMessage, labels, messages } = useMessages(); const { formatMessage, labels, messages } = useMessages();
const { post, useMutation } = useApi(); const { post, useMutation } = useApi();
const { mutate, error, isLoading } = useMutation((data: any) => post('/me/password', data)); const { mutate, error, isPending } = useMutation({
mutationFn: (data: any) => post('/me/password', data),
});
const ref = useRef(null); const ref = useRef(null);
const handleSubmit = async (data: any) => { const handleSubmit = async (data: any) => {
@ -56,7 +58,7 @@ export function PasswordEditForm({ onSave, onClose }) {
</FormInput> </FormInput>
</FormRow> </FormRow>
<FormButtons flex> <FormButtons flex>
<Button type="submit" variant="primary" disabled={isLoading}> <Button type="submit" variant="primary" disabled={isPending}>
{formatMessage(labels.save)} {formatMessage(labels.save)}
</Button> </Button>
<Button onClick={onClose}>{formatMessage(labels.cancel)}</Button> <Button onClick={onClose}>{formatMessage(labels.cancel)}</Button>

View File

@ -18,15 +18,17 @@ const generateId = () => getRandomChars(16);
export function TeamEditForm({ teamId, data, onSave, readOnly }) { export function TeamEditForm({ teamId, data, onSave, readOnly }) {
const { formatMessage, labels } = useMessages(); const { formatMessage, labels } = useMessages();
const { post, useMutation } = useApi(); const { post, useMutation } = useApi();
const { mutate, error } = useMutation(data => post(`/teams/${teamId}`, data)); const { mutate, error } = useMutation({
mutationFn: (data: any) => post(`/teams/${teamId}`, data),
});
const ref = useRef(null); const ref = useRef(null);
const [accessCode, setAccessCode] = useState(data.accessCode); const [accessCode, setAccessCode] = useState(data.accessCode);
const handleSubmit = async data => { const handleSubmit = async (data: any) => {
mutate(data, { mutate(data, {
onSuccess: async () => { onSuccess: async () => {
ref.current.reset(data); ref.current.reset(data);
onSave(data); onSave?.(data);
}, },
}); });
}; };

View File

@ -5,10 +5,12 @@ import { Icon, Icons, LoadingButton, Text } from 'react-basics';
export function TeamWebsiteRemoveButton({ teamId, websiteId, onSave }) { export function TeamWebsiteRemoveButton({ teamId, websiteId, onSave }) {
const { formatMessage, labels } = useMessages(); const { formatMessage, labels } = useMessages();
const { del, useMutation } = useApi(); const { del, useMutation } = useApi();
const { mutate, isLoading } = useMutation(() => del(`/teams/${teamId}/websites/${websiteId}`)); const { mutate, isPending } = useMutation({
mutationFn: () => del(`/teams/${teamId}/websites/${websiteId}`),
});
const handleRemoveTeamMember = async () => { const handleRemoveTeamMember = async () => {
await mutate(null, { mutate(null, {
onSuccess: () => { onSuccess: () => {
onSave(); onSave();
}, },
@ -16,7 +18,7 @@ export function TeamWebsiteRemoveButton({ teamId, websiteId, onSave }) {
}; };
return ( return (
<LoadingButton variant="quiet" onClick={() => handleRemoveTeamMember()} isLoading={isLoading}> <LoadingButton variant="quiet" onClick={() => handleRemoveTeamMember()} isLoading={isPending}>
<Icon> <Icon>
<Icons.Close /> <Icons.Close />
</Icon> </Icon>