import { observer } from "mobx-react-lite";
import SiteYellItem from "src/site/SiteYellItem";
import { useSiteStore } from "src/Stores";
import { OnSiteYellInput } from "src/site/Site";

export default observer(
  ({ onSiteYellInput }: { onSiteYellInput: OnSiteYellInput }) => {
    const { siteYells } = useSiteStore();

    return (
      <>
        {siteYells.map((siteYell) =>
          siteYell ? (
            <SiteYellItem
              key={siteYell.siteYellID}
              data={siteYell}
              onSiteYellInput={onSiteYellInput}
            />
          ) : null,
        )}
      </>
    );
  },
);