This video is available to students only

Displaying the new data

Configuring the grid to show the geographic data

Displaying the new data#

Now we can modify the client to fetch data from the new endpoint and display the results.

Column definitions#

Back in App.tsx, replace the existing columnDefs mapping with a mapper function and add a mapping for the UN/LOCODE dataset.

Change the fields prop in the QueryBuilder component to read the correct fields from the fields records.

Add a state variable to hold the UN/LOCODE data and use it in the AG Grid configuration.

We don't need to add a new getOperators method. We can simply modify the existing one to accommodate the new fields. Add case "date": to the group of case statements for date fields, add another group of case statements for the Boolean fields, and add "id", "latitude", and "longitude" to the group of case statements for numeric fields.

No discussions yet