fix: seperate messages/schema from operation in sidebar (#1140)

Co-authored-by: acethecreator <[email protected]>
Co-authored-by: Chan <[email protected]>

Author: AceTheCreator

library/src/containers/Sidebar/Sidebar.tsx

@@ -78,20 +78,16 @@ export const Sidebar: React.FunctionComponent = () => {
   );
 
   const operationList = hasOperations && (
-    <>
-      <li className="mb-3 mt-9">
-        <a
-          className="text-xs uppercase text-gray-700 mt-10 mb-4 font-thin hover:text-gray-900"
-          href="#operations"
-          onClick={() => setShowSidebar(false)}
-        >
-          Operations
-        </a>
-        <OperationsList />
-      </li>
-      {showMessages && messagesList}
-      {showSchemas && schemasList}
-    </>
+    <li className="mb-3 mt-9">
+      <a
+        className="text-xs uppercase text-gray-700 mt-10 mb-4 font-thin hover:text-gray-900"
+        href="#operations"
+        onClick={() => setShowSidebar(false)}
+      >
+        Operations
+      </a>
+      <OperationsList />
+    </li>
   );
 
   return (
@@ -161,6 +157,8 @@ export const Sidebar: React.FunctionComponent = () => {
                 </li>
               )}
               {operationList}
+              {showMessages && messagesList}
+              {showSchemas && schemasList}
             </ul>
           </div>
         </div>