chore(deps): lock file maintenance

package.json

@@ -20,7 +20,7 @@
     "@emotion/styled": "^11.11.0",
     "@faker-js/faker": "^9.0.0",
     "@mitodl/smoot-design": "^1.1.1",
-    "@mitodl/unified-ecommerce-api-axios": "^2025.2.11",
+    "@mitodl/unified-ecommerce-api-axios": "^2025.4.18",
     "@mui/material": "^6.1.8",
     "@mui/material-nextjs": "^6.1.8",
     "@remixicon/react": "^4.2.0",

src/app/history/page.tsx

@@ -19,6 +19,7 @@ import { getCurrentSystem, getCurrentStatus } from "@/utils/system";
 import type {
   PaginatedOrderHistoryList,
   OrderHistory,
+  IntegratedSystem,
 } from "@mitodl/unified-ecommerce-api-axios/v0";
 import { usePaymentsOrderHistory } from "@/services/ecommerce/payments/hooks";
 import { useMetaIntegratedSystemsList } from "@/services/ecommerce/meta/hooks";
@@ -158,7 +159,7 @@ const OrderHistory: React.FC = () => {
         accessorFn: (row: OrderHistory) => {
           const systemId = row.lines[0]?.product.system;
           const system = integratedSystemList.data?.results.find(
-            (sys) => sys.id === systemId,
+            (sys: IntegratedSystem) => sys.id === systemId,
           );
           return system ? system.name : "N/A";
         },

src/app/page.tsx

@@ -184,7 +184,7 @@ const Cart: React.FC<CartProps> = ({ system }) => {
         system_slug: selectedSystem?.slug ?? "",
       });
 
-      if (response && response.id) {
+      if (response && Object.hasOwn(response, "id")) {
         setRefreshKey((prev) => prev + 1); // Increment refreshKey to trigger updates
       }
     } catch (error) {
@@ -215,7 +215,7 @@ const Cart: React.FC<CartProps> = ({ system }) => {
             onChange={(e) => setSelectedProductId(Number(e.target.value))}
           >
             <option value="">Select a product</option>
-            {products.data.results.map((product) => (
+            {products.data.results.map((product: Product) => (
               <option key={product.id} value={product.id}>
                 {product.name}
               </option>

src/app/receipt/page.tsx

@@ -13,16 +13,20 @@ import {
   TableRow,
   TableCell,
   TableBody,
-  Grid,
+  Grid2,
 } from "@mui/material";
+import { OrderHistory } from "@mitodl/unified-ecommerce-api-axios/v0";
 
 const Receipt: React.FC = () => {
   const searchParams = useSearchParams();
   const orderParam = searchParams.get("order");
   const orderId = orderParam ? Number(orderParam) : null;
 
   const { mutateAsync: fetchOrder, data: order } =
-    usePayementsOrdersHistoryRetrieve();
+    usePayementsOrdersHistoryRetrieve() as {
+      mutateAsync: (id: number) => Promise<void>;
+      data: OrderHistory | undefined;
+    };
 
   const [hasFetched, setHasFetched] = useState(false);
 
@@ -145,8 +149,8 @@ const Receipt: React.FC = () => {
             </TableBody>
           </Table>
 
-          <Grid container spacing={2} sx={{ mt: 2 }}>
-            <Grid item xs={8}>
+          <Grid2 container spacing={2} sx={{ mt: 2 }}>
+            <Grid2 size={{ xs: 8 }}>
               {transaction && (
                 <>
                   <Typography variant="subtitle1">
@@ -164,8 +168,8 @@ const Receipt: React.FC = () => {
                   </Typography>
                 </>
               )}
-            </Grid>
-            <Grid item xs={4}>
+            </Grid2>
+            <Grid2 size={{ xs: 4 }}>
               <Typography variant="h6">Order Summary</Typography>
               <Typography>
                 <strong>Subtotal:</strong> ${subtotal.toFixed(2)}
@@ -179,8 +183,8 @@ const Receipt: React.FC = () => {
               <Typography>
                 <strong>Grand Total:</strong> ${grandTotal.toFixed(2)}
               </Typography>
-            </Grid>
-          </Grid>
+            </Grid2>
+          </Grid2>
         </div>
       </CardContent>
     </Card>

src/page-components/PlaceOrderButton/PlaceOrderButton.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import { Button, styled } from "@mitodl/smoot-design";
 import { usePaymentsCheckoutStartCheckout } from "@/services/ecommerce/payments/hooks";
+import type { CyberSourceCheckout } from "@mitodl/unified-ecommerce-api-axios/v0";
 
 type PlaceOrderButtonProps = {
   systemSlug: string;
@@ -14,9 +15,9 @@ const PlaceOrderButton: React.FC<PlaceOrderButtonProps> = ({ systemSlug }) => {
   const checkoutMutation = usePaymentsCheckoutStartCheckout();
 
   const handleClick = async () => {
-    const checkout = await checkoutMutation.mutateAsync({
+    const checkout = (await checkoutMutation.mutateAsync({
       system_slug: systemSlug,
-    });
+    })) as CyberSourceCheckout;
 
     // Construct the form based on the data we got back, then submit it.
 

src/services/ecommerce/client.ts

@@ -1,11 +1,7 @@
 import invariant from "tiny-invariant";
 import axios from "axios";
 
-import {
-  PaymentsApi,
-  UsersApi,
-  MetaApi,
-} from "@mitodl/unified-ecommerce-api-axios/v0";
+import { CommerceApi } from "@mitodl/unified-ecommerce-api-axios/v0";
 
 const BASE_PATH = process.env.NEXT_PUBLIC_UE_API_BASE_URL;
 invariant(BASE_PATH, "NEXT_PUBLIC_UE_API_BASE_URL is required.");
@@ -17,11 +13,11 @@ const instance = axios.create({
   xsrfHeaderName: "X-CSRFTOKEN",
 });
 
-const paymentsApi = new PaymentsApi(undefined, BASE_PATH, instance);
+const paymentsApi = new CommerceApi(undefined, BASE_PATH, instance);
 
-const usersApi = new UsersApi(undefined, BASE_PATH, instance);
+const usersApi = new CommerceApi(undefined, BASE_PATH, instance);
 
-const metaApi = new MetaApi(undefined, BASE_PATH, instance);
+const metaApi = new CommerceApi(undefined, BASE_PATH, instance);
 
 const devSameSiteCheck = () => {
   if (process.env.NODE_ENV === "development") {

src/services/ecommerce/meta/hooks.ts

@@ -5,7 +5,7 @@ const useMetaIntegratedSystemsList = () =>
   useQuery({
     queryKey: ["metaIntegratedSystems"],
     queryFn: async () => {
-      const response = await metaApi.metaIntegratedSystemList();
+      const response = await metaApi.commerceApiV0MetaIntegratedSystemList();
       return response.data;
     },
   });
@@ -14,7 +14,7 @@ const useMetaProductsList = (systemSlug: string) =>
   useQuery({
     queryKey: ["metaProducts"],
     queryFn: async () => {
-      const response = await metaApi.metaProductList({
+      const response = await metaApi.commerceApiV0MetaProductList({
         system__slug: systemSlug,
       });
       return response.data;

src/services/ecommerce/payments/hooks.ts

@@ -6,11 +6,12 @@ import {
 } from "@tanstack/react-query";
 import { paymentsApi } from "../client";
 import type {
-  PaymentsApiPaymentsBasketsListRequest,
-  PaymentsApiPaymentsBasketsCreateFromProductCreateRequest,
-  PaymentsApiPaymentsBasketsAddDiscountCreateRequest,
-  PaymentsApiPaymentsCheckoutCreateRequest,
+  CommerceApiCommerceApiV0PaymentsBasketsListRequest as PaymentsApiPaymentsBasketsListRequest,
+  CommerceApiCommerceApiV0PaymentsBasketsCreateFromProductCreateRequest as PaymentsApiPaymentsBasketsCreateFromProductCreateRequest,
+  CommerceApiCommerceApiV0PaymentsBasketsAddDiscountCreateRequest as PaymentsApiPaymentsBasketsAddDiscountCreateRequest,
+  CommerceApiCommerceApiV0PaymentsCheckoutCreateRequest as PaymentsApiPaymentsCheckoutCreateRequest,
 } from "@mitodl/unified-ecommerce-api-axios/v0";
+import { AxiosResponse } from "axios";
 
 type ExtraQueryOpts = Omit<UseQueryOptions, "queryKey" | "queryFn">;
 
@@ -21,7 +22,8 @@ const usePaymentsBasketList = (
   useQuery({
     queryKey: ["paymentsBaskets", options],
     queryFn: async () => {
-      const response = await paymentsApi.paymentsBasketsList(options);
+      const response =
+        await paymentsApi.commerceApiV0PaymentsBasketsList(options);
       return response.data;
     },
     ...opts,
@@ -35,7 +37,9 @@ const usePaymentsBasketRetrieve = (
   return useQuery({
     queryKey: queryKey || ["paymentsBaskets", id], // Use queryKey from opts or default
     queryFn: async () => {
-      const response = await paymentsApi.paymentsBasketsRetrieve({ id });
+      const response = await paymentsApi.commerceApiV0PaymentsBasketsRetrieve({
+        id,
+      });
       return response.data;
     },
     ...restOpts, // Spread the remaining options
@@ -48,8 +52,8 @@ const usePaymentsBasketitemsDestroy = () => {
   return useMutation({
     mutationFn: (id: number) =>
       paymentsApi
-        .paymentsBasketitemsDestroy({ id })
-        .then((response) => response.data),
+        .commerceApiV0PaymentsBasketitemsDestroy({ id })
+        .then((response: AxiosResponse) => response.data),
     onSuccess: () => {
       client.invalidateQueries({ queryKey: ["paymentsBaskets"] });
     },
@@ -62,10 +66,10 @@ const usePaymentsBasketsClearDestroy = () => {
   return useMutation({
     mutationFn: (systemSlug: string) =>
       paymentsApi
-        .paymentsBasketsClearDestroy({
+        .commerceApiV0PaymentsBasketsClearDestroy({
           system_slug: systemSlug,
         })
-        .then((response) => response.data),
+        .then((response: AxiosResponse) => response.data),
     onSuccess: () => {
       client.invalidateQueries({ queryKey: ["paymentsBaskets"] });
     },
@@ -79,8 +83,8 @@ const usePaymentsBasketCreateFromProduct = () => {
       slugAndSku: PaymentsApiPaymentsBasketsCreateFromProductCreateRequest,
     ) =>
       paymentsApi
-        .paymentsBasketsCreateFromProductCreate(slugAndSku)
-        .then((response) => response.data),
+        .commerceApiV0PaymentsBasketsCreateFromProductCreate(slugAndSku)
+        .then((response: AxiosResponse) => response.data),
     onSuccess: (_data) => {
       client.invalidateQueries({ queryKey: ["paymentsBaskets", _data] });
     },
@@ -92,8 +96,8 @@ const usePaymentsBasketAddDiscount = () => {
   return useMutation({
     mutationFn: (request: PaymentsApiPaymentsBasketsAddDiscountCreateRequest) =>
       paymentsApi
-        .paymentsBasketsAddDiscountCreate(request)
-        .then((response) => response.data),
+        .commerceApiV0PaymentsBasketsAddDiscountCreate(request)
+        .then((response: AxiosResponse) => response.data),
     onSuccess: (_data) => {
       client.invalidateQueries({ queryKey: ["paymentsBaskets", _data] });
     },
@@ -104,16 +108,17 @@ const usePaymentsCheckoutStartCheckout = () => {
   return useMutation({
     mutationFn: (request: PaymentsApiPaymentsCheckoutCreateRequest) =>
       paymentsApi
-        .paymentsCheckoutCreate(request)
-        .then((response) => response.data),
+        .commerceApiV0PaymentsCheckoutCreate(request)
+        .then((response: AxiosResponse) => response.data),
   });
 };
 
 const usePaymentsOrderHistory = (opts: ExtraQueryOpts = {}) =>
   useQuery({
     queryKey: ["paymentsOrders"],
     queryFn: async () => {
-      const response = await paymentsApi.paymentsOrdersHistoryList();
+      const response =
+        await paymentsApi.commerceApiV0PaymentsOrdersHistoryList();
       return response.data;
     },
     ...opts,
@@ -123,8 +128,8 @@ const usePayementsOrdersHistoryRetrieve = () => {
   return useMutation({
     mutationFn: (id: number) =>
       paymentsApi
-        .paymentsOrdersHistoryRetrieve({ id })
-        .then((response) => response.data),
+        .commerceApiV0PaymentsOrdersHistoryRetrieve({ id })
+        .then((response: AxiosResponse) => response.data),
   });
 };
 

src/services/ecommerce/users/hooks.ts

@@ -5,7 +5,7 @@ const users = {
   me: {
     queryKey: ["users", "me"],
     queryFn: async () => {
-      const response = await usersApi.usersMeRetrieve();
+      const response = await usersApi.commerceApiV0UsersMeRetrieve();
       return response.data;
     },
   },