TodoListEnvelopeView Use Imperative Handle

TodoListEnvelopeView.tsx

import { useImperativeHandle } from "react";

export const TodoListEnvelopeView = React.forwardRef<TodoListEnvelopeViewApi, Props>((props, forwardedRef) => {
  // ...
  
  useImperativeHandle(
    forwardedRef,
    () => ({
      setUser,
      addItem: (item) => setItems([...items, { label: item, completed: false }]),
      getItems: () => items,
      markAllAsCompleted: () => setItems(items.map((item) => ({ ...item, completed: true }))),
    }),
    [items]
  );
  
  // ...
});