feat: sponsor order details

.env.example

@@ -13,7 +13,7 @@ PUB_API_BASE_URL=
 OS_BASE_URL=
 SCOPES_BASE_REALM=${API_BASE_URL}
 PURCHASES_API_URL=https://purchases-api.dev.fnopen.com
-PURCHASES_API_SCOPES="purchases-show-medata/read purchases-show-medata/write show-form/read show-form/write customized-form/write customized-form/read carts/read carts/write purchases/read cart-notes/write payment/write payment-profile/read"
+PURCHASES_API_SCOPES="purchases-show-medata/read purchases-show-medata/write show-form/read show-form/write customized-form/write customized-form/read carts/read carts/write purchases/read purchases/write cart-notes/write payment/write payment-profile/read"
 SPONSOR_USERS_API_URL=https://sponsor-users-api.dev.fnopen.com
 SPONSOR_USERS_SCOPES="show-medata/read show-medata/write access-requests/read access-requests/write sponsor-users/read sponsor-users/write groups/read groups/write media-upload/write"
 EMAIL_SCOPES="clients/read templates/read templates/write emails/read"

package.json

@@ -92,7 +92,7 @@
     "moment": "^2.29.1",
     "moment-duration-format": "^2.3.2",
     "moment-timezone": "^0.5.33",
-    "openstack-uicore-foundation": "5.0.18-beta.1",
+    "openstack-uicore-foundation": "5.0.20-beta.4",
     "p-limit": "^6.1.0",
     "path-browserify": "^1.0.1",
     "postcss-loader": "^6.2.1",

src/actions/sponsor-actions.js

@@ -309,9 +309,9 @@ export const getSponsor = (sponsorId) => async (dispatch, getState) => {
   const params = {
     access_token: accessToken,
     expand:
-      "company,members,sponsorships,sponsorships.type,featured_event,extra_questions,extra_questions.values,lead_report_setting",
+      "company,members,sponsorships,sponsorships.type,sponsorships.type.type,featured_event,extra_questions,extra_questions.values,lead_report_setting",
     fields:
-      "featured_event.id,featured_event.title,sponsorships.id,sponsorships.type.id,sponsorships.type.type_id"
+      "featured_event.id,featured_event.title,sponsorships.id,sponsorships.type.id,sponsorships.type.type.id,sponsorships.type.type.name"
   };
 
   return getRequest(

src/actions/sponsor-cart-actions.js

@@ -50,6 +50,7 @@ export const SPONSOR_CART_NOTE_ADDED = "SPONSOR_CART_NOTE_ADDED";
 export const SPONSOR_CART_NOTE_UPDATED = "SPONSOR_CART_NOTE_UPDATED";
 export const SPONSOR_CART_NOTE_DELETED = "SPONSOR_CART_NOTE_DELETED";
 export const CART_STATUS_UPDATED = "CART_STATUS_UPDATED";
+export const SPONSOR_CART_REOPENED = "SPONSOR_CART_REOPENED";
 export const RECEIVE_PAYMENT_PROFILE = "RECEIVE_PAYMENT_PROFILE";
 export const OFFLINE_PAYMENT_CREATED = "OFFLINE_PAYMENT_CREATED";
 export const PAYMENT_INTENT_CREATED = "PAYMENT_INTENT_CREATED";
@@ -91,7 +92,7 @@ export const getSponsorCart =
 
     const params = {
       access_token: accessToken,
-      expand: "forms,forms.items,forms.items.type,forms.items.meta_fields,notes"
+      expand: "forms,forms.items,forms.items.type,forms.items.meta_fields,notes,fees"
     };
 
     if (filter.length > 0) {
@@ -473,7 +474,7 @@ export const checkoutCart = () => async (dispatch, getState) => {
 
   const params = {
     access_token: accessToken,
-    expand: "forms,forms.items,forms.items.type,forms.items.meta_fields,notes"
+    expand: "forms,forms.items,forms.items.type,forms.items.meta_fields,notes,fees"
   };
 
   return putRequest(
@@ -487,6 +488,31 @@ export const checkoutCart = () => async (dispatch, getState) => {
   });
 };
 
+export const reopenCart = () => async (dispatch, getState) => {
+  const { currentSummitState, currentSponsorState } = getState();
+  const { currentSummit } = currentSummitState;
+  const { entity: sponsor } = currentSponsorState;
+  const accessToken = await getAccessTokenSafely();
+
+  dispatch(startLoading());
+
+  const params = {
+    access_token: accessToken,
+    expand: "forms,forms.items,forms.items.type,forms.items.meta_fields,notes,fees"
+  };
+
+  return deleteRequest(
+    null,
+    createAction(SPONSOR_CART_REOPENED),
+    `${window.PURCHASES_API_URL}/api/v1/summits/${currentSummit.id}/sponsors/${sponsor.id}/carts/current/checkout`,
+    null,
+    snackbarErrorHandler
+  )(params)(dispatch)
+    .finally(() => {
+      dispatch(stopLoading());
+    });
+};
+
 export const payWithInvoice = () => async (dispatch, getState) => {
   const { currentSummitState, currentSponsorState, sponsorPageCartListState } =
     getState();

src/actions/sponsor-purchases-actions.js

@@ -14,18 +14,19 @@
 import {
   authErrorHandler,
   createAction,
+  deleteRequest,
   getRequest,
+  postRequest,
   putRequest,
-  deleteRequest,
   startLoading,
   stopLoading
 } from "openstack-uicore-foundation/lib/utils/actions";
 import T from "i18n-react/dist/i18n-react";
 import { escapeFilterValue, getAccessTokenSafely } from "../utils/methods";
 import {
   DEFAULT_CURRENT_PAGE,
-  DEFAULT_ORDER_DIR,
   DEFAULT_PER_PAGE,
+  DUMMY_ACTION,
   PURCHASE_STATUS
 } from "../utils/constants";
 import { snackbarErrorHandler, snackbarSuccessHandler } from "./base-actions";
@@ -34,14 +35,18 @@ export const REQUEST_SPONSOR_PURCHASES = "REQUEST_SPONSOR_PURCHASES";
 export const RECEIVE_SPONSOR_PURCHASES = "RECEIVE_SPONSOR_PURCHASES";
 export const SPONSOR_PURCHASE_STATUS_UPDATED =
   "SPONSOR_PURCHASE_STATUS_UPDATED";
+export const RECEIVE_SPONSOR_ORDER = "RECEIVE_SPONSOR_ORDER";
+export const CLEAR_SPONSOR_ORDER = "CLEAR_SPONSOR_ORDER";
+export const SPONSOR_CLIENT_ADDRESS_UPDATED = "SPONSOR_CLIENT_ADDRESS_UPDATED";
+export const SPONSOR_CLIENT_UPDATED = "SPONSOR_CLIENT_UPDATED";
 
 export const getSponsorPurchases =
   (
     term = "",
     page = DEFAULT_CURRENT_PAGE,
     perPage = DEFAULT_PER_PAGE,
-    order = "id",
-    orderDir = DEFAULT_ORDER_DIR
+    order = "created",
+    orderDir = -1
   ) =>
   async (dispatch, getState) => {
     const { currentSummitState, currentSponsorState } = getState();
@@ -168,3 +173,190 @@ export const rejectSponsorPurchase =
         dispatch(stopLoading());
       });
   };
+
+export const getSponsorOrder = (orderId) => async (dispatch, getState) => {
+  const { currentSummitState, currentSponsorState } = getState();
+  const { currentSummit } = currentSummitState;
+  const { entity: sponsor } = currentSponsorState;
+  const accessToken = await getAccessTokenSafely();
+
+  dispatch(startLoading());
+
+  const params = {
+    access_token: accessToken,
+    expand:
+      "forms,forms.items,forms.items.meta_fields,forms.items.type,refunds,payments,notes,fees"
+  };
+
+  return getRequest(
+    null,
+    createAction(RECEIVE_SPONSOR_ORDER),
+    `${window.PURCHASES_API_URL}/api/v2/summits/${currentSummit.id}/sponsors/${sponsor.id}/purchases/${orderId}`,
+    authErrorHandler
+  )(params)(dispatch).finally(() => {
+    dispatch(stopLoading());
+  });
+};
+
+export const clearSponsorOrder = () => async (dispatch) => {
+  dispatch(createAction(CLEAR_SPONSOR_ORDER)({}));
+};
+
+export const updateClientAddress =
+  (orderId, address) => async (dispatch, getState) => {
+    const { currentSummitState, currentSponsorState } = getState();
+    const { currentSummit } = currentSummitState;
+    const { entity: sponsor } = currentSponsorState;
+    const accessToken = await getAccessTokenSafely();
+
+    dispatch(startLoading());
+
+    const params = {
+      access_token: accessToken
+    };
+
+    return putRequest(
+      null,
+      createAction(SPONSOR_CLIENT_ADDRESS_UPDATED),
+      `${window.PURCHASES_API_URL}/api/v1/summits/${currentSummit.id}/sponsors/${sponsor.id}/purchases/${orderId}/address`,
+      address,
+      snackbarErrorHandler
+    )(params)(dispatch)
+      .then(() => {
+        dispatch(
+          snackbarSuccessHandler({
+            title: T.translate("general.success"),
+            html: T.translate(
+              "edit_sponsor.purchase_tab.order_details.address_updated"
+            )
+          })
+        );
+      })
+      .finally(() => {
+        dispatch(stopLoading());
+      });
+  };
+
+export const updateClientInfo =
+  (orderId, client) => async (dispatch, getState) => {
+    const { currentSummitState, currentSponsorState } = getState();
+    const { currentSummit } = currentSummitState;
+    const { entity: sponsor } = currentSponsorState;
+    const accessToken = await getAccessTokenSafely();
+
+    dispatch(startLoading());
+
+    const params = {
+      access_token: accessToken
+    };
+
+    return putRequest(
+      null,
+      createAction(SPONSOR_CLIENT_UPDATED),
+      `${window.PURCHASES_API_URL}/api/v1/summits/${currentSummit.id}/sponsors/${sponsor.id}/purchases/${orderId}/client`,
+      client,
+      snackbarErrorHandler
+    )(params)(dispatch)
+      .then(() => {
+        dispatch(
+          snackbarSuccessHandler({
+            title: T.translate("general.success"),
+            html: T.translate(
+              "edit_sponsor.purchase_tab.order_details.client_updated"
+            )
+          })
+        );
+      })
+      .finally(() => {
+        dispatch(stopLoading());
+      });
+  };
+
+export const cancelSponsorForm =
+  (orderId, lineId) => async (dispatch, getState) => {
+    const { currentSummitState, currentSponsorState } = getState();
+    const { currentSummit } = currentSummitState;
+    const { entity: sponsor } = currentSponsorState;
+    const accessToken = await getAccessTokenSafely();
+
+    const params = {
+      access_token: accessToken
+    };
+
+    dispatch(startLoading());
+
+    return deleteRequest(
+      null,
+      createAction(DUMMY_ACTION),
+      `${window.PURCHASES_API_URL}/api/v1/summits/${currentSummit.id}/sponsors/${sponsor.id}/purchases/${orderId}/lines/${lineId}/cancel`,
+      null,
+      snackbarErrorHandler
+    )(params)(dispatch)
+      .then(() => dispatch(getSponsorOrder(orderId)))
+      .catch(console.log) // need to catch promise reject
+      .finally(() => {
+        dispatch(stopLoading());
+      });
+  };
+
+export const undoCancelSponsorForm =
+  (orderId, lineId) => async (dispatch, getState) => {
+    const { currentSummitState, currentSponsorState } = getState();
+    const { currentSummit } = currentSummitState;
+    const { entity: sponsor } = currentSponsorState;
+    const accessToken = await getAccessTokenSafely();
+
+    dispatch(startLoading());
+
+    const params = {
+      access_token: accessToken
+    };
+
+    return putRequest(
+      null,
+      createAction(DUMMY_ACTION),
+      `${window.PURCHASES_API_URL}/api/v1/summits/${currentSummit.id}/sponsors/${sponsor.id}/purchases/${orderId}/lines/${lineId}/cancel`,
+      {},
+      snackbarErrorHandler
+    )(params)(dispatch)
+      .then(() => dispatch(getSponsorOrder(orderId)))
+      .finally(() => {
+        dispatch(stopLoading());
+      });
+  };
+
+export const refundSponsorOrder =
+  (orderId, amount, reason) => async (dispatch, getState) => {
+    const { currentSummitState, currentSponsorState } = getState();
+    const { currentSummit } = currentSummitState;
+    const { entity: sponsor } = currentSponsorState;
+    const accessToken = await getAccessTokenSafely();
+
+    dispatch(startLoading());
+
+    const params = {
+      access_token: accessToken
+    };
+
+    return postRequest(
+      null,
+      createAction(DUMMY_ACTION),
+      `${window.PURCHASES_API_URL}/api/v1/summits/${currentSummit.id}/sponsors/${sponsor.id}/purchases/${orderId}/refunds`,
+      { amount, notes: reason },
+      snackbarErrorHandler
+    )(params)(dispatch)
+      .then(() => {
+        dispatch(
+          snackbarSuccessHandler({
+            title: T.translate("general.success"),
+            html: T.translate(
+              "edit_sponsor.purchase_tab.order_details.order_refunded"
+            )
+          })
+        );
+        dispatch(getSponsorOrder(orderId));
+      })
+      .finally(() => {
+        dispatch(stopLoading());
+      });
+  };

src/components/CustomTheme.js

@@ -34,6 +34,11 @@ const theme = createTheme({
       fontSize: "12px",
       fontWeight: 400
     },
+    subtitle2: ({ theme }) => ({
+      fontSize: "14px",
+      fontWeight: 500,
+      color: theme.palette.text.primary
+    }),
     h4: {
       fontSize: "34px",
       fontWeight: 500,
@@ -70,12 +75,24 @@ const theme = createTheme({
     },
     MuiButton: {
       styleOverrides: {
-        root: {
-          fontSize: "14px",
+        root: ({ ownerState }) => ({
           fontWeight: 500,
-          lineHeight: "20px",
-          padding: "10px 20px"
-        }
+          ...(ownerState.size === "small" && {
+            fontSize: "13px",
+            lineHeight: "18px",
+            padding: "9px 16px"
+          }),
+          ...(ownerState.size === "medium" && {
+            fontSize: "14px",
+            lineHeight: "20px",
+            padding: "10px 20px"
+          }),
+          ...(ownerState.size === "large" && {
+            fontSize: "16px",
+            lineHeight: "22px",
+            padding: "12px 24px"
+          })
+        })
       }
     },
     MuiTab: {