Unusual "find" error in Typescript. Why ; is a problem?

Question

What is the problem with this find here?

let key = Object.keys(buyTicketData?.pricingOptions ?? {}).find(
  (key) =>
    buyTicketData?.pricingOptions?[key]?.name ===
    event.target.value
);

got this error:

ERROR in /Applications/MAMP/htdocs/wp-content/plugins/tikex/tikexModule/components/BuyTicket/PricingOptionInvoiceItemsFormFieldsCheckboxes.tsx
./tikexModule/components/BuyTicket/PricingOptionInvoiceItemsFormFieldsCheckboxes.tsx 196:16-17
[tsl] ERROR in /Applications/MAMP/htdocs/wp-content/plugins/tikex/tikexModule/components/BuyTicket/PricingOptionInvoiceItemsFormFieldsCheckboxes.tsx(196,17)
      TS1005: ':' expected.
 @ ./app/containers/Tiket/Test.tsx 2:0-148 36:88-133
 @ ./app/containers/Test.jsx 3:0-32 6:44-48
 @ ./app/shortcode35.js 8:0-46 14:54-63

and some interesting details, why ; is problem?

onents/BuyTicket/PricingOptionInvoiceItemsFormFieldsCheckboxes.tsx: Unexpected token (152:20)

  150 |                         event.target.value
  151 |                         :
> 152 |                     ;
      |                     ^
  153 |                 });
  154 |                 startPaymentIn2["pricingOptionId"] = key;
  155 |                 setStartPaymentIn(startPaymentIn2);
    at Object._raise (/Applications/MAMP/htdocs/wp-content/plugins/tikex/node_modules/@babel/parser/lib/index.js:816:17)

and the types:

export type BuyTicketData = {
  pricingOptions?: PricingOptions;
}

export type PricingOptions = {
  [optionId: string]: PricingOptionType;
};

Answer 1

You cannot have ?[] right next to each other. You have to put a . in between like this:

buyTicketData?.pricingOptions?.[key]?.name

See MDN