Merged with news-to-forum, ranklist viewing user always first

src/pages/ranklist.js

@@ -85,7 +85,8 @@ function sortDataBy(data, key) {
   })
 }
 
-export default function RankList() {
+export default function RankList({ globalData }) {
+  const userId = globalData.userId
   const [ranklist, setRanklist] = useState(null)
   const [selfUserId, setSelfUserId] = useState('...')
   const [key, setKey] = useState('newQuestions')
@@ -112,14 +113,19 @@ export default function RankList() {
     getList()
   }, [])
 
-  useEffect(
-    () => {
-      getList()
-    },
-    [since]
-  )
+  useEffect(() => {
+    getList()
+  }, [since])
 
-  const list = ranklist && sortDataBy(ranklist, key)
+  const list =
+    ranklist &&
+    sortDataBy(ranklist, key).reduce((acc, entry, i) => {
+      if (entry.userId === userId) {
+        return [{ rank: i, ...entry }, ...acc]
+      } else {
+        return [...acc, { rank: i, ...entry }]
+      }
+    }, [])
 
   const updateSince = (keyword) => {
     setSince(keyword)
@@ -218,7 +224,7 @@ export default function RankList() {
                     styles.selfRow}`}
                   key={i}
                 >
-                  <div>{i + 1}</div>
+                  <div>{listItem.rank + 1}</div>
                   <div>{'#' + listItem.userId}</div>
                   {Object.keys(selectOptions).map((listKey) => {
                     const val = listItem[listKey]