albert/qmining-page
1
0
Fork 0
mirror of https://gitlab.com/MrFry/qmining-page synced 2025-04-01 20:23:44 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

all questions: showing loading indicator on new db select, loading indicator update

Browse source
This commit is contained in:
mrfry 2021-02-16 09:21:15 +01:00
parent 230f069aa4
commit e563e503c9
3 changed files with 50 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

29
src/pages/allQuestions.js
View file

@ -70,11 +70,12 @@ function fetchDbs() {
}
export default function AllQuestions({ router }) {
const [asd, setAsd] = useState(false)
const [data, setData] = useState(null)
const [dbs, setDbs] = useState(null)
const [subjectsShowing, setSubjectsShowing] = useState(false)
const [searchTerm, setSearchTerm] = useState('')
const [activeSubjName, setActiveSubjName] = useState('')
const [dbs, setDbs] = useState(null)
const [data, setData] = useState(null)
const [fetchingData, setFetchingData] = useState(false)
const subjectCount = data ? data.length : 0
const questionCount = data ? data.reduce(countReducer, 0) : 0
@ -102,13 +103,17 @@ export default function AllQuestions({ router }) {
defaultValue={-1}
onChange={(event) => {
const key = event.target.value
setData(null)
setFetchingData(true)
if (key === 'all') {
fetchAllData(dbs).then((res) => {
setData(mergeData(res))
setFetchingData(false)
})
} else {
fetchData(dbs[key]).then((res) => {
setData(res.data)
setFetchingData(false)
})
}
}}
@ -241,19 +246,27 @@ export default function AllQuestions({ router }) {
{data && `${questionCount} kérdés, ${subjectCount} tárgy`}
<div className={styles.typeSelector}>
<div
className={!asd ? styles.activeTypeSelector : ''}
onClick={() => setAsd(false)}
className={!subjectsShowing ? styles.activeTypeSelector : ''}
onClick={() => setSubjectsShowing(false)}
>
Kérdések
</div>
<div
className={asd ? styles.activeTypeSelector : ''}
onClick={() => setAsd(true)}
className={subjectsShowing ? styles.activeTypeSelector : ''}
onClick={() => setSubjectsShowing(true)}
>
Tárgyak
</div>
</div>
<div>{asd ? renderSubjectBrowser() : renderQuestionBrowser()}</div>
{fetchingData ? (
<LoadingIndicator />
) : (
<div>
{subjectsShowing
? renderSubjectBrowser()
: renderQuestionBrowser()}
</div>
)}
</>
) : (
<LoadingIndicator />