Complete rewire state to redux

src/components/Conversation.jsx

@@ -10,21 +10,19 @@ const fetcher = (url) => fetch(url).then((res) => res.json());
 
 export default function Conversation({ id, parentMessageId, title = 'New conversation' }) {
   const dispatch = useDispatch();
+  const conversationId = useSelector((state) => state.convo.conversationId);
+
   const { trigger, isMutating } = useSWRMutation(
-    //{ trigger, isMutating }
     `http://localhost:3050/messages/${id}`,
     fetcher,
     {
       onSuccess: function (res) {
-        console.log('success', res);
         dispatch(setMessages(res));
-        // setMessages(res);
       }
     }
   );
 
   const onConvoClick = (id, parentMessageId) => {
-    console.log('convo was clicked');
     dispatch(setConversation({ conversationId: id, parentMessageId }));
     trigger();
   };
@@ -52,8 +50,8 @@ export default function Conversation({ id, parentMessageId, title = 'New convers
         {title}
       </div>
       <div className="visible absolute right-1 z-10 flex text-gray-300">
-        <RenameButton />
-        <DeleteButton />
+        {id === conversationId && <RenameButton />}
+        {id === conversationId && <DeleteButton />}
       </div>
     </a>
   );

src/components/Nav.jsx

@@ -3,14 +3,14 @@ import NewChat from './NewChat';
 import Conversations from './Conversations';
 import NavLinks from './NavLinks';
 
-export default function Nav({ conversations, convo, convoHandler }) {
+export default function Nav({ conversations }) {
   return (
     <div className="dark hidden bg-gray-900 md:fixed md:inset-y-0 md:flex md:w-[260px] md:flex-col">
       <div className="flex h-full min-h-0 flex-col ">
         <div className="scrollbar-trigger flex h-full w-full flex-1 items-start border-white/20">
           <nav className="flex h-full flex-1 flex-col space-y-1 p-2">
             <NewChat />
-            <Conversations convoState={convo} conversations={conversations} convoHandler={convoHandler}/>
+            <Conversations conversations={conversations} />
             <NavLinks />
           </nav>
         </div>

src/components/TextChat.jsx

@@ -6,9 +6,10 @@ import { useSelector, useDispatch } from 'react-redux';
 import { setConversation } from '../../store/convoSlice';
 import { setMessages } from '../../store/messageSlice';
 
-export default function TextChat({ messages, reloadConvos, convo }) {
+export default function TextChat({ messages, reloadConvos }) {
   const [text, setText] = useState('');
   const dispatch = useDispatch();
+  const convo = useSelector((state) => state.convo);
 
   const submitMessage = () => {
     const payload = text.trim();
@@ -21,7 +22,6 @@ export default function TextChat({ messages, reloadConvos, convo }) {
     const convoHandler = (data) => {
       if (convo.conversationId === null && convo.parentMessageId === null) {
         const { conversationId, parentMessageId } = data;
-        // setConvo({ conversationId, parentMessageId: data.id });
         dispatch(setConversation({ conversationId, parentMessageId: data.id }));
       }