feat: change style a little more

src/Rankings.tsx

@@ -10,7 +10,7 @@ type PlayerListProps = Partial<ReactSortableProps<any>> & {
 
 function PlayerList(props: PlayerListProps) {
   return (
-    <ReactSortable {...props} animation={200}>
+    <ReactSortable {...props} animation={200} swapThreshold={0.4}>
       {props.list?.map((item, index) => (
         <div key={item.id} className="item">
           {props.orderedList
@@ -278,7 +278,7 @@ export default function Rankings() {
 
   useEffect(() => {
     loadPlayers();
-  }, []);
+  }, [user]);
 
   const tabs = [
     { id: "Chemistry", label: "🧪 Chemistry" },
@@ -287,7 +287,7 @@ export default function Rankings() {
 
   return (
     <>
-      {user && players && (
+      {user && players ? (
         <div>
           <div className="container navbar">
             {tabs.map((tab) => (
@@ -314,6 +314,8 @@ export default function Rankings() {
             }
           })}
         </div>
+      ) : (
+        <span className="loader" />
       )}
     </>
   );