feature(expense)/ cost landed checkbox.

client/src/containers/Expenses/ExpenseForm/ExpenseForm.schema.js

@@ -8,9 +8,7 @@ const Schema = Yup.object().shape({
   payment_account_id: Yup.number()
     .required()
     .label(intl.get('payment_account_')),
-  payment_date: Yup.date()
-    .required()
-    .label(intl.get('payment_date_')),
+  payment_date: Yup.date().required().label(intl.get('payment_date_')),
   reference_no: Yup.string().min(1).max(DATATYPES_LENGTH.STRING).nullable(),
   currency_code: Yup.string()
     .nullable()
@@ -33,6 +31,7 @@ const Schema = Yup.object().shape({
           is: (amount) => !isBlank(amount),
           then: Yup.number().required(),
         }),
+      landed_cost: Yup.boolean(),
       description: Yup.string().max(DATATYPES_LENGTH.TEXT).nullable(),
     }),
   ),

client/src/containers/Expenses/ExpenseForm/components.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Button, Tooltip, Intent, Position } from '@blueprintjs/core';
+import { Button, Tooltip, Intent, Position, Checkbox } from '@blueprintjs/core';
 import { FormattedMessage as T } from 'components';
 import { Icon, Hint } from 'components';
 import intl from 'react-intl-universal';
@@ -49,6 +49,35 @@ const ActionsCellRenderer = ({
   );
 };
 
+/**
+ * Landed cost cell.
+ */
+const LandedCostCell = ({
+  row: { index },
+  column: { id },
+  cell: { value: initialValue },
+  data,
+  payload,
+}) => {
+  return (
+    <Tooltip content={''} position={Position.RIGHT}>
+      <Checkbox minimal={true} className="ml2" />
+    </Tooltip>
+  );
+};
+
+/**
+ * Landed cost header cell.
+ */
+const LandedCostHeaderCell = () => {
+  return (
+    <>
+      <T id={'cost'} />
+      <Hint content={''} />
+    </>
+  );
+};
+
 /**
  * Amount footer cell.
  */
@@ -114,6 +143,15 @@ export function useExpenseFormTableColumns() {
         className: 'description',
         width: 100,
       },
+      {
+        Header: LandedCostHeaderCell,
+        accessor: 'landed_cost',
+        Cell: LandedCostCell,
+        disableSortBy: true,
+        disableResizing: true,
+        width: 70,
+        className: 'landed_cost',
+      },
       {
         Header: '',
         accessor: 'action',

client/src/containers/Expenses/ExpenseForm/utils.js

@@ -27,6 +27,7 @@ export const defaultExpenseEntry = {
   amount: '',
   expense_account_id: '',
   description: '',
+  landed_cost: false,
 };
 
 export const defaultExpense = {