Remote an array component hooks

Question

I have this interfaces which they are use for context variable:

 export interface itemRubro {
    radius:string
    description:string
    numeracion:string
    days_of_works:string
    hour_init:string
    hour_end:string
    certificate:string
    picture1:string
    picture2:string
    picture3:string
  }
  
  export type RubroType = {
    rubros : itemRubro [];
    setRubro: Dispatch<SetStateAction<itemRubro []>>;
  }

export const  RubroContext = createContext({} as RubroType);

export const useRubroContext = () => useContext(RubroContext);

I added some data with:

const {rubros,setRubro} = useRubroContext()

setRubro!((state) =>[{
                    radius:resquest.radius,
                    description:resquest.description,
                    days_of_works:resquest.days_of_works,
                    hour_init:resquest.hour_init,
                    hour_end:resquest.hour_end,
                    certificate:resquest.certificate,
                    picture1:resquest.picture1,
                    picture2:resquest.picture2,
                    picture3:resquest.picture3
}])

//...

setRubro!((state) =>[{...state,
                    radius:resquest.radius,
                    description:resquest.description,
                    days_of_works:resquest.days_of_works,
                    hour_init:resquest.hour_init,
                    hour_end:resquest.hour_end,
                    certificate:resquest.certificate,
                    picture1:resquest.picture1,
                    picture2:resquest.picture2,
                    picture3:resquest.picture3
}])

If there are 2 elements in rubros. How can I delete the second one? if there are (rubro[0] and rubro[1] in the hook array).

const aux:itemRubro = rubros[0]
setRubro!( ({aux}))

That's not working.