notifications.js

notifications.map(({ id, verb, data }) =>
  verb === "category_weak" ? (
    <NotificationsStatItem
      key={id}
      id={id}
      title={composeCategoryWeak(data)}
      recommendation={"Focus on your weak..."}
      level={"error"}
    />
  ) : verb === "common_mistake" ? (
    <NotificationsStatItem
      key={id}
      id={id}
      title={composeCommonMistake(data)}
      recommendation={"Focus on your weak..."}
      level={"error"}
    />
  ) : verb === "time_long" ? (
    <NotificationShopItem
      key={id}
      id={id}
      title={"You often solve tasks correctly, but too long."}
      recommendation={"Speed up your pace to keep within the real test time!"}
      leve={"error"}
    />
  ) : verb === "package_expiring" ? (
    <NotificationsStatItem
      key={id}
      id={id}
      title={"Your access to the package will expire soon!"}
      recommendation={"Focus on your weak..."}
      level={"error"}
    />
  ) : ... // итд, можно писать всё в той же очередности, что в это dictionary
);