From a4ff8eb93169899e8ed2df55fb9f6570e4d5c1d5 Mon Sep 17 00:00:00 2001
From: "guilhem.carron" <gcarron@grandlyon.com>
Date: Tue, 27 Jul 2021 11:55:12 +0200
Subject: [PATCH] Add editor service

---
 src/components/Editing/Editing.tsx  | 48 ++++++-----------------------
 src/components/Editing/editing.scss |  3 ++
 src/services/editor.service.ts      | 36 ++++++++++++++++++++++
 3 files changed, 49 insertions(+), 38 deletions(-)
 create mode 100644 src/services/editor.service.ts

diff --git a/src/components/Editing/Editing.tsx b/src/components/Editing/Editing.tsx
index 03528b3e..22a098db 100644
--- a/src/components/Editing/Editing.tsx
+++ b/src/components/Editing/Editing.tsx
@@ -3,35 +3,16 @@ import 'react-datepicker/dist/react-datepicker.css'
 import { Editor } from '@tinymce/tinymce-react'
 import DateSelector from '../DateSelector/DateSelector'
 import './editing.scss'
+import { EditorService } from '../../services/editor.service'
 
 const Editing: React.FC = () => {
   const [date, setDate] = useState<string>('')
   const [header, setHeader] = useState<string>('')
   const [quote, setQuote] = useState<string>('')
 
-  async function handleSave() {
-    try {
-      const response = await fetch(
-        'https://localhost:1443/api/admin/monthlyNews',
-        {
-          method: 'POST',
-          body: JSON.stringify({
-            month: date.split('-')[0],
-            year: date.split('-')[1],
-            header: header,
-            quote: quote,
-          }),
-        }
-      )
-      if (response.status !== 201) {
-        throw new Error(
-          `Le post n'a pas pu être créé (code ${response.status})`
-        )
-      }
-      console.log('Le post a été créé avec succès')
-    } catch (e) {
-      console.log(e)
-    }
+  const handleSave = async () => {
+    const editorService = new EditorService()
+    await editorService.sendQuotation(date, header, quote)
   }
 
   useEffect(() => {
@@ -48,14 +29,9 @@ const Editing: React.FC = () => {
       </div>
       <div className="content">
         <DateSelector date={date} setDate={setDate} />
-
-        <section className="hero is-small is-info">
-          <div className="hero-body">
-            <p className="title">Informations du mois</p>
-            <p className="subtitle"></p>
-          </div>
-        </section>
-
+        <div className="subtitle">
+          <p className="title">Informations du mois</p>
+        </div>
         <div>
           <Editor
             initialValue=""
@@ -67,13 +43,9 @@ const Editing: React.FC = () => {
             value={header}
             onEditorChange={(newHeader, editor) => setHeader(newHeader)}
           />
-
-          <section className="hero is-small is-info">
-            <div className="hero-body">
-              <p className="title">Citation du mois</p>
-              <p className="subtitle"></p>
-            </div>
-          </section>
+          <div className="subtitle">
+            <p className="title">Citation du mois</p>
+          </div>
 
           <Editor
             initialValue=""
diff --git a/src/components/Editing/editing.scss b/src/components/Editing/editing.scss
index ea763643..1bebdaa7 100644
--- a/src/components/Editing/editing.scss
+++ b/src/components/Editing/editing.scss
@@ -12,3 +12,6 @@
 .content {
   padding: 1rem;
 }
+.subtitle {
+  margin: 1rem 0;
+}
diff --git a/src/services/editor.service.ts b/src/services/editor.service.ts
new file mode 100644
index 00000000..dbf75c2c
--- /dev/null
+++ b/src/services/editor.service.ts
@@ -0,0 +1,36 @@
+export class EditorService {
+  /**
+   * Createsa quotation and header for selected month
+   * @param date
+   * @param header
+   * @param quote
+   */
+  public sendQuotation = async (
+    date: string,
+    header: string,
+    quote: string
+  ): Promise<void> => {
+    try {
+      const response = await fetch(
+        'https://localhost:1443/api/admin/monthlyNews',
+        {
+          method: 'POST',
+          body: JSON.stringify({
+            month: date.split('-')[0],
+            year: date.split('-')[1],
+            header: header,
+            quote: quote,
+          }),
+        }
+      )
+      if (response.status !== 201) {
+        throw new Error(
+          `Le post n'a pas pu être créé (code ${response.status})`
+        )
+      }
+      console.log('Le post a été créé avec succès')
+    } catch (e) {
+      console.log(e)
+    }
+  }
+}
-- 
GitLab