EthicApp-Development · jigracia · Nov 4, 2023 · Nov 4, 2023 · Nov 4, 2023 · Nov 4, 2023
diff --git a/admin-panel/public/android-chrome-192x192.png b/admin-panel/public/android-chrome-192x192.png
diff --git a/admin-panel/public/android-chrome-512x512.png b/admin-panel/public/android-chrome-512x512.png
diff --git a/admin-panel/public/apple-touch-icon.png b/admin-panel/public/apple-touch-icon.png
diff --git a/admin-panel/public/favicon-16x16.png b/admin-panel/public/favicon-16x16.png
diff --git a/admin-panel/public/favicon-32x32.png b/admin-panel/public/favicon-32x32.png
diff --git a/admin-panel/public/favicon.ico b/admin-panel/public/favicon.ico
diff --git a/admin-panel/public/index.html b/admin-panel/public/index.html
@@ -24,7 +24,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>React App</title>
+    <title>EthicApp Admin-Panel</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>

diff --git a/admin-panel/public/logo192.png b/admin-panel/public/logo192.png
diff --git a/admin-panel/public/logo512.png b/admin-panel/public/logo512.png
diff --git a/admin-panel/public/manifest.json b/admin-panel/public/manifest.json
@@ -1,25 +1 @@
-{
-  "short_name": "React App",
-  "name": "Create React App Sample",
-  "icons": [
-    {
-      "src": "favicon.ico",
-      "sizes": "64x64 32x32 24x24 16x16",
-      "type": "image/x-icon"
-    },
-    {
-      "src": "logo192.png",
-      "type": "image/png",
-      "sizes": "192x192"
-    },
-    {
-      "src": "logo512.png",
-      "type": "image/png",
-      "sizes": "512x512"
-    }
-  ],
-  "start_url": ".",
-  "display": "standalone",
-  "theme_color": "#000000",
-  "background_color": "#ffffff"
-}
+{"name":"","short_name":"","icons":[{"src":"android-chrome-192x192.png","sizes":"192x192","type":"image/png"},{"src":"android-chrome-512x512.png","sizes":"512x512","type":"image/png"}],"theme_color":"#ffffff","background_color":"#ffffff","display":"standalone"}
diff --git a/admin-panel/src/App.js b/admin-panel/src/App.js
@@ -25,7 +25,7 @@ function App() {
   const [translation, i18n] = useTranslation("global")
 
   const handleChangeLanguage = ()=>{
-    if(i18n.language=="es"){
+    if(i18n.language==="es"){
       i18n.changeLanguage("en")
     }
     else{

diff --git a/admin-panel/src/assets/ethicapp-logo.png b/admin-panel/src/assets/ethicapp-logo.png
diff --git a/admin-panel/src/components/GraphDataParser.js b/admin-panel/src/components/GraphDataParser.js
@@ -3,7 +3,7 @@ function ParseGraphData(apiData){
 
     let graphDataTemp={}
 
-    if (apiData["report_type"] == "start_activity" || apiData["report_type"] == "top_professors") {
+    if (apiData["report_type"] === "start_activity" || apiData["report_type"] === "top_professors") {
         graphDataTemp = {
             labels: apiData["report_x_data"],
             datasets: [
@@ -38,9 +38,9 @@ function ParseGraphData(apiData){
 function ParseGraphOptions(apiData){
     let options={}
 
-    if (apiData["report_type"] == "start_activity" || apiData["report_type"] == "top_professors") {
+    if (apiData["report_type"] === "start_activity" || apiData["report_type"] === "top_professors") {
       let auxXLabel= "Activity Date";
-      if (apiData["report_type"] == "top_professors") {
+      if (apiData["report_type"] === "top_professors") {
         auxXLabel= "Professor Name"
       }
       options = {
@@ -62,6 +62,7 @@ function ParseGraphOptions(apiData){
             },
           },
           responsive: true,
+          maintainAspectRatio: false,
           pointStyle: 'rectRot',
           plugins: {
             title: {
@@ -81,7 +82,7 @@ function ParseGraphOptions(apiData){
         };
     }else{
       let auxYLabel= "EthicApp Logins";
-      if (apiData["report_type"] == "create_account") {
+      if (apiData["report_type"] === "create_account") {
         auxYLabel= "Accounts Created"
       }
       options = {
@@ -104,6 +105,7 @@ function ParseGraphOptions(apiData){
             },
           },
           responsive: true,
+          maintainAspectRatio: false,
           plugins: {
             title: {
               display: true,
@@ -121,7 +123,7 @@ function ParseGraphOptions(apiData){
 };
 
 export function CreateGraph(apiData){
-    if (apiData["report_type"] == "start_activity") {
+    if (apiData["report_type"] === "start_activity") {
         return <>
             <Line data={ParseGraphData(apiData)} options={ParseGraphOptions(apiData)} />
         </>
@@ -158,6 +160,9 @@ export function GetDateRange(formData){
       endDate = formData.endDate;
       initialDate = formData.startDate;
       break;
+
+    default:
+      break;
    }
 
     return{

diff --git a/admin-panel/src/components/InstitutionForm.js b/admin-panel/src/components/InstitutionForm.js
@@ -127,6 +127,7 @@ const InstitutionForm = (props) =>{
                         <Button
                             variant="contained"
                             component="span"
+                            style={{textTransform:"none"}}
                             startIcon={<CloudUpload />}
                         >
                             {translation("institutionForm.file-upload")}
@@ -143,6 +144,7 @@ const InstitutionForm = (props) =>{
                     <Grid item xs={12}>
                         <Button
                             type="submit"
+                            style={{textTransform:"none"}}
                             variant="contained"
                             color="primary"
                             fullWidth

diff --git a/admin-panel/src/components/LoginForm.js b/admin-panel/src/components/LoginForm.js
@@ -33,6 +33,7 @@ const LoginForm = (props) =>{
             type="submit"
             fullWidth
             variant="contained"
+            style={{textTransform:"none"}}
             sx={{ mt: 3, mb: 2 }}
             >
                 {translation("loginForm.submit")}

diff --git a/admin-panel/src/components/NavBars.js b/admin-panel/src/components/NavBars.js
@@ -3,6 +3,9 @@ import React, {useState} from "react"
 import {useLocation, Link} from "react-router-dom"
 import Cookies from 'js-cookie';
 
+//ASSETS
+import logo from '../assets/ethicapp-logo.png'
+
 //MUI
 import {styled} from '@mui/material/styles';
 import MuiDrawer from '@mui/material/Drawer';
@@ -129,7 +132,7 @@ export default function NavBar(props){
                   {translation("navbar.title")}
                 </Typography>
                 <Tooltip title={translation("navbar.changeLanguageTooltip")}>
-                  <Button variant="contained" style={{ marginRight: '2rem' }}size="medium" color="success" onClick={()=> handleChangeLanguage()}>
+                  <Button variant="contained" style={{ marginRight: '2rem', textTransform:"none"}}size="medium" color="success" onClick={()=> handleChangeLanguage()}>
                     {translation("navbar.counterLang")}
                   </Button>
                 </Tooltip>
@@ -149,6 +152,7 @@ export default function NavBar(props){
                   px: [1],
                 }}
               >
+                <img src={logo} alt="Logo" style={{height:"40px", right:"25%"}}/>
                 <Tooltip title={translation("navbar.closeBar")}>
                   <IconButton onClick={toggleDrawer}>
                     <ChevronLeftIcon />

diff --git a/admin-panel/src/components/ReportGraphBox.js b/admin-panel/src/components/ReportGraphBox.js
@@ -7,6 +7,7 @@ import jsPDF from 'jspdf';
 const ReportGraphBox = (props) =>{
 
     const translation = props.translation;
+    const downloadTitle = props.downloadTitle;
 
     const graph = props.graph;
     const visibility = props.visibility;
@@ -15,6 +16,24 @@ const ReportGraphBox = (props) =>{
 
     const captureChartAsImage = () => {
         console.log(graphRef.current)
+
+        const chileTimezoneOffset = -3; // Chile is typically in UTC-3 time zone
+        const currentDate = new Date();
+
+        // Adjust the date and time to the Chile timezone
+        currentDate.setUTCHours(currentDate.getUTCHours() + chileTimezoneOffset);
+
+        // Get individual date and time components
+        const day = currentDate.getUTCDate().toString().padStart(2, '0');
+        const month = (currentDate.getUTCMonth() + 1).toString().padStart(2, '0');
+        const year = currentDate.getUTCFullYear();
+        const hours = currentDate.getUTCHours().toString().padStart(2, '0');
+        const minutes = currentDate.getUTCMinutes().toString().padStart(2, '0');
+        const seconds = currentDate.getUTCSeconds().toString().padStart(2, '0');
+
+        // Create the formatted string
+        const formattedTime = `${day}-${month}-${year}_${hours}-${minutes}-${seconds}`;
+
         if (graphRef.current) {
         html2canvas(graphRef.current).then((canvas) => {
             const imgData = canvas.toDataURL('image/png');
@@ -25,7 +44,7 @@ const ReportGraphBox = (props) =>{
             const x = 0;
             const y = (pdf.internal.pageSize.getHeight() - pdfHeight) / 2;
             pdf.addImage(imgData, 'PNG', x, y, pdfWidth, pdfHeight);
-            pdf.save('chart.pdf');
+            pdf.save(downloadTitle+"_"+formattedTime+'_chart.pdf');
         });
         }
     };
@@ -35,7 +54,7 @@ const ReportGraphBox = (props) =>{
             <Grid item xs={12} md={6}>
                 <Paper elevation={3} style={{ height: '100%' }}>
                     <Box p={3} display="flex" flexDirection="column" alignItems="center">
-                        <div style={{ width: '150vh', height: 'auto' }} ref={graphRef}>
+                        <div style={{ width: '99%', height: '75vh' }} ref={graphRef}>
                             {graph}
                         </div>
                         <br />

diff --git a/admin-panel/src/components/ReportOptionsBox.js b/admin-panel/src/components/ReportOptionsBox.js
@@ -5,6 +5,9 @@ const ReportOptionsBox = (props) =>{
     const translation = props.translation;
     const handleSubmit = props.handleSubmit;
     const handleChange = props.handleChange;
+    const formStartDateValue = props.formStartDateValue;
+    const formEndDateValue = props.formEndDateValue;
+    const selectedOption = props.selectedOption;
 
     return <Grid item xs={12} md={6}>
         <Paper elevation={3} style={{ height: '100%' }}>
@@ -24,6 +27,7 @@ const ReportOptionsBox = (props) =>{
                             aria-label="report-option"
                             name="reportOption"
                             onChange={handleChange}
+                            value={selectedOption}
                             required
                         >
                             <FormControlLabel
@@ -61,6 +65,7 @@ const ReportOptionsBox = (props) =>{
                         label={translation("ReportOptionsBox.startDate")}
                         type="date"
                         fullWidth
+                        value={formStartDateValue}
                         InputLabelProps={{
                             shrink: true,
                         }}
@@ -74,6 +79,7 @@ const ReportOptionsBox = (props) =>{
                         label={translation("ReportOptionsBox.endDate")}
                         type="date"
                         fullWidth
+                        value={formEndDateValue}
                         InputLabelProps={{
                             shrink: true,
                         }}
@@ -82,7 +88,7 @@ const ReportOptionsBox = (props) =>{
                     </Grid>
                     </Grid>
                     <br />
-                    <Button type="submit" variant="contained" color="primary">
+                    <Button type="submit" variant="contained" color="primary" style={{textTransform:"none"}}>
                     {translation("ReportOptionsBox.generateReport")}
                     </Button>
                 </Box>

diff --git a/admin-panel/src/components/Toast.js b/admin-panel/src/components/Toast.js
@@ -0,0 +1,31 @@
+import React from 'react';
+import Snackbar from '@mui/material/Snackbar';
+import MuiAlert from '@mui/material/Alert';
+
+const Alert = React.forwardRef(function Alert(props, ref) {
+  return <MuiAlert elevation={6} ref={ref} variant="filled" {...props} />;
+});
+
+let severityToast;
+
+const Toast = ({ open, message, onClose, severity }) => {
+  if (severity===0) {
+    severityToast="error"
+  } else {
+    severityToast="success"
+  }
+  return (
+    <Snackbar
+      open={open}
+      autoHideDuration={1500}
+      onClose={onClose}
+      anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
+    >
+      <Alert onClose={onClose} severity={severityToast}>
+        {message}
+      </Alert>
+    </Snackbar>
+  );
+};
+
+export default Toast;
diff --git a/admin-panel/src/languages/EN_US/english.json b/admin-panel/src/languages/EN_US/english.json
@@ -8,7 +8,9 @@
     },
     "login":{
         "login": "Sign in",
-        "return": "Back To Ethicapp"
+        "return": "Back To Ethicapp",
+        "error": "Incorrect Credentials",
+        "noAdmin": "User does not have access to Admin Panel"
     },
     "reports":{
         "title": "Report Generation",
@@ -59,13 +61,17 @@
         "create_account_desc": "Information about the report of type: create_account",
         "logins_desc": "Information about the report of type: logins",
         "top_professors_desc": "Information about the report of type: top_professors",
-        "formError": "Please select a report option"
+        "formError": "Please select a report option",
+        "formErrorDates": "Select valid dates"
     },
     "users":{
         "title": "Users Page",
         "subTitle": "Show all the user related actions."
     },
-
+    "institution":{
+        "success": "Success: Form updated successfully",
+        "error": "Error: Form update failed"
+    },
     "institutionForm":{
         "title": "Institution Data",
         "subTitle": "From here you can update the data of the institution for which EthicApp operates.",

diff --git a/admin-panel/src/languages/ES_CL/spanish.json b/admin-panel/src/languages/ES_CL/spanish.json
@@ -8,7 +8,9 @@
     },
     "login":{
         "login": "Ingresar",
-        "return": "Volver a Ethicapp"
+        "return": "Volver a Ethicapp",
+        "error": "Credenciales incorrectas",
+        "noAdmin": "El usuario no tiene acceso al panel de administración"
     },
     "reports":{
         "title": "Generación de Reportes",
@@ -56,13 +58,17 @@
         "logins_title": "Generación de reportes Ingresos a Ethicapp",
         "top_professors_title": "Generación de reportes Top Actividades Iniciadas por Profesor",
         "subTitle": "Introduzca información sobre los informes específicos que se están generando.",
-        "formError": "Seleccione una opción de informe"
+        "formError": "Seleccione una opción de informe",
+        "formErrorDates": "Seleccione fechas validas"
     },
     "users":{
         "title": "Pagina de Usuarios",
         "subTitle": "Mostrar todas las acciones relacionadas con el usuario."
     },
-
+    "institution":{
+        "success": "Éxito: Formulario actualizado correctamente",
+        "error": "Error: Error en la actualización del formulario"
+    },
     "institutionForm":{
         "title": "Datos de la Institución",
         "subTitle": "Desde aquí puede actualizar los datos de la institución para la que opera EthicApp.",