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

April update

Browse source
This commit is contained in:
mrfry 2022-03-30 12:15:39 +02:00
parent 4748c23769
commit ce63911b68
18 changed files with 1046 additions and 253 deletions
Download patch file Download diff file Expand all files Collapse all files

37
src/components/reactButton.js
View file

@ -5,6 +5,8 @@ import Tooltip from './tooltip.js'
import styles from './reactButton.module.css'
import reactions from '../data/reactions.json'
const upDownVoteKeys = { 'thumbs up': [-1], 'thumbs down': [-1] }
function useOutsideAlerter(ref, action) {
useEffect(() => {
function handleClickOutside(event) {
@ -20,12 +22,24 @@ function useOutsideAlerter(ref, action) {
}, [ref])
}
function ExistingReacts({ existingReacts, onClick, uid }) {
function mergeEmptyUpDownVoteObjWithExisting(existingReacts) {
if (!existingReacts) return upDownVoteKeys
return Object.keys(existingReacts).reduce((acc, reactKey) => {
return { ...acc, [reactKey]: existingReacts[reactKey] }
}, upDownVoteKeys)
}
function ExistingReacts({ existingReacts, onClick, uid, showUpDownVote }) {
const mergedReactions = showUpDownVote
? mergeEmptyUpDownVoteObjWithExisting(existingReacts)
: existingReacts
return (
<>
{existingReacts &&
Object.keys(existingReacts).map((key) => {
const currReact = existingReacts[key]
{mergedReactions &&
Object.keys(mergedReactions).map((key) => {
const currReact = mergedReactions[key]
const react = reactions[key]
if (!react) {
return null
@ -40,7 +54,7 @@ function ExistingReacts({ existingReacts, onClick, uid }) {
onClick(key, currReact.includes(uid))
}}
>
{react.emoji} {currReact.length}
{react.emoji} {currReact[0] === -1 ? 0 : currReact.length}
</span>
)
})}
@ -54,6 +68,7 @@ function RenderEmojis({ onClick }) {
return (
<>
<input
autoFocus
type="text"
placeholder="Keresés..."
onChange={(event) => {
@ -81,7 +96,12 @@ function RenderEmojis({ onClick }) {
)
}
export default function ReactButton({ onClick, existingReacts, uid }) {
export default function ReactButton({
onClick,
existingReacts,
uid,
showUpDownVote,
}) {
const [opened, setOpened] = useState(false)
const wrapperRef = useRef(null)
useOutsideAlerter(wrapperRef, () => {
@ -91,8 +111,8 @@ export default function ReactButton({ onClick, existingReacts, uid }) {
return (
<>
<Tooltip
width={300}
height={250}
width={300}
height={250}
text={() => {
return (
<span
@ -116,6 +136,7 @@ export default function ReactButton({ onClick, existingReacts, uid }) {
</div>
</Tooltip>
<ExistingReacts
showUpDownVote={showUpDownVote}
uid={uid}
onClick={(key, isDelete) => {
onClick(key, isDelete)