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

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

Browse source
This commit is contained in:
mrfry 2021-04-13 14:17:30 +02:00
commit 6865b07bf8
5 changed files with 246 additions and 136 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/components/newsEntry.module.css
View file

@ -61,7 +61,7 @@
}
.newsRoot {
background-color: #191919;
background-color: var(--dark-color);
margin-left: 8px;
margin-right: 8px;
margin-bottom: 16px;

7
src/defaultStyles.css
View file

@ -4,6 +4,7 @@
--bright-color: #f2f2f2;
--background-color: #222426;
--hoover-color: #393939;
--dark-color: #191919;
}
@import url('https://fonts.googleapis.com/css2?family=Kameron&family=Overpass+Mono:wght@300;400&display=swap');
@ -44,6 +45,12 @@ input {
border-radius: 5px;
width: 80%;
font-family: inherit;
border: 1px solid #444;
width: 98%;
}
input:focus {
border: 0px solid #444;
}
.link {

133
src/pages/index.js
View file

@ -10,11 +10,21 @@ import Composer from '../components/composer'
import styles from './index.module.css'
import constants from '../constants.json'
function fetchNews() {
const forumPostPerPage = 2
const frontpageForumName = 'frontpage'
function fetchForum(from) {
return new Promise((resolve) => {
fetch(`${constants.apiUrl}news.json`, {
fetch(
`${
constants.apiUrl
}forumEntries?forumName=${frontpageForumName}&getContent=true${
from ? `&from=${from}` : ''
}&count=${forumPostPerPage}`,
{
credentials: 'include',
})
}
)
.then((resp) => {
return resp.json()
})
@ -34,6 +44,7 @@ function addPost(title, content) {
'Content-Type': 'application/json',
},
body: JSON.stringify({
forumName: frontpageForumName,
title: title,
content: content,
}),
@ -66,7 +77,6 @@ function postFeedback(content, file) {
]
if (file) {
console.log('FIEEEEEEEEEELE')
const formData = new FormData() // eslint-disable-line
formData.append('file', file)
@ -90,24 +100,42 @@ function postFeedback(content, file) {
})
}
function updateForumPost(forum, postKey, postData) {
return Object.keys(forum).reduce((acc, key) => {
const entry = forum[key]
if (key === postKey) {
acc = {
...acc,
[key]: postData,
}
} else {
acc = {
...acc,
[key]: entry,
}
}
return acc
}, {})
}
export default function Index({ globalData }) {
const userId = globalData.userId
const motd = globalData.motd
const [news, setNews] = useState(null)
// const userSpecificMotd = props.globalData.userSpecificMotd
const [nextEntryKey, setNextEntryKey] = useState()
useEffect(() => {
console.info('Fetching news.json')
fetchNews().then((res) => {
setNews(res)
fetchForum().then((res) => {
const { entries, nextKey } = res
setNextEntryKey(nextKey)
setNews(entries)
})
}, [])
const renderNews = () => {
if (news) {
let newsItems = Object.keys(news)
.map((key) => {
let newsEntryData = news[key]
let newsItems = Object.keys(news).map((postKey) => {
let newsEntryData = news[postKey]
return (
<NewsEntry
onPostDelete={() => {
@ -119,14 +147,31 @@ export default function Index({ globalData }) {
'Content-Type': 'application/json',
},
body: JSON.stringify({
newsKey: key,
forumName: frontpageForumName,
postKey: postKey,
}),
})
.then((res) => {
return res.json()
})
.then((res) => {
setNews(res.news)
const { success, msg } = res
if (success) {
setNews(
Object.keys(news).reduce((acc, key) => {
const entry = news[key]
if (key !== postKey) {
acc = {
...acc,
[key]: entry,
}
}
return acc
}, {})
)
} else {
alert(msg)
}
})
}}
onNewsReact={({ reaction, isDelete }) => {
@ -139,15 +184,15 @@ export default function Index({ globalData }) {
},
body: JSON.stringify({
reaction: reaction,
newsKey: key,
postKey: postKey,
isDelete: isDelete,
forumName: frontpageForumName,
}),
})
.then((res) => {
return res.json()
})
.then((res) => {
console.log(res)
setNews(res.news)
})
}}
@ -161,17 +206,23 @@ export default function Index({ globalData }) {
},
body: JSON.stringify({
type: 'reaction',
newsKey: key,
postKey: postKey,
path: path,
reaction: reaction,
isDelete: isDelete,
forumName: frontpageForumName,
}),
})
.then((res) => {
return res.json()
})
.then((res) => {
setNews(res.news)
const { success, postData, msg } = res
if (success) {
setNews(updateForumPost(news, postKey, postData))
} else {
alert(msg)
}
})
}}
onDelete={(path) => {
@ -185,14 +236,20 @@ export default function Index({ globalData }) {
body: JSON.stringify({
type: 'delete',
path: path,
newsKey: key,
postKey: postKey,
forumName: frontpageForumName,
}),
})
.then((res) => {
return res.json()
})
.then((res) => {
setNews(res.news)
const { success, postData, msg } = res
if (success) {
setNews(updateForumPost(news, postKey, postData))
} else {
alert(msg)
}
})
}}
onComment={(path, content) => {
@ -207,24 +264,29 @@ export default function Index({ globalData }) {
type: 'add',
path: path,
content: content,
newsKey: key,
postKey: postKey,
forumName: frontpageForumName,
}),
})
.then((res) => {
return res.json()
})
.then((res) => {
setNews(res.news)
const { success, postData, msg } = res
if (success) {
setNews(updateForumPost(news, postKey, postData))
} else {
alert(msg)
}
})
}}
uid={userId}
key={key}
newsKey={key}
key={postKey}
newsKey={postKey}
newsItem={newsEntryData}
/>
)
})
.reverse()
return (
<div>
@ -236,7 +298,6 @@ export default function Index({ globalData }) {
alert('Üres a tartalom!')
return
}
console.log(type, title, content, file)
if (type === 'private') {
postFeedback(content, file).then((res) => {
console.log(res)
@ -248,12 +309,32 @@ export default function Index({ globalData }) {
return
}
addPost(title, content).then((res) => {
setNews(res.news)
const { success, newPostKey, newEntry, msg } = res
if (success) {
setNews({ [newPostKey]: newEntry, ...news })
} else {
alert(msg)
}
})
}
}}
/>
<div>{newsItems}</div>
{nextEntryKey && (
<div
className={styles.loadMoreButton}
onClick={() => {
fetchForum(nextEntryKey).then((res) => {
console.log(res)
const { entries, nextKey } = res
setNextEntryKey(nextKey)
setNews({ ...news, ...entries })
})
}}
>
Több bejegyzés betöltése
</div>
)}
</div>
)
} else {

16
src/pages/index.module.css
View file

@ -78,3 +78,19 @@
display: flex;
flex-direction: column;
}
.loadMoreButton {
text-align: center;
background-color: var(--dark-color);
margin-left: 8px;
margin-right: 8px;
margin-bottom: 16px;
margin-top: 16px;
padding: 10px;
cursor: pointer;
}
.loadMoreButton:hover {
background-color: var(--hoover-color);
}

22
src/pages/ranklist.js
View file

@ -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(
() => {
useEffect(() => {
getList()
},
[since]
)
}, [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]