diff --git a/webapp/src/components/BarChartReport/custom-barChart.js b/webapp/src/components/BarChartReport/custom-barChart.js
index 84e0ebc3..0bf2f7d2 100644
--- a/webapp/src/components/BarChartReport/custom-barChart.js
+++ b/webapp/src/components/BarChartReport/custom-barChart.js
@@ -4,16 +4,18 @@ import { makeStyles } from '@mui/styles'
 import PropTypes from 'prop-types'
 import { Box } from '@mui/system'
 import {
-  ComposedChart,
-  Bar,
-  XAxis,
-  YAxis,
+  ResponsiveContainer,
   CartesianGrid,
+  ComposedChart,
   Tooltip,
   Legend,
-  ResponsiveContainer
+  XAxis,
+  YAxis,
+  Bar
 } from 'recharts'
 
+import Loader from '../Loader'
+
 import CustomTooltipBarChart from './custom-tooltip-barChart'
 import styles from './styles'
 
@@ -59,43 +61,49 @@ const CustomBarChart = ({ typeData, selectedUSD, data, barRef }) => {
 
   return (
     <ResponsiveContainer width="100%" height={300} marginTop="16px">
-      <ComposedChart
-        margin={{ top: 8, right: 16 }}
-        height={300}
-        data={data}
-        ref={barRef}
-      >
-        <CartesianGrid stroke="#f0f0f0" />
-        <XAxis
-          tick={{ fontSize: 10, stroke: '#000', strokeWidth: 0.5 }}
-          dataKey="election"
-          scale="auto"
-        />
-        <YAxis tick={{ fontSize: '10px', stroke: '#000', strokeWidth: 0.1 }} />
-        <Tooltip
-          wrapperStyle={{
-            outline: 'none',
-            borderRadius: '4px',
-            backgroundColor: '#F9F9F9',
-            fontSize: '14px',
-            padding: '8px'
-          }}
-          content={
-            <CustomTooltipBarChart coinType={coinType} category={category} />
-          }
-        />
-        <Legend content={<RenderChartLegend data={category} />} />
-        {legentsList.map(({ color, label }) => (
-          <Bar
-            key={`key-${label + category}-bar`}
-            dataKey={`${coinType}_${label.toLocaleUpperCase()}${
-              label === 'total' ? '' : category.toLocaleUpperCase()
-            }`}
-            barSize={35}
-            fill={color}
+      {data.length < 1 ? (
+        <Loader />
+      ) : (
+        <ComposedChart
+          margin={{ top: 8, right: 16 }}
+          height={300}
+          data={data}
+          ref={barRef}
+        >
+          <CartesianGrid stroke="#f0f0f0" />
+          <XAxis
+            tick={{ fontSize: 10, stroke: '#000', strokeWidth: 0.5 }}
+            dataKey="election"
+            scale="auto"
+          />
+          <YAxis
+            tick={{ fontSize: '10px', stroke: '#000', strokeWidth: 0.1 }}
+          />
+          <Tooltip
+            wrapperStyle={{
+              outline: 'none',
+              borderRadius: '4px',
+              backgroundColor: '#F9F9F9',
+              fontSize: '14px',
+              padding: '8px'
+            }}
+            content={
+              <CustomTooltipBarChart coinType={coinType} category={category} />
+            }
           />
-        ))}
-      </ComposedChart>
+          <Legend content={<RenderChartLegend data={category} />} />
+          {legentsList.map(({ color, label }) => (
+            <Bar
+              key={`key-${label + category}-bar`}
+              dataKey={`${coinType}_${label.toLocaleUpperCase()}${
+                label === 'total' ? '' : category.toLocaleUpperCase()
+              }`}
+              barSize={35}
+              fill={color}
+            />
+          ))}
+        </ComposedChart>
+      )}
     </ResponsiveContainer>
   )
 }
diff --git a/webapp/src/components/LineChartReport/custom-lineChart.js b/webapp/src/components/LineChartReport/custom-lineChart.js
index d594ddf7..4d55e88d 100644
--- a/webapp/src/components/LineChartReport/custom-lineChart.js
+++ b/webapp/src/components/LineChartReport/custom-lineChart.js
@@ -11,6 +11,8 @@ import {
   Brush
 } from 'recharts'
 
+import Loader from '../Loader'
+
 import CustomTooltipLineChart from './custom-tooltip-lineChart'
 
 const renderTraveller = props => {
@@ -73,77 +75,81 @@ const CustomLineChart = ({ coinType, data, lineRef }) => {
       height={300}
       marginTop="16px"
     >
-      <LineChart
-        margin={{ top: 8, bottom: 24, right: 16 }}
-        height={300}
-        data={data}
-        ref={lineRef}
-      >
-        <CartesianGrid stroke="#f0f0f0" />
-        <XAxis
-          tick={{ fontSize: 10, stroke: '#000', strokeWidth: 0.5 }}
-          dataKey="date"
-          scale="auto"
-          interval={xAxisData}
-          allowDataOverflow={false}
-        />
-        <YAxis
-          tick={{ fontSize: '10px', stroke: '#000', strokeWidth: 0.1 }}
-          scale="linear"
-        />
-        <Tooltip
-          wrapperStyle={{
-            outline: 'none',
-            borderRadius: '4px',
-            backgroundColor: '#F9F9F9',
-            fontSize: '14px',
-            padding: '8px'
-          }}
-          content={<CustomTooltipLineChart coinType={coinType} />}
-        />
-        <Line
-          type="monotone"
-          dataKey={`${coinType}_BALANCE`}
-          stroke="#3866eb"
-          strokeWidth={2}
-          activeDot={{ r: 8 }}
-        />
-        <Line
-          type="monotone"
-          dataKey={`${coinType}_VALUED`}
-          stroke="#3866eb"
-          strokeWidth={2}
-          activeDot={{ r: 8 }}
-          strokeDasharray={5}
-        />
-        <Brush
-          dataKey={'date'}
-          width={width * 0.7}
-          height={30}
-          x={width / 6.2}
-          y={260}
-          traveller={renderTraveller}
-          travellerWidth={1}
-          onChange={handleBrushChange}
+      {data.length < 1 ? (
+        <Loader />
+      ) : (
+        <LineChart
+          margin={{ top: 8, bottom: 24, right: 16 }}
+          height={300}
+          data={data}
+          ref={lineRef}
         >
-          <LineChart data={data}>
-            <Line
-              type="monotone"
-              dataKey={`${coinType}_BALANCE`}
-              stroke="#87cefa"
-              strokeWidth={2}
-              dot={false}
-            />
-            <Line
-              type="monotone"
-              dataKey={`${coinType}_VALUED`}
-              stroke="#87cefa"
-              strokeWidth={2}
-              dot={false}
-            />
-          </LineChart>
-        </Brush>
-      </LineChart>
+          <CartesianGrid stroke="#f0f0f0" />
+          <XAxis
+            tick={{ fontSize: 10, stroke: '#000', strokeWidth: 0.5 }}
+            dataKey="date"
+            scale="auto"
+            interval={xAxisData}
+            allowDataOverflow={false}
+          />
+          <YAxis
+            tick={{ fontSize: '10px', stroke: '#000', strokeWidth: 0.1 }}
+            scale="linear"
+          />
+          <Tooltip
+            wrapperStyle={{
+              outline: 'none',
+              borderRadius: '4px',
+              backgroundColor: '#F9F9F9',
+              fontSize: '14px',
+              padding: '8px'
+            }}
+            content={<CustomTooltipLineChart coinType={coinType} />}
+          />
+          <Line
+            type="monotone"
+            dataKey={`${coinType}_BALANCE`}
+            stroke="#3866eb"
+            strokeWidth={2}
+            activeDot={{ r: 8 }}
+          />
+          <Line
+            type="monotone"
+            dataKey={`${coinType}_VALUED`}
+            stroke="#3866eb"
+            strokeWidth={2}
+            activeDot={{ r: 8 }}
+            strokeDasharray={5}
+          />
+          <Brush
+            dataKey={'date'}
+            width={width * 0.7}
+            height={30}
+            x={width / 6.2}
+            y={260}
+            traveller={renderTraveller}
+            travellerWidth={1}
+            onChange={handleBrushChange}
+          >
+            <LineChart data={data}>
+              <Line
+                type="monotone"
+                dataKey={`${coinType}_BALANCE`}
+                stroke="#87cefa"
+                strokeWidth={2}
+                dot={false}
+              />
+              <Line
+                type="monotone"
+                dataKey={`${coinType}_VALUED`}
+                stroke="#87cefa"
+                strokeWidth={2}
+                dot={false}
+              />
+            </LineChart>
+          </Brush>
+        </LineChart>
+      )}
     </ResponsiveContainer>
   )
 }
diff --git a/webapp/src/components/LineChartReport/index.js b/webapp/src/components/LineChartReport/index.js
index 786fe203..938889e6 100644
--- a/webapp/src/components/LineChartReport/index.js
+++ b/webapp/src/components/LineChartReport/index.js
@@ -66,26 +66,29 @@ const LineChartReport = ({
   }, [selectedUSD])
 
   useEffect(() => {
-    if (viewSelected === 'last') {
-      const count = historicElections.length - 2 || 0
-      const date = historicElections?.at(count)?.date_election.split('T')[0]
-      const subData = data?.filter(obj => obj.date >= date)
-      setDataChart(subData)
-    }
+    if (!viewSelected) return
+
+    if (viewSelected === 'last') setDataChart([data.at(-2), data.at(-1)])
+
     if (viewSelected === 'all') setDataChart(data)
+
+    setElectionRoundSelect('')
   }, [viewSelected])
 
   useEffect(() => {
     if (!electionRoundSelect) return
+
     const index = historicElections.findIndex(
       election => Number(election.election) === Number(electionRoundSelect)
     )
+
     const subData = data?.filter(
       objt =>
         objt.date >= historicElections[index].date_election &&
-        objt.date <= historicElections[index + 1]?.date_election
+        objt.date <= (historicElections[index + 1]?.date_election || objt.date)
     )
-    setViewSelect(electionRoundSelect)
+
+    setViewSelect('')
 
     setDataChart(subData)
   }, [electionRoundSelect])
@@ -130,7 +133,7 @@ const LineChartReport = ({
             onClick={handleSelectElection}
             value="last"
           >
-            {t('estimated', { ns: 'incomeRoute' }).toUpperCase()}
+            {t('estimated', { ns: 'incomeRoute' })}
           </Button>
         </div>
         <Select
diff --git a/webapp/src/components/LineChartReport/styles.js b/webapp/src/components/LineChartReport/styles.js
index bdc64001..e8f6b0a8 100644
--- a/webapp/src/components/LineChartReport/styles.js
+++ b/webapp/src/components/LineChartReport/styles.js
@@ -33,6 +33,10 @@ export default theme => ({
     },
     [theme.breakpoints.down('sm')]: {
       width: '100%'
+    },
+    [theme.breakpoints.down(418)]: {
+      position: 'absolute',
+      top: 42
     }
   },
   titleContainer: {
@@ -40,7 +44,8 @@ export default theme => ({
     justifyContent: 'space-between',
     alignItems: 'center',
     [theme.breakpoints.down('sm')]: {
-      flexDirection: 'column'
+      flexDirection: 'column',
+      position: 'relative'
     }
   },
   chartLegent: {
@@ -67,10 +72,11 @@ export default theme => ({
   },
   buttonFilter: {
     display: 'flex',
-    alignItems: 'center',
+    alignItems: 'end',
     justifyContent: 'end',
+    marginBottom: theme.spacing(1),
     '& button': {
-      margin: 8,
+      margin: theme.spacing(1, 1, 1, 0),
       borderRadius: 0,
       boxShadow: 'none',
       backgroundColor: '#2563eb'
diff --git a/webapp/src/components/PieChartReport/custom-pieChart.js b/webapp/src/components/PieChartReport/custom-pieChart.js
index efde0215..33f96446 100644
--- a/webapp/src/components/PieChartReport/custom-pieChart.js
+++ b/webapp/src/components/PieChartReport/custom-pieChart.js
@@ -2,6 +2,7 @@ import React, { useEffect, useState, memo } from 'react'
 import PropTypes from 'prop-types'
 import { PieChart, Pie, Sector, ResponsiveContainer, Cell } from 'recharts'
 
+import Loader from '../Loader'
 import { formatWithThousandSeparator } from '../../utils/format-with-thousand-separator'
 
 const capitalizeFirstLetter = string => {
@@ -99,28 +100,32 @@ const CustomPieChart = ({
 
   return (
     <ResponsiveContainer width="100%" height={400}>
-      <PieChart ref={pieRef}>
-        <Pie
-          activeIndex={activeIndex}
-          activeShape={renderActiveShape}
-          data={newData}
-          nameKey={typeData === 'delegate' ? 'category' : 'name'}
-          dataKey={
-            typeData === 'delegate'
-              ? `${coinType}`
-              : `${coinType}_${category.toLocaleUpperCase()}`
-          }
-          cx="50%"
-          cy="50%"
-          innerRadius={innerRadius}
-          outerRadius={outerRadius}
-          onMouseEnter={onPieEnter}
-        >
-          {data.map(data => (
-            <Cell key={`cell-${data.election}`} fill={data.color} />
-          ))}
-        </Pie>
-      </PieChart>
+      {data.length < 1 ? (
+        <Loader />
+      ) : (
+        <PieChart ref={pieRef}>
+          <Pie
+            activeIndex={activeIndex}
+            activeShape={renderActiveShape}
+            data={newData}
+            nameKey={typeData === 'delegate' ? 'category' : 'name'}
+            dataKey={
+              typeData === 'delegate'
+                ? `${coinType}`
+                : `${coinType}_${category.toLocaleUpperCase()}`
+            }
+            cx="50%"
+            cy="50%"
+            innerRadius={innerRadius}
+            outerRadius={outerRadius}
+            onMouseEnter={onPieEnter}
+          >
+            {data.map(data => (
+              <Cell key={`cell-${data.election}`} fill={data.color} />
+            ))}
+          </Pie>
+        </PieChart>
+      )}
     </ResponsiveContainer>
   )
 }
diff --git a/webapp/src/language/en.json b/webapp/src/language/en.json
index e8878777..d22eb0ab 100644
--- a/webapp/src/language/en.json
+++ b/webapp/src/language/en.json
@@ -167,7 +167,7 @@
     "balanceTitle": "<strong>Main balance</strong>",
     "balanceText1": "This box always shows the exact amount of EOS token that Genesis Eden DAO disposes of. It has also an exchange rate linked to ",
     "balanceText2": " to convert to USD the EOS price. It’s always changing based on the Delegates transactions.",
-    "chartsTitle": "<strong>Income & Expense Charts</strong>",
+    "chartsTitle": "<strong>Income & Expense Section</strong>",
     "barChartText": "<strong>Bar charts</strong>\n\nUsers can visualize three bars, each one shares information from a past election and the number of EOS tokens <strong>claimed/unclaimed</strong> for Income, <strong>categorized/uncategorized</strong> for Expense and the <strong>total</strong>, respectively.\n\nThis information complements the pie charts. It supports the transparency of where the claimed tokens are allocated and also their expense category. Same scenario with those that are not.\n",
     "pieChartText1": "\n<strong>Pie Charts</strong>\n\nThese indicate the amount of EOS tokens in each account, per election.\n\n<strong>For the Income section:</strong> Each slice of the pie indicates the amount of EOS token that corresponds to the total ",
     "pieChartText2": " balance for a specific account according to a specific election.\n\n<strong>For the Expenses section:</strong> Here the amount of EOS token used is distinguished from the total amount that was received and claimed or not. In addition, this information shows the category that is assigned to a specific expense, in general and by account.\n\n<strong>For the Delegates section:</strong> Presents a customized view, based on the same data, to observe the two previous chart information but according to each member's transactions.",
@@ -176,7 +176,11 @@
     "spendSubTitle2": "<strong>Append memo function</strong>",
     "spendText": "Below the expense tool, there is the token transaction history box and delegates can use the \"<strong>Append</strong>\" function to categorize past transactions. It is represented by a “+” button.",
     "spendSteps1": "<strong>Steps:</strong>\n\n1. Connect wallet (supports ",
-    "spendSteps2": ").\n2. Sign the permission to connect your wallet to the Spend-tool.\n3. You will be able to see this screen with the current balance of your Eden account.\n4. You’re ready to send tokens and categorize them depending on the specific memo.\n5. Click on the “Transfer EOS” button."
+    "spendSteps2": ").\n2. Sign the permission to connect your wallet to the Spend-tool.\n3. You will be able to see this screen with the current balance of your Eden account.\n4. You’re ready to send tokens and categorize them depending on the specific memo.\n5. Click on the “Transfer EOS” button.",
+    "treasuryTitle": "<strong> Treasury Section </strong>",
+    "lineChartText1": "This graph reflects changes in Eden's cash balance over time, both in USD and EOS. Each point on the graph represents a date on which an inflow or outflow of cash balance occurred. The last point reflects the estimated amount of cash for the next month, shown as a dashed line.\n",
+    "lineChartText2": "\n<strong>Filter by Election:</strong> With this option the changes of the treasury for each election are shown. In addition, you can view the estimated cash flow for the next month by clicking on the \"Estimated balance\" button, clicking on the \"All\" button will redisplay all the movements made within the Eden account.\n",
+    "lineChartText3": "\n<strong>Filter by dates:</strong> Below the line graph there is a bar where you can slide two blue dots located on each side of the bar, by doing this action inside the graph there is a zoom in or zoom out, which allows you to see a specific point by means of the selected dates.\n"
   },
   "footer": {
     "firstHeader": "EDEN",
diff --git a/webapp/src/language/es.json b/webapp/src/language/es.json
index e77ef320..96117084 100644
--- a/webapp/src/language/es.json
+++ b/webapp/src/language/es.json
@@ -88,7 +88,6 @@
     "paragraph2Disbursement": "El desembolso global equivale al 11% de la tesorería de Edén en el momento del desembolso. El importe se divide a partes iguales entre los niveles representativos. En cada nivel, la cantidad se divide a partes iguales entre los representantes de ese nivel.",
     "paragraph3Disbursement": "Fecha de la siguiente distribución:",
     "paragraph4Disbursement": "Monto proyectado para la siguiente distribución:",
-
     "perLevel": "Por Level",
     "perChief": "Por Chief",
     "perHeadChief": "Por Head Chief",
@@ -168,7 +167,7 @@
     "balanceTitle": "<strong>Balance Principal</strong>",
     "balanceText1": "Esta casilla muestra siempre la cantidad exacta de token EOS de la que dispone la DAO Génesis Eden. También tiene un tipo de cambio vinculado a ",
     "balanceText2": " para convertir a USD el precio de EOS.  Siempre cambia en función de las transacciones de los delegados.",
-    "chartsTitle": "<strong>Gráficos de Ingreso y Gasto</strong>",
+    "chartsTitle": "<strong>Sección de Ingreso y Gasto</strong>",
     "barChartText": "<strong>Gráficos de barras</strong>\n\nDentro de los gráficos hay tres barras, cada barra comparte información de una elección pasada y el número de tokens EOS <strong>reclamados/no reclamados</strong> para Ingresos, <strong>categorizados/no categorizados</strong> para Gastos y el <strong>total</strong>, respectivamente.\n\nEsta información complementa la de los gráficos pastel, ayuda en la transparencia de dónde se hace uso de los tokens reclamados y también su categoría. Asimismo con los que no lo están.\n",
     "pieChartText1": "\n<strong>Gráficos de pastel</strong>\n\nEstos indican la cantidad de token EOS en cada cuenta, por elección.\n\n<strong>Para la sección de Ingresos:</strong> Cada parte del pastel indica el monto de token EOS que le corresponde del balance total ",
     "pieChartText2": " a una cuenta específica según esa elección específica.\n\n<strong>Para la sección de Gastos</strong>: Aquí se distingue el monto de token EOS utilizado, del total que se recibió y reclamo. Además esta información muestra la categoría que se le asigna a un gasto específico en general y por cuenta.\n\n<strong>Para la sección de Delegados:</strong> Presenta una vista personalizada, basada en los mismos datos obtenidos, para observar las dos anteriores pero según las transacciones de cada miembro.",
@@ -177,7 +176,11 @@
     "spendSubTitle2": "<strong>Función Adjuntar Memo</strong>",
     "spendText": "Debajo de la herramienta de gastos, está el cuadro de historial de transacción de tokens y los delegados pueden utilizar la función “<strong>Adjuntar memo</strong>” para categorizar las transacciones anteriores. Está representado por el botón “+”",
     "spendSteps1": "<strong>Pasos:</strong>\n\n1. Conectar la billetera (Soporta ",
-    "spendSteps2": ").\n2. Firma el permiso que permite conectar tu billetera a la herramienta de gastos.\n3. Podrás ver esta pantalla con el saldo actual de tu cuenta ( La de Eden).\n4. Ya estás listo para enviar tokens y categorizarlos dependiendo del memo específico.\n5. Haz clic en el botón \"Transferir EOS\"."
+    "spendSteps2": ").\n2. Firma el permiso que permite conectar tu billetera a la herramienta de gastos.\n3. Podrás ver esta pantalla con el saldo actual de tu cuenta ( La de Eden).\n4. Ya estás listo para enviar tokens y categorizarlos dependiendo del memo específico.\n5. Haz clic en el botón \"Transferir EOS\".",
+    "treasuryTitle": "<strong> Sección de Tesorería </strong>",
+    "lineChartText1": "Este gráfico refleja los cambios que ha tenido el saldo de la tesorería de Eden a lo largo del tiempo, tanto en USD como en EOS. Cada punto del gráfico representa una fecha en la que se produjo un ingreso o un gasto del saldo de tesorería. En el último punto refleja el monto de tesorería estimado para el mes siguiente, este punto se muestra mediante una línea discontinua.\n",
+    "lineChartText2": "\n<strong>Filtro por Elección:</strong> Con esta opción se muestran los cambios de la tesorería por cada elección. Además, puede ver la tesorería estimada para el próximo mes pulsando sobre el botón de \"Balance estimado\", pulsando sobre el botón \"Todo\" volverá a mostrarse todos los movimientos realizados dentro de la cuenta de Eden.\n",
+    "lineChartText3": "\n<strong>Filtro por Fechas:</strong> Debajo del gráfico de lineas hay una barra donde se puede deslizar dos puntos azules localizados a cada lado de la barra, al realizar esta acción dentro del gráfico hay un aumento o zoom, mismo que permite ver algún punto en especifico por medio de las fechas seleccionadas.\n"
   },
   "footer": {
     "firstHeader": "EDEN",
diff --git a/webapp/src/routes/Help/index.js b/webapp/src/routes/Help/index.js
index 44bcee70..0a85ec42 100644
--- a/webapp/src/routes/Help/index.js
+++ b/webapp/src/routes/Help/index.js
@@ -101,6 +101,34 @@ const Help = () => {
             </span>
           </div>
           <Divider orientation="horizontal" variant="middle" />
+          <Trans>
+            <span className={classes.subTitle}>
+              {t('treasuryTitle', { ns: 'helpRoute' })}
+            </span>
+          </Trans>
+          <div className={classes.imagesContainer}>
+            <img
+              src={
+                i18n.language === 'es'
+                  ? '/images/treasury-chart-ES.webp'
+                  : '/images/treasury-chart-EN.webp'
+              }
+            />
+          </div>
+          <div className={classes.paragraph}>
+            <Trans>
+              <span className={classes.text}>
+                {t('lineChartText1', { ns: 'helpRoute' })}
+              </span>
+              <span className={classes.text}>
+                {t('lineChartText2', { ns: 'helpRoute' })}
+              </span>
+              <span className={classes.text}>
+                {t('lineChartText3', { ns: 'helpRoute' })}
+              </span>
+            </Trans>
+          </div>
+          <Divider orientation="horizontal" variant="middle" />
           <Trans>
             <span className={classes.subTitle}>
               {t('chartsTitle', { ns: 'helpRoute' })}