Merge pull request #3 from TOY2-12/T1-10--feature/game/sorting

Feat: rate 정렬

src/components/game/rating/Rating.tsx

@@ -1,5 +1,6 @@
 import React, { useState, useEffect } from 'react';
 import styled from 'styled-components';
+import sorting from './sorting';
 
 const RatingWrapper = styled.div`
   flex: 1;
@@ -9,19 +10,30 @@ const RatingWrapper = styled.div`
 `;
 
 export default function Rating() {
-  const [peoples, setPeoples] = useState(['']);
+  const [peoples, setPeoples] = useState([
+    { id: 'dd', correct: 2 },
+    { id: 'bb', correct: 2 },
+    { id: 'cc', correct: 15 },
+    { id: 'aa', correct: 15 },
+  ]);
+  const [finish, setFinish] = useState(0);
   useEffect(() => {
-    setPeoples(['aa', 'bb']);
-  }, []);
+    setPeoples(sorting(peoples));
+    setFinish(1);
+  }, [peoples]);
 
   return (
     <RatingWrapper>
       <h1>Rating</h1>
-      {peoples.map((el, i) => (
-        <h2>
-          {i + 1}. {el}
-        </h2>
-      ))}
+      {{ finish } ? (
+        peoples.map((el, i) => (
+          <h2>
+            {i + 1}. {el.id} X {el.correct}
+          </h2>
+        ))
+      ) : (
+        <div>X</div>
+      )}
     </RatingWrapper>
   );
 }

src/components/game/rating/sorting.ts

@@ -0,0 +1,8 @@
+export interface Id {
+  id: string;
+  correct: number;
+}
+
+const sorting = (idArray: Id[]) => idArray.sort((a, b) => b.correct - a.correct || a.id.localeCompare(b.id));
+
+export default sorting;