diff --git a/frontend/src/Navigation.tsx b/frontend/src/Navigation.tsx
index 1fadb41..c5488a5 100644
--- a/frontend/src/Navigation.tsx
+++ b/frontend/src/Navigation.tsx
@@ -29,6 +29,7 @@ import {
 import { useOutsideAlerter } from './hooks';
 import Upload from './upload/Upload';
 import { Doc, getConversations } from './preferences/preferenceApi';
+import SelectDocsModal from './preferences/SelectDocsModal';
 
 export default function Navigation({
   navState,
@@ -179,7 +180,7 @@ export default function Navigation({
           className={({ isActive }) =>
             `${
               isActive && conversationId === null ? 'bg-gray-3000' : ''
-            } my-auto mx-4 mt-4 flex h-12 cursor-pointer gap-4 rounded-3xl rounded-md hover:bg-gray-100`
+            } my-auto mx-4 mt-4 flex h-12 cursor-pointer gap-4 rounded-3xl hover:bg-gray-100`
           }
         >
           <img src={Message} className="ml-4 w-5"></img>
@@ -194,7 +195,7 @@ export default function Navigation({
                     onClick={() => {
                       handleConversationClick(conversation.id);
                     }}
-                    className={`my-auto mx-4 mt-4 flex h-12 cursor-pointer items-center justify-between gap-4 rounded-3xl rounded-md hover:bg-gray-100 ${
+                    className={`my-auto mx-4 mt-4 flex h-12 cursor-pointer items-center justify-between gap-4 rounded-3xl hover:bg-gray-100 ${
                       conversationId === conversation.id ? 'bg-gray-100' : ''
                     }`}
                   >
@@ -293,7 +294,7 @@ export default function Navigation({
         </div>
         <div className="flex flex-col gap-2 border-b-2 py-2">
           <div
-            className="my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-md hover:bg-gray-100"
+            className="my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-3xl hover:bg-gray-100"
             onClick={() => {
               setApiKeyModalState('ACTIVE');
             }}
@@ -307,7 +308,7 @@ export default function Navigation({
           <NavLink
             to="/about"
             className={({ isActive }) =>
-              `my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-3xl rounded-md hover:bg-gray-100 ${
+              `my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-3xl hover:bg-gray-100 ${
                 isActive ? 'bg-gray-3000' : ''
               }`
             }
@@ -320,7 +321,7 @@ export default function Navigation({
             href="https://discord.gg/WHJdfbQDR4"
             target="_blank"
             rel="noreferrer"
-            className="my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-3xl rounded-md hover:bg-gray-100"
+            className="my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-3xl hover:bg-gray-100"
           >
             <img src={Link} alt="link" className="ml-2 w-5" />
             <p className="my-auto text-eerie-black">Discord</p>
@@ -330,7 +331,7 @@ export default function Navigation({
             href="https://github.com/arc53/DocsGPT"
             target="_blank"
             rel="noreferrer"
-            className="my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-3xl rounded-md hover:bg-gray-100"
+            className="my-auto mx-4 flex h-12 cursor-pointer gap-4 rounded-3xl hover:bg-gray-100"
           >
             <img src={Link} alt="link" className="ml-2 w-5" />
             <p className="my-auto text-eerie-black">Github</p>
@@ -345,11 +346,11 @@ export default function Navigation({
           <img src={Hamburger} alt="menu toggle" className="w-7" />
         </button>
       </div>
-      {/* <SelectDocsModal
+      <SelectDocsModal
         modalState={selectedDocsModalState}
         setModalState={setSelectedDocsModalState}
         isCancellable={isSelectedDocsSet}
-      /> */}
+      />
       <APIKeyModal
         modalState={apiKeyModalState}
         setModalState={setApiKeyModalState}