Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 | import { useRouter } from 'next/router'
import { useState, useEffect } from 'react'
import en from '../../locales/belt-assessment/belt-results/en'
import fr from '../../locales/belt-assessment/belt-results/fr'
import GroupedBeltResults from '../../components/GroupedBeltResults'
export default function BeltResults({ locale }) {
const t = locale === 'en' ? en : fr
const router = useRouter()
const [state, setState] = useState({})
useEffect(() => {
try {
setState(JSON.parse(router.query.state))
} catch (e) {
console.error(e)
}
}, [])
const groups = {
'Agile': [
'continuous-planning',
'continuous-collaboration',
'continuous-improvement',
],
'Devops and Agile': ['continuous-quality'],
'DevOps': [
'continuous-integration',
'continuous-delivery',
'continuous-operations',
'continuous-security',
],
'Design Thinking': ['continuous-user-feedback'],
}
return (
<div className="flex flex-col gap-5 max-w-2xl mx-auto">
<h1 className="text-2xl font-bold text-periwinkle text-center">
{t.title}
</h1>
<img src="/dots.png" className="w-64 mx-auto"></img>
{Object.keys(groups).map((k) => (
<GroupedBeltResults
key={k}
t={t}
topic={k}
keys={groups[k]}
state={state}
/>
))}
<div className="self-end flex gap-4">
<button
onClick={() => router.push('/belt-assessment/belt-system')}
className="w-24 rounded bg-gray-600 text-white px-2 hover:bg-gray-800"
>
{t.back}
</button>
<button
onClick={() => {
sessionStorage.removeItem('belt-results')
router.push('/belt-assessment/belt-system')
}}
className="w-24 rounded bg-gray-600 text-white px-2 hover:bg-gray-800"
>
{t.reassess}
</button>
</div>
</div>
)
}
export async function getStaticProps({ locale }) {
/* istanbul ignore next */
const langToggleLink =
locale === 'en'
? '/fr/belt-assessment/belt-results'
: '/belt-assessment/belt-results'
/* Place-holder Meta Data Props */
const meta = {
data_en: {
title: 'Digital Dojo - Belt Results',
desc: 'English',
author: '',
keywords: '',
},
data_fr: {
title: 'Dojo Numérique - Résultats de ceinture',
desc: 'Français',
author: '',
keywords: '',
},
}
return {
props: { locale, langToggleLink, meta },
}
}
|