How to import data correctly?

Question

JavaScript

Import data and pass to components:

import React from 'react';
import ReactDOM from 'react-dom';
import App from './components/app/App';
import { tickets } from './data/tickets.json';

ReactDOM.render(
  <React.StrictMode>
    <App tickets={tickets} />
  </React.StrictMode>,
  document.getElementById('root')
);

The data is displayed in cards, but an error was displayed in the console:

ERROR in ./src/index.tsx 11:13-20
Should not import the named export 'tickets' (imported as 'tickets') from default-exporting module (only default export is available soon)

How should I import the data correctly so that no errors are displayed?