Encountered two children with the same key, Objects are not valid as a React child

import React, { useState } from "react";
import { DatePicker } from "antd";
import BarChartsMonth from "./../../../components/BarCharts/Barchartmonth";
import BarChartsWeek from "./../../../components/BarCharts/Barchartweek";
import "antd/dist/antd.css";
import { Select } from "antd";


const TeamActivity = () => {
  const { MonthPicker, WeekPicker } = DatePicker;
  const handleChangeView = val => {
    setView(val);
  };
 
+++++++++++++++++++++++++++++++++++++++++++++++++++++
    const users = [
        { name: "Peter", surname: "Parker" },
        { name: "Edvard", surname: "Rykinozhnici" },
        { name: "Top", surname: "Ragnakek" },
        { name: "Pavel", surname: "Doorov" }
      ];
 
 ++++++++++++++++++++++++++++++++++++++++++++++++++++++
    const UsCollection = users.map((user,i)=> {
     return (
      <Option key={i} value > {user}</Option>
      
     )
    })
  
++++++++++++++++++++++++++++++++++++++++++++++++++++++
  const [view, setView] = useState("Month");

  return (
    <div className="activity-page">
      {" "}
      
      <div className="main-title">Activity of the team</div>
      <div className="wrapper-wrapper">
        <div className="sort-by">Sort by:</div>
        <div className="datepickers-wrapper">
          <MonthPicker onChange={(date, type) => handleChange(date, "month")} />
          <WeekPicker
            placeholder="Select week"
            onChange={(date, type) => handleChange(date, "week")}
          />
        </div>
        <div>
        <Select
    showSearch
    style={{ width: 200 }}
    placeholder="Select a person"
    optionFilterProp="children"
    filterOption={(input, option) =>
      option.props.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
    }
  >
    +++++++++++++++++++++++++++++++++++++++++
      {UsCollection}

+++++++++++++++++++++++++++++++
  </Select>
        </div>
      </div>
      <div className="container ">
        <h1 className="week-activity"> {view} activity</h1>
        <div className="changes-week-month">
          <form>
            <input
              type="radio"
              name="state"
              id="week-id"
              onClick={() => {
                handleChangeView("Week");
              }}
            />
            <label htmlFor="week-id"> Week </label>
            <input
              type="radio"
              name="state"
              id="month-id"
              defaultChecked={true}
              onClick={() => {
                handleChangeView("Month");
              }}
            />
            <label htmlFor="month-id"> Month </label>
          </form>
        </div>
        {view === "Month" ? <BarChartsMonth /> : <BarChartsWeek />}
      </div>
 
    </div>
  );
};

export default TeamActivity;