import React, { useState, useEffect } from 'react' import fetch from 'unfetch' import Head from 'next/head' import LoadingIndicator from '../components/LoadingIndicator' import Sleep from '../components/sleep' import styles from './ranklist.module.css' import constants from '../constants.json' const selectOptions = { newQuestions: { name: 'Beküldött új kérdések' }, allQuestions: { name: 'Megoldott kérdések' }, count: { name: 'Megoldott tesztek' }, } const sinceOptions = { all: { name: 'All time', }, monthly: { name: 'Havi' }, weekly: { name: 'Heti' }, daily: { name: 'Napi' }, } function getTimeString(date) { return ( date.getFullYear() + '-' + ('0' + (date.getMonth() + 1)).slice(-2) + '-' + ('0' + date.getDate()).slice(-2) ) } function getSinceDate(keyword) { if (keyword === 'all') { return null } const date = new Date() if (keyword === 'daily') { date.setDate(date.getDate() - 1) } else if (keyword === 'weekly') { date.setDate(date.getDate() - 7) } else if (keyword === 'monthly') { date.setDate(date.getDate() - 30) } return date } async function getListFromServer(since) { return new Promise((resolve, reject) => { console.info('Fetching data') let query = '' if (since && since !== 'all') { query = `?since=${getTimeString(getSinceDate(since))}` } fetch(`${constants.apiUrl}ranklist${query}`, { credentials: 'include', Accept: 'application/json', 'Content-Type': 'application/json', }) .then((resp) => { return resp.json() }) .then((data) => { resolve(data) }) .catch((error) => { reject(error) }) }) } function sortDataBy(data, key) { return data.sort((a, b) => { if (a[key] < b[key]) { return 1 } else if (a[key] > b[key]) { return -1 } else { return 0 } }) } export default function RankList() { const [ranklist, setRanklist] = useState(null) const [selfUserId, setSelfUserId] = useState('...') const [key, setKey] = useState('newQuestions') const [since, setSince] = useState('all') const [sum, setSum] = useState({}) const getList = () => { setSum({}) setRanklist(null) getListFromServer(since) .then((data) => { setRanklist(data.list || []) setSum(data.sum || {}) if (data.selfuserId) { setSelfUserId(data.selfuserId) } }) .catch(() => { setRanklist(null) }) } useEffect(() => { getList() }, []) useEffect(() => { getList() }, [since]) const list = ranklist && sortDataBy(ranklist, key) const updateSince = (keyword) => { setSince(keyword) } return (
Qmining - Ranklista | Frylabs.net
{`A felhasználó ID-d: #${selfUserId}`}
Az adatok kb 2020. április eleje óta vannak gyűjtve, és azonnal frissülnek.
{Object.keys(sinceOptions).map((key) => { const val = sinceOptions[key] return (
{ updateSince(key) }} > {val.name}
) })}
{'Rank'}
{'Felhasználó ID'}
{Object.keys(selectOptions).map((listKey) => { const val = selectOptions[listKey] return (
{ setKey(listKey) }} > {val.name}
) })}
{'Összesen'}
{sum.newQuestions}
{sum.allQuestions}
{sum.count}
{list ? ( list.map((listItem, i) => { return (
{i + 1}
{'#' + listItem.userId}
{Object.keys(selectOptions).map((listKey) => { const val = listItem[listKey] return
{val}
})}
) }) ) : ( )}
) }