From e2f7566783c5019635203d972c3de6590cd1dd71 Mon Sep 17 00:00:00 2001 From: Patrick Fic Date: Mon, 13 Jul 2020 16:14:49 -0700 Subject: [PATCH] Fixed vehicle and owner pages with transition prevention. BOD-127 --- ...ntract-license-decode-button.component.jsx | 1 - .../owner-detail-form.container.jsx | 35 ++++++++++++------- .../owners-list/owners-list.component.jsx | 6 ++-- .../tech-sider/tech-sider.component.jsx | 4 +-- .../vehicle-detail-form.container.jsx | 33 +++++++++++------ .../vehicles-list/vehicles-list.component.jsx | 7 ++-- 6 files changed, 55 insertions(+), 31 deletions(-) diff --git a/client/src/components/contract-license-decode-button/contract-license-decode-button.component.jsx b/client/src/components/contract-license-decode-button/contract-license-decode-button.component.jsx index 9673c560a..3a0fddea5 100644 --- a/client/src/components/contract-license-decode-button/contract-license-decode-button.component.jsx +++ b/client/src/components/contract-license-decode-button/contract-license-decode-button.component.jsx @@ -3,7 +3,6 @@ import moment from "moment"; import React, { useState } from "react"; import { useTranslation } from "react-i18next"; import aamva from "../../utils/aamva"; -import aamva_npm from "aamva"; import DataLabel from "../data-label/data-label.component"; import LoadingSkeleton from "../loading-skeleton/loading-skeleton.component"; diff --git a/client/src/components/owner-detail-form/owner-detail-form.container.jsx b/client/src/components/owner-detail-form/owner-detail-form.container.jsx index 559a7dba1..00d1df689 100644 --- a/client/src/components/owner-detail-form/owner-detail-form.container.jsx +++ b/client/src/components/owner-detail-form/owner-detail-form.container.jsx @@ -11,26 +11,37 @@ function OwnerDetailFormContainer({ owner, refetch }) { const [updateOwner] = useMutation(UPDATE_OWNER); - const handleFinish = (values) => { - updateOwner({ + const handleFinish = async (values) => { + const result = await updateOwner({ variables: { ownerId: owner.id, owner: values }, - }).then((r) => { - notification["success"]({ - message: t("owners.successes.save"), - }); - //TODO Better way to reset the field decorators? - if (refetch) refetch().then(); - // resetFields(); }); + + if (!!result.errors) { + notification["error"]({ + message: t("owners.errors.saving", { + message: JSON.stringify(result.errors), + }), + }); + return; + } + + notification["success"]({ + message: t("owners.successes.save"), + }); + + if (refetch) await refetch(); + form.resetFields(); + form.resetFields(); }; return (
+ autoComplete="off" + layout="vertical" + initialValues={owner} + > ); diff --git a/client/src/components/owners-list/owners-list.component.jsx b/client/src/components/owners-list/owners-list.component.jsx index a1cdb408e..23bfbbf98 100644 --- a/client/src/components/owners-list/owners-list.component.jsx +++ b/client/src/components/owners-list/owners-list.component.jsx @@ -5,7 +5,6 @@ import React, { useState } from "react"; import { useTranslation } from "react-i18next"; import { Link, useHistory, useLocation } from "react-router-dom"; import PhoneFormatter from "../../utils/PhoneFormatter"; -import { alphaSort } from "../../utils/sorters"; export default function OwnersListComponent({ loading, @@ -14,7 +13,10 @@ export default function OwnersListComponent({ refetch, }) { const search = queryString.parse(useLocation().search); - const { page, sortcolumn, sortorder } = search; + const { + page, + // sortcolumn, sortorder + } = search; const history = useHistory(); const [state, setState] = useState({ diff --git a/client/src/components/tech-sider/tech-sider.component.jsx b/client/src/components/tech-sider/tech-sider.component.jsx index 06e714358..248ee927a 100644 --- a/client/src/components/tech-sider/tech-sider.component.jsx +++ b/client/src/components/tech-sider/tech-sider.component.jsx @@ -3,12 +3,12 @@ import { Layout, Menu } from "antd"; import React, { useState } from "react"; import { useTranslation } from "react-i18next"; import { FiLogIn, FiLogOut } from "react-icons/fi"; -import { MdTimer, MdTimerOff } from "react-icons/md"; +import { MdTimer } from "react-icons/md"; import { connect } from "react-redux"; import { Link } from "react-router-dom"; import { createStructuredSelector } from "reselect"; -import { selectTechnician } from "../../redux/tech/tech.selectors"; import { techLogout } from "../../redux/tech/tech.actions"; +import { selectTechnician } from "../../redux/tech/tech.selectors"; const { Sider } = Layout; const mapStateToProps = createStructuredSelector({ diff --git a/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx b/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx index 4b41cc4cf..7fbfb2eb5 100644 --- a/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx +++ b/client/src/components/vehicle-detail-form/vehicle-detail-form.container.jsx @@ -11,28 +11,39 @@ function VehicleDetailFormContainer({ vehicle, refetch }) { const [updateVehicle] = useMutation(UPDATE_VEHICLE); const [form] = Form.useForm(); - const handleFinish = (values) => { - updateVehicle({ + const handleFinish = async (values) => { + const result = await updateVehicle({ variables: { vehId: vehicle.id, vehicle: values }, - }).then((r) => { - notification["success"]({ - message: t("vehicles.successes.save"), - }); - //TODO Better way to reset the field decorators? - if (refetch) refetch(); }); + + if (!!result.errors) { + notification["error"]({ + message: t("vehicles.errors.saving", { + message: JSON.stringify(result.errors), + }), + }); + } + + notification["success"]({ + message: t("vehicles.successes.save"), + }); + //TODO Better way to reset the field decorators? + if (refetch) await refetch(); + form.resetFields(); + form.resetFields(); }; return (
+ }} + > ); diff --git a/client/src/components/vehicles-list/vehicles-list.component.jsx b/client/src/components/vehicles-list/vehicles-list.component.jsx index 7cbf5a1f1..0b4ee3162 100644 --- a/client/src/components/vehicles-list/vehicles-list.component.jsx +++ b/client/src/components/vehicles-list/vehicles-list.component.jsx @@ -4,8 +4,6 @@ import queryString from "query-string"; import React, { useState } from "react"; import { useTranslation } from "react-i18next"; import { Link, useHistory, useLocation } from "react-router-dom"; -import { alphaSort } from "../../utils/sorters"; - export default function VehiclesListComponent({ loading, vehicles, @@ -13,7 +11,10 @@ export default function VehiclesListComponent({ refetch, }) { const search = queryString.parse(useLocation().search); - const { page, sortcolumn, sortorder } = search; + const { + page, + //sortcolumn, sortorder + } = search; const history = useHistory(); const [state, setState] = useState({