[frontend] Update dependencies

CHANGELOG.md

@@ -66,11 +66,13 @@ release.
 * [FraudDetectionService] Updated Kotlin version and OTel dependencies
   ([#987](https://github.com/open-telemetry/opentelemetry-demo/pull/987))
 * [quoteservice] update php dependencies
-  ([#994](https://github.com/open-telemetry/opentelemetry-demo/issues/994))
+  ([#1009](https://github.com/open-telemetry/opentelemetry-demo/pull/1009))
 * [tests] Update trace-based tests run script
   ([#1018](https://github.com/open-telemetry/opentelemetry-demo/pull/1018))
 * [PaymentService] Update node to LTS version and bump deps
-  ([#1029](https://github.com/open-telemetry/opentelemetry-demo/issues/1029))
+  ([#1029](https://github.com/open-telemetry/opentelemetry-demo/pull/1029))
+* [frontend] Update dependencies
+  ([#1054](https://github.com/open-telemetry/opentelemetry-demo/pull/1054))
 
 ## 1.4.0
 

src/frontend/components/CartIcon/CartIcon.tsx

@@ -16,7 +16,7 @@ const CartIcon = () => {
   return (
     <>
       <S.CartIcon data-cy={CypressFields.CartIcon} onClick={() => setIsOpen(true)}>
-        <S.Icon src="/icons/Hipster_CartIcon.svg" alt="Cart icon" title="Cart" />
+        <S.Icon src="/icons/CartIcon.svg" alt="Cart icon" title="Cart" />
         {!!items.length && <S.ItemsCount data-cy={CypressFields.CartItemCount}>{items.length}</S.ItemsCount>}
       </S.CartIcon>
       <CartDropdown productList={items} isOpen={isOpen} onClose={() => setIsOpen(false)} />

src/frontend/components/CartItems/CartItems.tsx

@@ -2,7 +2,7 @@
 // SPDX-License-Identifier: Apache-2.0
 
 import { useMemo } from 'react';
-import { useQuery } from 'react-query';
+import { useQuery } from '@tanstack/react-query';
 import ApiGateway from '../../gateways/Api.gateway';
 import { Address, Money } from '../../protos/demo';
 import { useCurrency } from '../../providers/Currency.provider';

src/frontend/components/CheckoutForm/CheckoutForm.tsx

@@ -64,7 +64,7 @@ const CheckoutForm = ({ onSubmit }: IProps) => {
 
   return (
     <S.CheckoutForm
-      onSubmit={event => {
+      onSubmit={(event: { preventDefault: () => void; }) => {
         event.preventDefault();
         onSubmit({
           email,

src/frontend/components/CheckoutItem/CheckoutItem.tsx

@@ -52,7 +52,7 @@ const CheckoutItem = ({
         )}
       </S.ShippingData>
       <S.Status>
-        <Image src="/icons/Check.svg" alt="check" height="14px" width="16px" /> <span>Done</span>
+        <Image src="/icons/Check.svg" alt="check" height="14" width="16" /> <span>Done</span>
       </S.Status>
     </S.CheckoutItem>
   );

src/frontend/components/CurrencySwitcher/CurrencySwitcher.tsx

@@ -18,7 +18,7 @@ const CurrencySwitcher = () => {
         <S.SelectedConcurrency>{currencySymbol}</S.SelectedConcurrency>
         <S.Select
           name="currency_code"
-          onChange={event => setSelectedCurrency(event.target.value)}
+          onChange={(event: { target: { value: string; }; }) => setSelectedCurrency(event.target.value)}
           value={selectedCurrency}
           data-cy={CypressFields.CurrencySwitcher}
         >