отреагировать на класс переключения и удалить класс из родственного элемента

Question

Я хочу переключать класс, когда нажимаю на компонент, но также удаляю тот же класс из другого компонента, у которого есть фокусированный класс.

const Notificationcard = (props) => {
const [focused, setFocused] = useState(false);
function doClick(focus) {
 let elems = document.querySelector(".notification-card-focused");
 if(elems){
   console.log(elems)
   elems.classList.remove("notification-card-focused");
 }

 setFocused(focus);
}
return (
 <div
   className={`notification-card ${focused ? "notification-card-focused" : ""}`}
   onClick={() => doClick(!focused)}
 >
   <div className="icon-place">{props.children}</div>
   <div className="card-content">
     <p className="title-place"> {props.title}</p>
     <p className="contexte-place">{props.content}</p>
     <p className="time-place">{props.time}</p>
   </div>
 </div>
);
};
export default Notificationcard;