From 3877e974c59b537d98e30df3b3a8402b2f108c99 Mon Sep 17 00:00:00 2001
From: divlo <contact@divlo.fr>
Date: Tue, 4 Aug 2020 11:36:20 +0200
Subject: [PATCH] =?UTF-8?q?=E2=9C=A8=20linkShortener:=20Add=20a=20link=20i?=
 =?UTF-8?q?n=20the=20list=20too?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 api/controllers/links_shortener.js        |  3 +-
 website/pages/functions/linkShortener.jsx | 49 +++++++++++++++++------
 2 files changed, 39 insertions(+), 13 deletions(-)

diff --git a/api/controllers/links_shortener.js b/api/controllers/links_shortener.js
index eac7749..5e8c087 100644
--- a/api/controllers/links_shortener.js
+++ b/api/controllers/links_shortener.js
@@ -79,7 +79,8 @@ exports.postLink = async (req, res, next) => {
     const shortcutLinkResult = `${shortLinkBaseURL}/${result.shortcut}`
     return res.status(200).json({
       resultHTML: `URL Raccourcie : <br/> <br/> <a target="_blank" rel="noopener noreferrer" href="${shortcutLinkResult}">${shortcutLinkResult}</a>`,
-      result: shortcutLinkResult
+      result: shortcutLinkResult,
+      linkDatabase: result
     })
   } catch (error) {
     console.log(error)
diff --git a/website/pages/functions/linkShortener.jsx b/website/pages/functions/linkShortener.jsx
index de5ccfa..79adc94 100644
--- a/website/pages/functions/linkShortener.jsx
+++ b/website/pages/functions/linkShortener.jsx
@@ -16,9 +16,9 @@ import 'notyf/notyf.min.css'
 import '../../public/css/pages/FunctionComponent.css'
 import '../../public/css/pages/admin.css'
 
-const CreateLink = () => {
+const CreateLink = ({ linksData, setLinksData }) => {
   const { isAuth, user } = useContext(UserContext)
-  const [inputState, setInputState] = useState({})
+  const [inputState, setInputState] = useState({ url: '', shortcutName: '' })
   const [message, setMessage] = useState('')
   const [isLoading, setIsLoading] = useState(false)
 
@@ -29,6 +29,9 @@ const CreateLink = () => {
       const response = await api.post('/links', inputState, {
         headers: { Authorization: user.token }
       })
+      const linksDataState = { ...linksData }
+      linksDataState.rows.push(response.data.linkDatabase)
+      setLinksData(linksDataState)
       setMessage(response.data.resultHTML)
       setIsLoading(false)
       setInputState({ url: '', shortcutName: '' })
@@ -66,6 +69,7 @@ const CreateLink = () => {
                 Entrez le lien à raccourcir :
               </label>
               <input
+                value={inputState.url}
                 onChange={handleChange}
                 type='text'
                 name='url'
@@ -80,6 +84,7 @@ const CreateLink = () => {
                 Entrez le nom du raccourci :
               </label>
               <input
+                value={inputState.shortcutName}
                 onChange={handleChange}
                 type='text'
                 name='shortcutName'
@@ -105,14 +110,13 @@ const CreateLink = () => {
 }
 
 let pageLinks = 1
-const LinksList = () => {
+const LinksList = ({
+  linksData,
+  setLinksData,
+  isLoadingLinks,
+  setLoadingLinks
+}) => {
   const { isAuth, user } = useContext(UserContext)
-  const [linksData, setLinksData] = useState({
-    hasMore: true,
-    rows: [],
-    totalItems: 0
-  })
-  const [isLoadingLinks, setLoadingLinks] = useState(true)
   const [isEditing, setIsEditing] = useState(false)
 
   const [defaultInputState, setDefaultInputState] = useState({
@@ -288,7 +292,11 @@ const LinksList = () => {
                         <td className='table-row'>
                           <a href={link.url}>{link.url}</a>
                         </td>
-                        <td className='table-row'>{link.shortcut}</td>
+                        <td className='table-row'>
+                          <a href={`https://s.divlo.fr/${link.shortcut}`}>
+                            {link.shortcut}
+                          </a>
+                        </td>
                         <td
                           style={{ cursor: 'pointer' }}
                           onClick={() => handleEditLink(link)}
@@ -399,16 +407,33 @@ const LinksList = () => {
 }
 
 const FunctionTabManager = props => {
+  const [linksData, setLinksData] = useState({
+    hasMore: true,
+    rows: [],
+    totalItems: 0
+  })
+  const [isLoadingLinks, setLoadingLinks] = useState(true)
+
   return (
     <FunctionTabs
       setSlideIndex={props.setSlideIndex}
       slideIndex={props.slideIndex}
     >
       <div className='FunctionComponent__slide'>
-        <CreateLink />
+        <CreateLink
+          linksData={linksData}
+          setLinksData={setLinksData}
+          isLoadingLinks={isLoadingLinks}
+          setLoadingLinks={setLoadingLinks}
+        />
       </div>
       <div className='FunctionComponent__slide'>
-        <LinksList />
+        <LinksList
+          linksData={linksData}
+          setLinksData={setLinksData}
+          isLoadingLinks={isLoadingLinks}
+          setLoadingLinks={setLoadingLinks}
+        />
       </div>
       <div className='FunctionComponent__slide'>
         <FunctionArticle article={props.article} />