Skip to content
Snippets Groups Projects
Commit bf2db416 authored by xaralis's avatar xaralis
Browse files

feat: limit character count of posts and announcements

parent 94b61eea
Branches
No related tags found
No related merge requests found
Pipeline #1991 passed
Stage: build
Show whitespace changes
Inline Side-by-side
src/components/annoucements/AnnouncementEditModal.jsx
+ 22
− 14
View file @ bf2db416
......@@ -18,14 +18,18 @@ const AnnouncementEditModal = ({
}) => {
const [text, setText] = useState(announcement.content);
const [link, setLink] = useState(announcement.link);
const [linkValid, setLinkValid] = useState(null);
const [noTextError, setNoTextError] = useState(false);
const [textError, setTextError] = useState(null);
const [linkError, setLinkError] = useState(null);
const onTextInput = (newText) => {
setText(newText);
if (newText !== "") {
setNoTextError(false);
if (newText.length > 1024) {
setTextError("Maximální délka příspěvku je 1024 znaků.");
} else {
setTextError(null);
}
}
};
......@@ -33,7 +37,11 @@ const AnnouncementEditModal = ({
setLink(newLink);
if (!!newLink) {
setLinkValid(urlRegex.test(newLink));
if (newLink.length > 1024) {
setLinkError("Maximální délka URL je 256 znaků.");
} else {
setLinkError(urlRegex.test(newLink) ? null : "Zadejte platnou URL.");
}
}
};
......@@ -46,12 +54,15 @@ const AnnouncementEditModal = ({
};
if (!text) {
setNoTextError(true);
setTextError("Před úpravou oznámení nezapomeňte vyplnit jeho obsah.");
preventAction = true;
} else if (!!text && text.length > 1024) {
setTextError("Maximální délka oznámení je 1024 znaků.");
preventAction = true;
}
if (announcement.type === "voting" && !link) {
setLinkValid(false);
setLinkError("Zadejte platnou URL.");
preventAction = true;
} else {
payload.link = link;
......@@ -78,11 +89,7 @@ const AnnouncementEditModal = ({
<MarkdownEditor
value={text}
onChange={onTextInput}
error={
noTextError
? "Před úpravou oznámení nezapomeňte vyplnit jeho obsah."
: null
}
error={textError}
placeholder="Vyplňte text oznámení"
toolbarCommands={[
["bold", "italic", "strikethrough"],
......@@ -92,7 +99,7 @@ const AnnouncementEditModal = ({
<div
className={classNames("form-field mt-4", {
hidden: announcement.type !== "voting",
"form-field--error": linkValid === false,
"form-field--error": !!linkError,
})}
>
<div className="form-field__wrapper form-field__wrapper--shadowed">
......@@ -107,8 +114,8 @@ const AnnouncementEditModal = ({
<i className="ico--link"></i>
</div>
</div>
{linkValid === false && (
<div className="form-field__error">Zadejte platnou URL.</div>
{!!linkError && (
<div className="form-field__error">{linkError}</div>
)}
</div>
{error && (
......@@ -123,6 +130,7 @@ const AnnouncementEditModal = ({
color="blue-300"
className="text-sm"
loading={confirming}
disabled={textError || linkError || confirming}
type="submit"
>
Uložit
......
src/components/posts/PostEditModal.jsx
+ 9
− 8
View file @ bf2db416
......@@ -15,13 +15,17 @@ const PostEditModal = ({
...props
}) => {
const [text, setText] = useState(post.content);
const [noTextError, setNoTextError] = useState(false);
const [textError, setTextError] = useState(null);
const onTextInput = (newText) => {
setText(newText);
if (newText !== "") {
setNoTextError(false);
if (newText.length >= 1024) {
setTextError("Maximální délka příspěvku je 1024 znaků.");
} else {
setTextError(null);
}
}
};
......@@ -31,7 +35,7 @@ const PostEditModal = ({
if (!!text) {
onConfirm(text);
} else {
setNoTextError(true);
setTextError("Před upravením příspěvku nezapomeňte vyplnit jeho obsah.");
}
};
......@@ -49,11 +53,7 @@ const PostEditModal = ({
<MarkdownEditor
value={text}
onChange={onTextInput}
error={
noTextError
? "Před upravením příspěvku nezapomeňte vyplnit jeho obsah."
: null
}
error={textError}
placeholder="Vyplňte text příspěvku"
toolbarCommands={[
["header", "bold", "italic", "strikethrough"],
......@@ -72,6 +72,7 @@ const PostEditModal = ({
hoverActive
color="blue-300"
className="text-sm"
disabled={textError || confirming}
loading={confirming}
onClick={confirm}
>
......
src/containers/AddAnnouncementForm.jsx
+ 23
− 18
View file @ bf2db416
......@@ -11,8 +11,8 @@ import { urlRegex } from "utils";
const AddAnnouncementForm = ({ className }) => {
const [text, setText] = useState("");
const [link, setLink] = useState("");
const [linkValid, setLinkValid] = useState(null);
const [noTextError, setNoTextError] = useState(false);
const [textError, setTextError] = useState(null);
const [linkError, setLinkError] = useState(null);
const [type, setType] = useState("announcement");
const [adding, addingError] = useActionState(addAnnouncement, {
......@@ -25,7 +25,11 @@ const AddAnnouncementForm = ({ className }) => {
setText(newText);
if (newText !== "") {
setNoTextError(false);
if (newText.length > 1024) {
setTextError("Maximální délka příspěvku je 1024 znaků.");
} else {
setTextError(null);
}
}
};
......@@ -33,7 +37,11 @@ const AddAnnouncementForm = ({ className }) => {
setLink(newLink);
if (!!newLink) {
setLinkValid(urlRegex.test(newLink));
if (newLink.length > 1024) {
setLinkError("Maximální délka URL je 256 znaků.");
} else {
setLinkError(urlRegex.test(newLink) ? null : "Zadejte platnou URL.");
}
}
};
......@@ -45,12 +53,15 @@ const AddAnnouncementForm = ({ className }) => {
};
if (!text) {
setNoTextError(true);
setTextError("Před přidáním oznámení nezapomeňte vyplnit jeho obsah.");
preventAction = true;
} else if (!!text && text.length > 1024) {
setTextError("Maximální délka oznámení je 1024 znaků.");
preventAction = true;
}
if (type === "voting" && !link) {
setLinkValid(false);
setLinkError("Zadejte platnou URL.");
preventAction = true;
} else {
payload.link = link;
......@@ -65,8 +76,8 @@ const AddAnnouncementForm = ({ className }) => {
if (!result.error) {
setText("");
setLink("");
setNoTextError(false);
setLinkValid(null);
setTextError(null);
setLinkError(null);
}
};
......@@ -107,11 +118,7 @@ const AddAnnouncementForm = ({ className }) => {
<MarkdownEditor
value={text}
onChange={onTextInput}
error={
noTextError
? "Před přidáním oznámení nezapomeňte vyplnit jeho obsah."
: null
}
error={textError}
placeholder="Vyplňte text oznámení"
toolbarCommands={[
["bold", "italic", "strikethrough"],
......@@ -123,7 +130,7 @@ const AddAnnouncementForm = ({ className }) => {
<div
className={classNames("form-field", {
hidden: type !== "voting",
"form-field--error": linkValid === false,
"form-field--error": !!linkError,
})}
>
<div className="form-field__wrapper form-field__wrapper--shadowed">
......@@ -138,9 +145,7 @@ const AddAnnouncementForm = ({ className }) => {
<i className="ico--link"></i>
</div>
</div>
{linkValid === false && (
<div className="form-field__error">Zadejte platnou URL.</div>
)}
{!!linkError && <div className="form-field__error">{linkError}</div>}
</div>
</div>
......@@ -149,7 +154,7 @@ const AddAnnouncementForm = ({ className }) => {
className="text-sm mt-4"
hoverActive
loading={adding}
disabled={adding}
disabled={textError || linkError || adding}
fullwidth
>
Přidat oznámení
......
src/containers/AddPostForm.jsx
+ 16
− 14
View file @ bf2db416
......@@ -9,7 +9,7 @@ import { useActionState } from "hooks";
const AddPostForm = ({ className }) => {
const [text, setText] = useState("");
const [type, setType] = useState("post");
const [noTextError, setNoTextError] = useState(false);
const [error, setError] = useState(null);
const [addingPost, addingPostError] = useActionState(addPost, {
content: text,
});
......@@ -21,12 +21,17 @@ const AddPostForm = ({ className }) => {
setText(newText);
if (newText !== "") {
setNoTextError(false);
if (newText.length >= 1024) {
setError("Maximální délka příspěvku je 1024 znaků.");
} else {
setError(null);
}
}
};
const onAdd = async (evt) => {
if (!!text) {
if (!error) {
const result = await (type === "post" ? addPost : addProposal).run({
content: text,
});
......@@ -34,8 +39,9 @@ const AddPostForm = ({ className }) => {
if (!result.error) {
setText("");
}
}
} else {
setNoTextError(true);
setError("Před přidáním příspěvku nezapomeňte vyplnit jeho obsah.");
}
};
......@@ -55,11 +61,7 @@ const AddPostForm = ({ className }) => {
<MarkdownEditor
value={text}
onChange={onTextInput}
error={
noTextError
? "Před přidáním příspěvku nezapomeňte vyplnit jeho obsah."
: null
}
error={error}
placeholder="Vyplňte text vašeho příspěvku"
toolbarCommands={[
["header", "bold", "italic", "strikethrough"],
......@@ -93,7 +95,7 @@ const AddPostForm = ({ className }) => {
<div className="space-x-4">
<Button
onClick={onAdd}
disabled={addingPost || addingProposal}
disabled={error || addingPost || addingProposal}
loading={addingPost || addingProposal}
fullwidth
hoverActive
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment

Pirátský GitLab - Home of the CopyLeft