fix(vendor & customer): floting action.

This commit is contained in:
elforjani3
2021-03-22 20:07:02 +02:00
parent aa6c3d5fe8
commit 407dce6923
5 changed files with 20 additions and 22 deletions

View File

@@ -84,7 +84,7 @@ function CustomerForm({
() => ({ () => ({
...defaultInitialValues, ...defaultInitialValues,
currency_code: baseCurrency, currency_code: baseCurrency,
...transformToForm(customer || contactDuplicate, defaultInitialValues), ...transformToForm(contactDuplicate || customer, defaultInitialValues),
}), }),
[customer, contactDuplicate, baseCurrency], [customer, contactDuplicate, baseCurrency],
); );

View File

@@ -57,7 +57,6 @@ function CustomerFormProvider({ customerId, ...props }) {
return ( return (
<DashboardInsider <DashboardInsider
loading={ loading={
isCustomerLoading ||
isCustomerLoading || isCustomerLoading ||
isCurrenciesLoading || isCurrenciesLoading ||
isContactLoading isContactLoading

View File

@@ -25,7 +25,7 @@ export default function VendorFloatingActions() {
const { resetForm, isSubmitting, submitForm } = useFormikContext(); const { resetForm, isSubmitting, submitForm } = useFormikContext();
// Vendor form context. // Vendor form context.
const { vendor, setSubmitPayload } = useVendorFormContext(); const { isNewMode, setSubmitPayload } = useVendorFormContext();
// History. // History.
const history = useHistory(); const history = useHistory();
@@ -62,7 +62,7 @@ export default function VendorFloatingActions() {
intent={Intent.PRIMARY} intent={Intent.PRIMARY}
type="submit" type="submit"
onClick={handleSubmitBtnClick} onClick={handleSubmitBtnClick}
text={vendor ? <T id={'edit'} /> : <T id={'save'} />} text={!isNewMode ? <T id={'edit'} /> : <T id={'save'} />}
/> />
<Popover <Popover
content={ content={
@@ -89,7 +89,7 @@ export default function VendorFloatingActions() {
className={'ml1'} className={'ml1'}
disabled={isSubmitting} disabled={isSubmitting}
onClick={handleClearBtnClick} onClick={handleClearBtnClick}
text={vendor ? <T id={'reset'} /> : <T id={'clear'} />} text={!isNewMode ? <T id={'reset'} /> : <T id={'clear'} />}
/> />
{/* ----------- Cancel ----------- */} {/* ----------- Cancel ----------- */}
<Button <Button

View File

@@ -78,9 +78,10 @@ function VendorForm({
editVendorMutate, editVendorMutate,
setSubmitPayload, setSubmitPayload,
submitPayload, submitPayload,
isNewMode,
} = useVendorFormContext(); } = useVendorFormContext();
const isNewMode = !vendorId; // const isNewMode = !vendorId;
// History context. // History context.
const history = useHistory(); const history = useHistory();
@@ -94,17 +95,11 @@ function VendorForm({
() => ({ () => ({
...defaultInitialValues, ...defaultInitialValues,
currency_code: baseCurrency, currency_code: baseCurrency,
...transformToForm(vendor || contactDuplicate, defaultInitialValues), ...transformToForm(contactDuplicate || vendor, defaultInitialValues),
}), }),
[vendor, contactDuplicate, baseCurrency], [vendor, contactDuplicate, baseCurrency],
); );
useEffect(() => {
!isNewMode
? changePageTitle(formatMessage({ id: 'edit_vendor' }))
: changePageTitle(formatMessage({ id: 'new_vendor' }));
}, [changePageTitle, isNewMode, formatMessage]);
// Handles the form submit. // Handles the form submit.
const handleFormSubmit = ( const handleFormSubmit = (
values, values,
@@ -136,10 +131,10 @@ function VendorForm({
setSubmitting(false); setSubmitting(false);
}; };
if (vendor && vendor.id) { if (isNewMode) {
editVendorMutate([vendor.id, requestForm]).then(onSuccess).catch(onError);
} else {
createVendorMutate(requestForm).then(onSuccess).catch(onError); createVendorMutate(requestForm).then(onSuccess).catch(onError);
} else {
editVendorMutate([vendor.id, requestForm]).then(onSuccess).catch(onError);
} }
}; };

View File

@@ -19,6 +19,8 @@ const VendorFormContext = createContext();
function VendorFormProvider({ vendorId, ...props }) { function VendorFormProvider({ vendorId, ...props }) {
const { state } = useLocation(); const { state } = useLocation();
const contactId = state?.action;
// Handle fetch Currencies data table // Handle fetch Currencies data table
const { data: currencies, isLoading: isCurrenciesLoading } = useCurrencies(); const { data: currencies, isLoading: isCurrenciesLoading } = useCurrencies();
@@ -27,13 +29,11 @@ function VendorFormProvider({ vendorId, ...props }) {
enabled: !!vendorId, enabled: !!vendorId,
}); });
const contactId = state?.action;
// Handle fetch contact duplicate details. // Handle fetch contact duplicate details.
const { data: contactDuplicate, isLoading: isContactLoading } = useContact( const {
contactId, data: contactDuplicate,
{ enabled: !!contactId }, isLoading: isContactLoading,
); } = useContact(contactId, { enabled: !!contactId });
// Create and edit vendor mutations. // Create and edit vendor mutations.
const { mutateAsync: createVendorMutate } = useCreateVendor(); const { mutateAsync: createVendorMutate } = useCreateVendor();
@@ -42,12 +42,16 @@ function VendorFormProvider({ vendorId, ...props }) {
// Form submit payload. // Form submit payload.
const [submitPayload, setSubmitPayload] = useState({}); const [submitPayload, setSubmitPayload] = useState({});
// determines whether the form new or duplicate mode.
const isNewMode = contactId || !vendorId;
const provider = { const provider = {
vendorId, vendorId,
currencies, currencies,
vendor, vendor,
contactDuplicate: { ...omit(contactDuplicate, ['opening_balance_at']) }, contactDuplicate: { ...omit(contactDuplicate, ['opening_balance_at']) },
submitPayload, submitPayload,
isNewMode,
createVendorMutate, createVendorMutate,
editVendorMutate, editVendorMutate,