add dynamic challenge modal title

This commit is contained in:
Tom
2023-05-26 10:10:51 +02:00
parent bb54704a89
commit 8d0ffd1f74
6 changed files with 59 additions and 9 deletions
+28 -7
View File
@@ -11,7 +11,11 @@ const CaptchaModal = () => {
pendingComment, pendingComment,
selectedStyle, selectedStyle,
setCaptchaResponse, setCaptchaResponse,
isAuthorDelete, setIsAuthorDelete,
isAuthorEdit, setIsAuthorEdit,
isCaptchaOpen, setIsCaptchaOpen, isCaptchaOpen, setIsCaptchaOpen,
isModEdit, setIsModEdit,
resolveCaptchaPromise,
selectedShortCid, selectedShortCid,
} = useGeneralStore(state => state); } = useGeneralStore(state => state);
@@ -22,8 +26,18 @@ const CaptchaModal = () => {
const responseRef = useRef(); const responseRef = useRef();
const nodeRef = useRef(null); const nodeRef = useRef(null);
useEffect(() => {
if (!isCaptchaOpen) {
setIsAuthorDelete(false);
setIsAuthorEdit(false);
setIsModEdit(false);
}
}, [isCaptchaOpen, setIsAuthorDelete, setIsAuthorEdit, setIsModEdit]);
useEffect(() => {
useEffect(() => {
const handleResize = () => setIsMobile(window.innerWidth <= 480); const handleResize = () => setIsMobile(window.innerWidth <= 480);
window.addEventListener('resize', handleResize); window.addEventListener('resize', handleResize);
@@ -50,6 +64,7 @@ const CaptchaModal = () => {
} }
}, [challengesArray]); }, [challengesArray]);
const handleKeyDown = (event) => { const handleKeyDown = (event) => {
if (event.key === "Enter") { if (event.key === "Enter") {
event.preventDefault(); event.preventDefault();
@@ -57,10 +72,11 @@ const CaptchaModal = () => {
} }
}; };
const handleReturnKeyDown = () => { const handleReturnKeyDown = () => {
submitCaptcha((response) => { submitCaptcha((response) => {
useGeneralStore.getState().setCaptchaResponse(response); setCaptchaResponse(response);
useGeneralStore.getState().resolveCaptchaPromise(response); resolveCaptchaPromise(response);
}); });
}; };
@@ -72,13 +88,15 @@ const CaptchaModal = () => {
if (callback) { if (callback) {
callback(responseRef.current.value); callback(responseRef.current.value);
} }
}; };
return ( return (
<StyledModal <StyledModal
isOpen={isCaptchaOpen} isOpen={isCaptchaOpen}
onRequestClose={() => setIsCaptchaOpen(false)} onRequestClose={() => {
submitCaptcha();
setIsCaptchaOpen(false);}}
contentLabel="Captcha Modal" contentLabel="Captcha Modal"
shouldCloseOnEsc={false} shouldCloseOnEsc={false}
shouldCloseOnOverlayClick={false} shouldCloseOnOverlayClick={false}
@@ -87,7 +105,10 @@ const CaptchaModal = () => {
<Draggable handle=".modal-header" nodeRef={nodeRef} disabled={isMobile}> <Draggable handle=".modal-header" nodeRef={nodeRef} disabled={isMobile}>
<div className="modal-content" ref={nodeRef}> <div className="modal-content" ref={nodeRef}>
<div className="modal-header"> <div className="modal-header">
{pendingComment.parentCid ? {isModEdit ? "Challenge for Moderator Action" :
isAuthorEdit ? "Challenge for Editing Post" :
isAuthorDelete ? "Challenge for Deleting Post" :
pendingComment.parentCid ?
("Challenges for Reply to c/" + selectedShortCid) : ("Challenges for Reply to c/" + selectedShortCid) :
"Challenges for New Thread"} "Challenges for New Thread"}
<button className="icon" onClick={() => setIsCaptchaOpen(false)} title="close" /> <button className="icon" onClick={() => setIsCaptchaOpen(false)} title="close" />
@@ -15,6 +15,7 @@ const ModerationModal = ({ isOpen, closeModal, deletePost }) => {
setCaptchaResponse, setCaptchaResponse,
setChallengesArray, setChallengesArray,
setIsCaptchaOpen, setIsCaptchaOpen,
setIsModEdit,
moderatingCommentCid, moderatingCommentCid,
setResolveCaptchaPromise, setResolveCaptchaPromise,
} = useGeneralStore(state => state); } = useGeneralStore(state => state);
@@ -221,6 +222,7 @@ const ModerationModal = ({ isOpen, closeModal, deletePost }) => {
reason: reason reason: reason
})); }));
setTriggerPublishCommentEdit(true); setTriggerPublishCommentEdit(true);
setIsModEdit(true);
handleCloseModal(); handleCloseModal();
}} }}
> >
+6
View File
@@ -41,6 +41,8 @@ const Board = () => {
setChallengesArray, setChallengesArray,
defaultSubplebbits, defaultSubplebbits,
editedComment, editedComment,
setIsAuthorDelete,
setIsAuthorEdit,
setIsCaptchaOpen, setIsCaptchaOpen,
isModerationOpen, setIsModerationOpen, isModerationOpen, setIsModerationOpen,
isSettingsOpen, setIsSettingsOpen, isSettingsOpen, setIsSettingsOpen,
@@ -419,6 +421,8 @@ const Board = () => {
<button onClick={onClose}>No</button> <button onClick={onClose}>No</button>
<button <button
onClick={() => { onClick={() => {
setIsAuthorDelete(true);
setIsAuthorEdit(false);
setCommentCid(commentCid); setCommentCid(commentCid);
setPublishCommentEditOptions(prevOptions => ({ setPublishCommentEditOptions(prevOptions => ({
...prevOptions, ...prevOptions,
@@ -440,6 +444,8 @@ const Board = () => {
const handleAuthorEditClick = (comment) => { const handleAuthorEditClick = (comment) => {
handleOptionClick(comment.cid); handleOptionClick(comment.cid);
setIsAuthorEdit(true);
setIsAuthorDelete(false);
setCommentCid(comment.cid); setCommentCid(comment.cid);
setOriginalCommentContent(comment.content); setOriginalCommentContent(comment.content);
setIsEditModalOpen(true); setIsEditModalOpen(true);
+6
View File
@@ -33,6 +33,8 @@ const Catalog = () => {
setChallengesArray, setChallengesArray,
defaultSubplebbits, defaultSubplebbits,
editedComment, editedComment,
setIsAuthorDelete,
setIsAuthorEdit,
setIsCaptchaOpen, setIsCaptchaOpen,
isModerationOpen, setIsModerationOpen, isModerationOpen, setIsModerationOpen,
isSettingsOpen, setIsSettingsOpen, isSettingsOpen, setIsSettingsOpen,
@@ -354,6 +356,8 @@ const Catalog = () => {
<button onClick={onClose}>No</button> <button onClick={onClose}>No</button>
<button <button
onClick={() => { onClick={() => {
setIsAuthorDelete(true);
setIsAuthorEdit(false);
setCommentCid(commentCid); setCommentCid(commentCid);
setPublishCommentEditOptions(prevOptions => ({ setPublishCommentEditOptions(prevOptions => ({
...prevOptions, ...prevOptions,
@@ -376,6 +380,8 @@ const Catalog = () => {
const handleAuthorEditClick = (comment) => { const handleAuthorEditClick = (comment) => {
handleOptionClick(comment.cid); handleOptionClick(comment.cid);
setIsAuthorEdit(true);
setIsAuthorDelete(false);
setCommentCid(comment.cid); setCommentCid(comment.cid);
setOriginalCommentContent(comment.content); setOriginalCommentContent(comment.content);
setIsEditModalOpen(true); setIsEditModalOpen(true);
+8 -2
View File
@@ -40,6 +40,8 @@ const Thread = () => {
setChallengesArray, setChallengesArray,
defaultSubplebbits, defaultSubplebbits,
editedComment, editedComment,
setIsAuthorDelete,
setIsAuthorEdit,
setIsCaptchaOpen, setIsCaptchaOpen,
isModerationOpen, setIsModerationOpen, isModerationOpen, setIsModerationOpen,
isSettingsOpen, setIsSettingsOpen, isSettingsOpen, setIsSettingsOpen,
@@ -391,6 +393,8 @@ const Thread = () => {
<button onClick={onClose}>No</button> <button onClick={onClose}>No</button>
<button <button
onClick={() => { onClick={() => {
setIsAuthorDelete(true);
setIsAuthorEdit(false);
setCommentCid(commentCid); setCommentCid(commentCid);
setPublishCommentEditOptions(prevOptions => ({ setPublishCommentEditOptions(prevOptions => ({
...prevOptions, ...prevOptions,
@@ -412,6 +416,8 @@ const Thread = () => {
const handleAuthorEditClick = (comment) => { const handleAuthorEditClick = (comment) => {
handleOptionClick(comment.cid); handleOptionClick(comment.cid);
setIsAuthorEdit(true);
setIsAuthorDelete(false);
setCommentCid(comment.cid); setCommentCid(comment.cid);
setOriginalCommentContent(comment.content); setOriginalCommentContent(comment.content);
setIsEditModalOpen(true); setIsEditModalOpen(true);
@@ -837,7 +843,7 @@ const Thread = () => {
> >
<ul className="post-menu-catalog"> <ul className="post-menu-catalog">
<li onClick={() => handleOptionClick(comment.cid)}>Hide thread</li> <li onClick={() => handleOptionClick(comment.cid)}>Hide thread</li>
{comment.author.shortAddress === account?.author.shortAddress ? ( {comment.author?.shortAddress === account?.author.shortAddress ? (
<> <>
<li onClick={() => handleAuthorEditClick(comment)}>Edit post</li> <li onClick={() => handleAuthorEditClick(comment)}>Edit post</li>
<li onClick={() => handleAuthorDeleteClick(comment.cid)}>Delete post</li> <li onClick={() => handleAuthorDeleteClick(comment.cid)}>Delete post</li>
@@ -845,7 +851,7 @@ const Thread = () => {
) : null} ) : null}
{isModerator ? ( {isModerator ? (
<> <>
{comment.author.shortAddress === account?.author.shortAddress ? ( {comment.author?.shortAddress === account?.author.shortAddress ? (
null null
) : ( ) : (
<li onClick={() => { <li onClick={() => {
+9
View File
@@ -23,12 +23,21 @@ const useGeneralStore = create((set) => ({
editedComment: '', editedComment: '',
setEditedComment: (comment) => set({ editedComment: comment }), setEditedComment: (comment) => set({ editedComment: comment }),
isAuthorDelete: false,
setIsAuthorDelete: (isAuthorDelete) => set({ isAuthorDelete }),
isAuthorEdit: false,
setIsAuthorEdit: (isAuthorEdit) => set({ isAuthorEdit }),
isCaptchaOpen: false, isCaptchaOpen: false,
setIsCaptchaOpen: (isOpen) => set({ isCaptchaOpen: isOpen }), setIsCaptchaOpen: (isOpen) => set({ isCaptchaOpen: isOpen }),
isModerationOpen: false, isModerationOpen: false,
setIsModerationOpen: (isOpen) => set({ isModerationOpen: isOpen }), setIsModerationOpen: (isOpen) => set({ isModerationOpen: isOpen }),
isModEdit: false,
setIsModEdit: (isModEdit) => set({ isModEdit }),
isSettingsOpen: false, isSettingsOpen: false,
setIsSettingsOpen: (isOpen) => set({ isSettingsOpen: isOpen }), setIsSettingsOpen: (isOpen) => set({ isSettingsOpen: isOpen }),