Connect the Import Control

Use the prepared file input for importing a JSON backup.

Listen for a selected file and read its contents:

importInput.addEventListener("change", async () => {
  const file = importInput.files[0];

  if (!file) {
    return;
  }

  const text = await file.text();
  const importedTasks = JSON.parse(text);

  // Validate and apply importedTasks in the next step.
});

Keep the import control connected to the existing UI. There is no need to add a new visual component.

Checkpoint

Choose the JSON file you exported in the previous lesson and confirm that the file contents can be read without a browser error.