From fb2290a2867b4b6b6b8e88d31d215461f11da67e Mon Sep 17 00:00:00 2001
From: "guilhem.carron" <gcarron@grandlyon.com>
Date: Mon, 2 Aug 2021 11:35:17 +0200
Subject: [PATCH] Add is touched editor
---
src/components/Editing/Editing.tsx | 30 +++++++++++++++++++++++++-----
1 file changed, 25 insertions(+), 5 deletions(-)
diff --git a/src/components/Editing/Editing.tsx b/src/components/Editing/Editing.tsx
index feceb9b2..2111a565 100644
--- a/src/components/Editing/Editing.tsx
+++ b/src/components/Editing/Editing.tsx
@@ -10,8 +10,10 @@ const Editing: React.FC = () => {
const [date, setDate] = useState<Date>(new Date())
const [header, setHeader] = useState<string>('')
const [quote, setQuote] = useState<string>('')
+ const [isTouched, setIsTouched] = useState<boolean>(false)
const { user }: any = useContext(UserContext)
- const handleSave = async () => {
+
+ const handleSave = async (): Promise<void> => {
const monthlyNewsService = new MonthlyNewsService()
await monthlyNewsService.createMonthlyReport(
date,
@@ -24,11 +26,25 @@ const Editing: React.FC = () => {
setQuote('')
setHeader('')
}, [])
+
const isEmpty = (): boolean => {
- if (quote !== '' || header !== '') {
+ if ((quote !== '' || header !== '') && isTouched) {
return false
} else return true
}
+
+ const handleEditorChange = (
+ value: string,
+ type: 'header' | 'quote'
+ ): void => {
+ setIsTouched(true)
+ if (type === 'header') {
+ setHeader(value)
+ } else {
+ setQuote(value)
+ }
+ }
+
useEffect(() => {
async function getCurrentMonthlyNews() {
const monthlyNewsService = new MonthlyNewsService()
@@ -37,10 +53,10 @@ const Editing: React.FC = () => {
date.getMonth(),
user.xsrftoken
)
- console.log('news', news)
if (news) {
setHeader(news.header)
setQuote(news.quote)
+ setIsTouched(false)
}
}
getCurrentMonthlyNews()
@@ -67,7 +83,9 @@ const Editing: React.FC = () => {
'undo redo | bold italic underline | alignleft aligncenter alignright | code',
}}
value={header}
- onEditorChange={(newHeader, editor) => setHeader(newHeader)}
+ onEditorChange={(newHeader, editor) =>
+ handleEditorChange(newHeader, 'header')
+ }
/>
<div className="subtitle">
<p className="title">Citation du mois</p>
@@ -81,7 +99,9 @@ const Editing: React.FC = () => {
'undo redo | bold italic underline | alignleft aligncenter alignright | code',
}}
value={quote}
- onEditorChange={(newQuote, editor) => setQuote(newQuote)}
+ onEditorChange={(newQuote, editor) =>
+ handleEditorChange(newQuote, 'quote')
+ }
/>
<button className="btnCancel" onClick={handleCancel}>
Annuler
--
GitLab