diff --git a/frontend/src/pages/ServerDetail.jsx b/frontend/src/pages/ServerDetail.jsx
index d2a7786..388e7c1 100644
--- a/frontend/src/pages/ServerDetail.jsx
+++ b/frontend/src/pages/ServerDetail.jsx
@@ -431,11 +431,9 @@ const ServerDetail = ({ isMobile = false }) => {
                       <div className="px-5 pb-5 md:px-6 md:pb-6 border-t border-white/5">
                         <div className="max-h-60 overflow-y-auto custom-scrollbar pt-4 pr-3">
                           <ul className="grid grid-cols-1 md:grid-cols-2 gap-2">
-                            {server.mods.map((mod, index) => (
+                            {[...server.mods].sort((a, b) => a.id.localeCompare(b.id)).map((mod, index) => (
                               <li key={index} className="text-sm flex items-center justify-between p-3 bg-black/20 rounded-lg hover:bg-black/30 transition-colors">
-                                <Tooltip content={mod.id}>
-                                  <span className="truncate font-medium text-gray-300">{mod.id}</span>
-                                </Tooltip>
+                                <span className="truncate font-medium text-gray-300">{mod.id}</span>
                                 <span className="text-xs text-gray-500 font-mono ml-2 px-2 py-0.5 bg-white/5 rounded">{mod.version}</span>
                               </li>
                             ))}
@@ -457,11 +455,9 @@ const ServerDetail = ({ isMobile = false }) => {
                           <div className="px-5 pb-5 md:px-6 md:pb-6 border-t border-white/5">
                             <div className="max-h-60 overflow-y-auto custom-scrollbar pt-4 pr-3">
                               <ul className="grid grid-cols-1 md:grid-cols-2 gap-2">
-                                {server.mods.map((mod, index) => (
+                                {[...server.mods].sort((a, b) => a.id.localeCompare(b.id)).map((mod, index) => (
                                   <li key={index} className="text-sm flex items-center justify-between p-3 bg-black/20 rounded-lg hover:bg-black/30 transition-colors">
-                                    <Tooltip content={mod.id}>
-                                      <span className="truncate font-medium text-gray-300">{mod.id}</span>
-                                    </Tooltip>
+                                    <span className="truncate font-medium text-gray-300">{mod.id}</span>
                                     <span className="text-xs text-gray-500 font-mono ml-2 px-2 py-0.5 bg-white/5 rounded">{mod.version}</span>
                                   </li>
                                 ))}