From d37f901e93939881f151d66abc0faeee6a5bcb9d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20FAMIBELLE-PRONZOLA?= <c.pronzola@live.fr>
Date: Sun, 30 May 2021 16:59:56 +0200
Subject: [PATCH] Fix align teks by adding alignTeks method

---
 components/teks/teks-drawer.js | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

diff --git a/components/teks/teks-drawer.js b/components/teks/teks-drawer.js
index 275f58b..157cd2f 100644
--- a/components/teks/teks-drawer.js
+++ b/components/teks/teks-drawer.js
@@ -125,6 +125,24 @@ const langToArray = anTeks => {
   return langArray
 }
 
+const alignTeks = (langArray, isMobile) => {
+  if (langArray.length > 0 && !isMobile) {
+    return 'justify'
+  }
+
+  if (langArray.length > 0 && isMobile) {
+    return 'justify'
+  }
+
+  if (langArray.length === 0 && isMobile) {
+    return 'justify'
+  }
+
+  if (langArray.length === 0 && !isMobile) {
+    return 'center'
+  }
+}
+
 export default function TeksDrawer({teks, anTeks}) {
   const isMobile = useMediaQuery('(max-width:800px)')
   const langArray = langToArray(anTeks)
@@ -232,7 +250,7 @@ export default function TeksDrawer({teks, anTeks}) {
                   <Typography align='center' className={classes.text} variant='h4'>
                     Transcription
                   </Typography>
-                  <Typography paragraph align={langArray.length === 0 && isMobile ? 'justify' : 'center'} component='span'>
+                  <Typography paragraph align={alignTeks(langArray, isMobile)} component='span'>
                     {formatJsonString(anTeks.transkripsyon)}
                   </Typography>
                 </div>