Pre prod to prod

package.json

@@ -9,6 +9,7 @@
     "classnames": "^2.5.1",
     "file-saver": "^2.0.5",
     "i18next": "^23.10.1",
+    "lz-string": "^1.5.0",
     "react": "^18.2.0",
     "react-bootstrap": "^2.10.1",
     "react-dom": "^18.2.0",

public/index.html

@@ -5,7 +5,7 @@
   <meta charset="utf-8">
 
   <meta name="viewport" content="width=device-width, initial-scale=1">
-  <meta name="description" content="Web site created using create-react-app">
+  <meta name="description" content="O validador de práticas de acessibilidade Web (WCAG 2.1)">
   <link rel="icon" href="%PUBLIC_URL%/favicon.ico">
 
   <title>AccessMonitor</title>

src/pages/Details/index.js

@@ -14,6 +14,8 @@ import { useParams, useNavigate, useLocation } from "react-router-dom";
 
 import { tot } from '../Resume'
 
+import LZString from 'lz-string';
+
 import { pathURL } from "../../App";
 
 export let tot2;
@@ -26,14 +28,25 @@ export default function Details({ allData, setAllData }) {
   const { theme } = useContext(ThemeContext);
 
   const [loadingProgress, setLoadingProgress] = useState(true);
+  const [error, setError] = useState(false);
+
+  const contentHtml = location.state?.contentHtml || null;
 
   const themeClass = theme === "light" ? "" : "dark_mode-details";
 
   const url = allData?.rawUrl;
-  const handleGoBack = () => {
-    const test = location.pathname.split("/")
 
-    navigate(`${pathURL}results/${test[test.length-2]}`);
+  const handleGoBack = () => {
+    if(!url) {
+      navigate(`${pathURL}results/html`, {
+        state: {
+          contentHtml: contentHtml
+        },
+      })
+    } else {
+      const test = location.pathname.split("/")
+      navigate(`${pathURL}results/${test[test.length-2]}`);
+    }
   };
 
   const textHeading = t(`ELEMS.${details}`);
@@ -49,7 +62,6 @@ export default function Details({ allData, setAllData }) {
       title: url || "html",
       href: "",
     },
-
     {
       title: textHeading,
       href: "#",
@@ -71,7 +83,8 @@ export default function Details({ allData, setAllData }) {
           setLoadingProgress(false);
           return;
         }
-        const storedData = localStorage.getItem("evaluation");
+        const compressedData = localStorage.getItem("evaluation");
+        const storedData = LZString.decompressFromUTF16(compressedData);
         const storedUrl = localStorage.getItem("evaluationUrl");
         const test = location.pathname.split("/")
         let url = test[test.length-2]
@@ -87,18 +100,25 @@ export default function Details({ allData, setAllData }) {
           return;
         }
         const response = await getEvalData(false, currentUrl);
-
-        if (url !== "html") {
-          localStorage.setItem("evaluation", JSON.stringify(response.data));
-          localStorage.setItem("evaluationUrl", currentUrl);
+        if(response.data.success !== 1 && !response.result) {
+          setError(t("MISC.unexpected_error"))
+          setLoadingProgress(false);
+        } else {
+          if (url !== "html") {
+            const compressedData = LZString.compressToUTF16(JSON.stringify(response.data));
+            localStorage.setItem("evaluation", compressedData);
+            localStorage.setItem("evaluationUrl", currentUrl);
+          }
+
+          tot2 = response?.data?.result?.data.tot;
+          setAllData(response.data?.result?.data);
+          getDetailsData(response.data?.result?.data);
+          setLoadingProgress(false);
         }
-
-        tot2 = response?.data?.result?.data.tot;
-        setAllData(response.data?.result?.data);
-        getDetailsData(response.data?.result?.data);
-        setLoadingProgress(false);
       } catch (error) {
+        console.error("Erro", error);
         setLoadingProgress(false);
+        setError(t("MISC.unexpected_error"))
       }
     };
 
@@ -143,7 +163,7 @@ export default function Details({ allData, setAllData }) {
             <LoadingComponent loadingText={t("MISC.loading")} darkTheme={theme} />
           </section>
         ) : 
-          <>
+        !error ? <>
             <div className="bg-white show_details">
               <div className="d-flex flex-row justify-content-between align-items-center show_details-container">
                 <div className="d-flex flex-row align-items-center">
@@ -167,7 +187,7 @@ export default function Details({ allData, setAllData }) {
             <div className="tabContent_container-details">
               <TableDetails data={dataTable?.elements} />
             </div>
-          </>
+          </> : <h3>{error}</h3>
         }
       </div>
     </>

src/pages/Home/_components/insert-upload-html.js

@@ -27,7 +27,7 @@ export function InsertHtmlUpload() {
   const handleChange = async (event) => {
     const file = event.target.files[0];
 
-    if (file.type === "text/html") {
+    if (file && file.type === "text/html") {
       const reader = new FileReader();
       reader.onload = async () => {
         const html = reader.result;
@@ -58,13 +58,13 @@ export function InsertHtmlUpload() {
 
   return (
     <form onSubmit={handleSubmit}>
-      <label htmlFor={t("HOME_PAGE.file_label")} className="margin-bottom upload_label">{t("HOME_PAGE.file_title")}</label>
+      <label htmlFor={"escrever_ficheiro"} className="margin-bottom upload_label">{t("HOME_PAGE.file_title")}</label>
       <div className="input-group mb-3 d-flex justify-content-start align-items-start">
         <button className="btn" type="button" onClick={handleButtonClick}>
           {t("HOME_PAGE.file_label")}
         </button>
         <input
-          id={t("HOME_PAGE.file_label")}
+          id={"escrever_ficheiro"}
           ref={fileInputRef}
           type="file"
           className="form-control"

src/pages/Home/_components/styles.css

@@ -12,6 +12,7 @@
   margin-right: 10px;
   position: absolute;
   z-index: 10;
+  min-width: 130px;
 }
 
 .input-group .btn:hover {
@@ -27,14 +28,14 @@
   margin-bottom: 15px;
 }
 
-input[type=file].form-control::file-selector-button {
+/* input[type=file].form-control::file-selector-button {
   display: none;
-}
+} */
 
 input[type=file] {
   margin-bottom: 0px;
-  margin-left: 100px !important;
-  padding-left: 90px;
+  padding-left: 0px;
+  margin-left: 30px !important;
   border: 2px solid var(--ama-color-brand-primary) !important;
   border-radius: 0;
 }

src/pages/Home/styles.css

@@ -5,7 +5,7 @@
 .validator_container {
   padding: 62px 60px;
   display: grid;
-  grid-template-columns: 55% 45%;
+  grid-template-columns: 70% 30%;
 }
 
 .validator_container_description {
@@ -15,7 +15,7 @@
 }
 
 .validator_container .right_container {
-  place-content: flex-start center;
+  place-content: flex-end;
 }
 
 .verify_img {

src/pages/PageCode/index.js

@@ -12,13 +12,17 @@ import { ThemeContext } from "../../context/ThemeContext";
 
 import { downloadCSV } from "../../utils/utils";
 
+import LZString from 'lz-string';
+
 import { pathURL } from "../../App";
 
 export default function Resume() {
   const location = useLocation();
   const navigate = useNavigate();
   const { t } = useTranslation();
 
+  const [error, setError] = useState(false);
+
   const [dataProcess, setDataProcess] = useState([]);
   const [loadingProgress, setLoadingProgress] = useState(true);
   const [originalData, setOriginalData] = useState([]);
@@ -33,9 +37,16 @@ export default function Resume() {
   const code = location.state?.code || null;
 
   const handleGoBack = () => {
-    const test = location.pathname.split("/")
-
-    navigate(`${pathURL}results/${test[test.length-2]}`);
+    if(!dataProcess?.metadata?.url) {
+      navigate(`${pathURL}results/html`, {
+        state: {
+          contentHtml: pageCode
+        },
+      })
+    } else {
+      const test = location.pathname.split("/")
+      navigate(`${pathURL}results/${test[test.length-2]}`);
+    }
   };
 
   useEffect(() => {
@@ -50,32 +61,40 @@ export default function Resume() {
           setLoadingProgress(false);
           return;
         }
-        const storedData = localStorage.getItem("evaluation");
+        const compressedData = localStorage.getItem("evaluation");
+        const storedData = LZString.decompressFromUTF16(compressedData);
         const storedUrl = localStorage.getItem("evaluationUrl");
         const test = location.pathname.split("/")
         let url = test[test.length-2]
         const currentUrl = decodeURIComponent(url)
         if (storedData && storedUrl === currentUrl) {
           const parsedStoredData = JSON.parse(storedData);
           setOriginalData(parsedStoredData);
-          setDataProcess(processData(parsedStoredData?.result?.data?.tot));
+          setDataProcess(processData(parsedStoredData?.result?.data?.tot, url));
           setPageCode(parsedStoredData?.result?.pagecode || "html");
           setLoadingProgress(false);
           return;
         }
         const response = await getEvalData(false, currentUrl);
-        if (url !== "html") {
-          localStorage.setItem("evaluation", JSON.stringify(response.data));
-          localStorage.setItem("evaluationUrl", currentUrl);
+        if(response.data.success !== 1 && !response.result) {
+          setError(t("MISC.unexpected_error"))
+          setLoadingProgress(false);
+        } else {
+          if (url !== "html") {
+            const compressedData = LZString.compressToUTF16(JSON.stringify(response.data));
+            localStorage.setItem("evaluation", compressedData);
+            localStorage.setItem("evaluationUrl", currentUrl);
+          }
+
+          setOriginalData(response.data);
+          setDataProcess(processData(response.data?.result?.data?.tot, url));
+          setPageCode(response.data?.result?.pagecode || "html");
+          setLoadingProgress(false);
         }
-
-        setOriginalData(response.data);
-        setDataProcess(processData(response.data?.result?.data?.tot));
-        setPageCode(response.data?.result?.pagecode || "html");
-        setLoadingProgress(false);
       } catch (error) {
         console.error("Erro", error);
         setLoadingProgress(false);
+        setError(t("MISC.unexpected_error"))
       }
     };
 
@@ -115,14 +134,14 @@ export default function Resume() {
             <LoadingComponent loadingText={t("MISC.loading")} darkTheme={theme} />
           </section>
         ) : (
-          <ButtonsActions
-            downloadCSV={() => downloadCSV(dataProcess, originalData, t)}
-            handleGoBack={() => handleGoBack()}
-            themeClass={themeClass}
-          />
+          !error ? <ButtonsActions
+              downloadCSV={() => downloadCSV(dataProcess, originalData, t)}
+              handleGoBack={() => handleGoBack()}
+              themeClass={themeClass}
+            /> : <h3>{error}</h3>
         )}
       </div>
-      {!loadingProgress ? <section className="html_code">
+      {!loadingProgress && !error ? <section className="html_code">
         <pre tabIndex="0">{pageCode || `<></>`}</pre>
       </section> : null}
     </div>