Show and Hide event with checkboxes Fullcalendar6

My events have a extendedProps, "nomeUtente" that it indicate the user that save the event and in my calendar I have these 2 checkboxes:

When the first one is checked it should show only the events with the same nomeUtente (the one next to the name event: "domizianaD", "raffaellaA") as the current session User and when the second one is checked it show all the events (even the one with different nomeUtente) and viceversa when their are not checked.

Also, events has a different color based on the type ("Normali", "Malattia", "Ferie"),as you can see in the screenshot above

I did it like this:

eventDidMount: function(info) {
const title = info.event.title;
const nomeUtente = info.event.extendedProps.nomeUtente;
const sessionUser = $("#nomeUtente").data('value');
if (nomeUtente){
if (title == "Normali") {
info.event.setProp("backgroundColor", "#FB6B4C");
} else if (title == "Straordinarie") {
info.event.setProp("backgroundColor", "#C8FC0C");
} else if (title == "Ferie") {
info.event.setProp("backgroundColor", "#EC1C28");
} else if (title == "Malattia") {
info.event.setProp("backgroundColor", "#FFB404");;
} else if (title == "Permesso") {
info.event.setProp("backgroundColor", "#A0ACDC");
} else if (title == "Smart Working") {
info.event.setProp("backgroundColor", "#08ACC4");
} else if (title == "Trasferta") {
info.event.setProp("backgroundColor", "#00897B");
} else if (title == "Assenza non retribuita") {
info.event.setProp("backgroundColor", "#F8D2D7");
} else if (title == "Altro") {
info.event.setProp("backgroundColor", "#5E35B1");
};
cs.forEach(function(v) {
if(v.defaultValue == "Ore Personali"){
if(v.checked){  
if(nomeUtente != sessionUser) 
info.event.setProp("display", "none");                 
} else{                            
if(nomeUtente == sessionUser) 
info.event.setProp("display", "none"); 
}
} else if(v.defaultValue == "Assenze"){
if(v.checked){  
if(nomeUtente != sessionUser) 
info.event.setProp("display", "block ruby");
}else {
if(nomeUtente != sessionUser) 
info.event.setProp("display", "none");
}
}                
})
}
}

As you can see now: (and compare to the screenshot above) it's works because I have the two checkboxes checked but the events with a nomeUtente different from "domizianaD" (the same user i'm using in this session) are blu (standar color of fullcalendar) and not in different color as above.

What could it be?
<hr>
This is how my events are loaded (from PHP file):

events: [
{
title: 'Normali',
start":'2023-02-14T08:00',
end: '2023-02-14T17:30'
extendedProps: {
nomeUtente: 'domizianaD',
}
}
{
title: 'Normali',
start":'2023-02-05T08:00',
end: '2023-02-05T17:30'
extendedProps: {
nomeUtente: 'raffaellaA',
}
}
{
title: 'Ferie',
start":'2023-02-07T08:00',
end: '2023-02-07T17:30'
extendedProps: {
nomeUtente: 'domizianaD',
}
}
{
title: 'Malattia',
start":'2023-02-26T08:00',
end: '2023-02-26T17:30'
extendedProps: {
nomeUtente: 'tizianaV',
}
}{
title: 'Normali',
start":'2023-02-01T08:00',
end: '2023-02-01T17:30'
extendedProps: {
nomeUtente: 'domizianaD',
}
}
{
title: 'Normali',
start":'2023-02-04T08:00',
end: '2023-02-04T17:30'
extendedProps: {
nomeUtente: 'raffaellaA',
}
}

I'm gonna update how I finally find out how to do it:

eventDidMount: function(info) {
cs.forEach(function(v) {
if(v.defaultValue == "Ore Personali"){
if(nomeUtente != sessionUser) 
info.event.setProp("display", "none"); 
if(v.checked)
console.log("Checked")                 
else{ 
if(nomeUtente == sessionUser) 
info.event.setProp("display", "none");                             
}
} else if(v.defaultValue == "Assenze"){
if(v.checked)   
info.event.setProp("display", "inherit");
else {
if(nomeUtente != sessionUser ) 
info.event.setProp("display", "none");
}
}                
})
}

Basically for every checkbox ("OrePersonali" and "Assenze") it controll whoever saved the event and hide it if that particulary checkbox is not checked