View and edit payments IO-531

client/src/components/payment-form/payment-form.component.jsx

@@ -13,7 +13,12 @@ const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop,
 });
 
-export function PaymentFormComponent({ form, stripeStateArr, bodyshop }) {
+export function PaymentFormComponent({
+  form,
+  stripeStateArr,
+  bodyshop,
+  disabled,
+}) {
   const [stripeState, setStripeState] = stripeStateArr;
 
   const { t } = useTranslation();
@@ -33,7 +38,7 @@ export function PaymentFormComponent({ form, stripeStateArr, bodyshop }) {
           },
         ]}
       >
-        <JobSearchSelect />
+        <JobSearchSelect disabled={disabled} />
       </Form.Item>
       <Form.Item
         label={t("payments.fields.amount")}
@@ -45,18 +50,18 @@ export function PaymentFormComponent({ form, stripeStateArr, bodyshop }) {
           },
         ]}
       >
-        <CurrencyInput />
+        <CurrencyInput disabled={disabled} />
       </Form.Item>
 
       <Form.Item
         label={t("payments.fields.transactionid")}
         name="transactionid"
       >
-        <Input />
+        <Input disabled={disabled} />
       </Form.Item>
 
       <Form.Item label={t("payments.fields.memo")} name="memo">
-        <Input />
+        <Input disabled={disabled} />
       </Form.Item>
 
       <Form.Item
@@ -69,7 +74,7 @@ export function PaymentFormComponent({ form, stripeStateArr, bodyshop }) {
           },
         ]}
       >
-        <Select>
+        <Select disabled={disabled}>
           <Select.Option value={t("payments.labels.customer")}>
             {t("payments.labels.customer")}
           </Select.Option>
@@ -89,7 +94,7 @@ export function PaymentFormComponent({ form, stripeStateArr, bodyshop }) {
           },
         ]}
       >
-        <Select>
+        <Select disabled={disabled}>
           <Select.Option value="Visa">Visa</Select.Option>
           <Select.Option value="Mastercard">Mastercard</Select.Option>
           <Select.Option value="AMEX">AMEX</Select.Option>
@@ -106,7 +111,7 @@ export function PaymentFormComponent({ form, stripeStateArr, bodyshop }) {
       >
         <Checkbox
           defaultChecked={!!bodyshop.stripe_acct_id}
-          disabled={!!!bodyshop.stripe_acct_id}
+          disabled={!!!bodyshop.stripe_acct_id || disabled}
         />
       </Form.Item>
 
@@ -115,7 +120,7 @@ export function PaymentFormComponent({ form, stripeStateArr, bodyshop }) {
         name="sendby"
         initialValue="email"
       >
-        <Radio.Group>
+        <Radio.Group disabled={disabled}>
           <Radio.Button value="email">{t("general.labels.email")}</Radio.Button>
           <Radio.Button value="print">{t("general.labels.print")}</Radio.Button>
         </Radio.Group>