Added support for user specific motd

This commit is contained in:
mrfry 2020-10-21 16:27:40 +02:00
parent ada93f0bb9
commit 806f32cac5

View file

@ -11,14 +11,15 @@ import styles from './index.module.css'
import links from '../data/links.json'
import constants from '../constants.json'
export default function Index (props) {
export default function Index(props) {
const [motd, setMotd] = useState('loading...')
const [userSpecificMotd, setUserSpecificMotd] = useState('loading...')
const [news, setNews] = useState(null)
useEffect(() => {
console.info('Fetching news.json')
fetch(`${constants.apiUrl}news.json`, {
credentials: 'include'
credentials: 'include',
})
.then((resp) => {
return resp.json()
@ -30,23 +31,25 @@ export default function Index (props) {
useEffect(() => {
console.info('Fetching data')
fetch(`${constants.apiUrl}motd`, {
credentials: 'include'
fetch(`${constants.apiUrl}infos?motd=true`, {
credentials: 'include',
Accept: 'application/json',
'Content-Type': 'application/json',
})
.then((resp) => {
return resp.text()
return resp.json()
})
.then((data) => {
setMotd(data)
console.log(data)
setMotd(data.motd)
setUserSpecificMotd(data.userSpecificMotd)
})
}, [])
const renderQAItem = (n, key) => {
return (
<div key={key} className={styles.itemContainer}>
<div className={styles.itemNumber}>
{key} :
</div>
<div className={styles.itemNumber}>{key} :</div>
<div
className={styles.question}
dangerouslySetInnerHTML={{ __html: n.q }}
@ -62,9 +65,7 @@ export default function Index (props) {
const renderNewsItem = (n, key) => {
return (
<div key={key} className={styles.itemContainer}>
<div className={styles.itemNumber}>
{key} :
</div>
<div className={styles.itemNumber}>{key} :</div>
<div
className={styles.newsTitle}
dangerouslySetInnerHTML={{ __html: n.title }}
@ -79,43 +80,37 @@ export default function Index (props) {
const renderNews = () => {
if (news) {
let questions = Object.keys(news).map((key, i) => {
let n = news[key]
if (n.q) {
return (
<div key={key}>
{renderQAItem(n, key)}
<hr />
</div>
)
} else {
return (
<div key={key}>
{renderNewsItem(n, key)}
<hr />
</div>
)
}
}).reverse()
let questions = Object.keys(news)
.map((key, i) => {
let n = news[key]
if (n.q) {
return (
<div key={key}>
{renderQAItem(n, key)}
<hr />
</div>
)
} else {
return (
<div key={key}>
{renderNewsItem(n, key)}
<hr />
</div>
)
}
})
.reverse()
return (
<div className={styles.questionscontainer}>
{questions}
</div>
)
return <div className={styles.questionscontainer}>{questions}</div>
} else {
return (
<LoadingIndicator />
)
return <LoadingIndicator />
}
}
const renderMotd = () => {
return (
<div>
<div className={styles.motdHeader}>
MOTD:
</div>
<div className={styles.motdHeader}>MOTD:</div>
<div
className={styles.motd}
dangerouslySetInnerHTML={{ __html: motd }}
@ -124,23 +119,31 @@ export default function Index (props) {
)
}
const renderUserSpecificMotd = () => {
return (
<div>
<div className={styles.motdHeader}>
Felhasználó MOTD (ezt csak te látod):
</div>
<div
className={styles.motd}
dangerouslySetInnerHTML={{ __html: userSpecificMotd }}
/>
</div>
)
}
return (
<div>
{renderMotd()}
{userSpecificMotd && renderUserSpecificMotd()}
<center>
{Object.keys(links).map((key) => {
let link = links[key]
return (
<span
className='link'
key={key}
>
<a
href={link.href}
>
<div className={styles.button}>
{link.text}
</div>
<span className="link" key={key}>
<a href={link.href}>
<div className={styles.button}>{link.text}</div>
</a>
</span>
)