is there a way to filter an array of objects based on multiple checkbox values on checked change

I Have this array I wants to filter based on checkbox checked values Using React.

const invoice = [
  {
    id: "RT3080",
    createdAt: "2021-08-18",
    paymentDue: "2021-08-19",
    description: "Re-branding",
    paymentTerms: 1,
    clientName: "Jensen Huang",
    clientEmail: "jensenh@mail.com",
    status: "paid",
  },
  {
    id: "XM9141",
    createdAt: "2021-08-21",
    paymentDue: "2021-09-20",
    description: "Graphic Design",
    paymentTerms: 30,
    clientName: "Alex Grim",
    clientEmail: "alexgrim@mail.com",
    status: "pending",
  },
  {
    id: "RG0314",
    createdAt: "2021-09-24",
    paymentDue: "2021-10-01",
    description: "Website Redesign",
    paymentTerms: 7,
    clientName: "John Morrison",
    clientEmail: "jm@myco.com",
    status: "paid",
  },
  {
    id: "TY9141",
    createdAt: "2021-10-01",
    paymentDue: "2021-10-31",
    description: "Landing Page Design",
    paymentTerms: 30,
    clientName: "Thomas Wayne",
    clientEmail: "thomas@dc.com",
    status: "pending",
  },
  {
    id: "FV2353",
    createdAt: "2021-11-05",
    paymentDue: "2021-11-12",
    description: "Logo Re-design",
    paymentTerms: 7,
    clientName: "Anita Wainwright",
    clientEmail: "",
    status: "draft",
  },
];

I set up a useState as an object to store the objects i want to filter with which is this

 const [check, setcheck] = useState({
    paid: false,
    pend: false,
    draft: false,
  });

Then I added an onchange event handler to each checkbox that I created

<input
  checked={check.pend}
  onChange={(e) => onChange(e)}
  type="checkbox"
  name="pend"
  value="pending"
/>;

<input
  checked={check.draft}
  onChange={(e) => onChange(e)}
  type="checkbox"
  name="draft"
  value="draft"
/>;

<input
  checked={check.paid}
  onChange={(e) => onChange(e)}
  type="checkbox"
  name="paid"
  value="paid"
/>;

The onChange event handler below

 const onChange = (e) => {
    setcheck({ ...check, [e.target.name]: e.target.checked });
  };

so the problem is this, I wanna filter the array of objects using the checkbox checked values i.e if the onChange is triggered i wanna run a function that will filter the array and return only where the status === checked checkbox value.

so i created an handleChange function which i later added to onchange function. so the function now looks like this

const onChange = (e) => {
    setcheck({ ...check, [e.target.name]: e.target.checked });
    handleChange(e);
  };

and the handleChange function it self

  const handleChange = (e) => {
    let tempInvoice = [...invoice];

    if (e.target.name === "pend" && e.target.checked === true) {
      tempInvoice = tempInvoice.filter((inv) => {
        return inv.status === e.target.value;
      });
    }
    if (e.target.name === "paid" && e.target.checked === true) {
      tempInvoice = tempInvoice.filter((inv) => inv.status === e.target.value);
    }
    if (e.target.name === "draft" && e.target.checked === true) {
      tempInvoice = tempInvoice.filter((inv) => inv.status === e.target.value);
    }
console.log(tempInvoice);
  };

With the Above information provided, my tempInvoice only logs out newly curent checked items. i.e if I checked the draft checkbox, it would only return array that has the status.draft . if I checked both draft and paid, It would only return the Array that has Paid in it and not both. and I want this functionalities to work in a way that if I check both draft and paid. It should only return Array that the status of paid and draft.