diff --git a/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoring.tsx b/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoring.tsx
index 09164b8bf..4287a7fba 100644
--- a/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoring.tsx
+++ b/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoring.tsx
@@ -39,15 +39,10 @@ interface MonitoringFormI {
 
 interface MonitoringI extends withFormHandlerProps, MonitoringFormI {}
 
+// Definizione dell'oggetto initialFormValues all'esterno del componente Monitoring
+
 const Monitoring: React.FC<MonitoringI> = ({
-  formDisabled,
-  creation = false,
-  clearForm = () => {},
 }) => {
-  const [newFormValues, setNewFormValues] = useState<{
-    [key: string]: formFieldI['value'];
-  }>({});
-  const [isFormValid, setIsFormValid] = useState<boolean>(true);
   const navigate = useNavigate();
   const dispatch = useDispatch();
   const { hasUserPermission } = useGuard();
@@ -56,26 +51,23 @@ const Monitoring: React.FC<MonitoringI> = ({
   const pagination = useAppSelector(selectEntityPagination);
   const { filtroCriterioRicerca, filtroPolicies, filtroStati } = filtersList;
   const numbers = [46, 112, 47259, 53293];
-  const [statisticheElaborate, setStatisticheElaborate] = useState<any[]>([numbers[0].toLocaleString('it-IT'),numbers[1].toLocaleString('it-IT'),numbers[2].toLocaleString('it-IT'),numbers[3].toLocaleString('it-IT')]);
+  const [statisticheElaborate, setStatisticheElaborate] = useState<any[]>([
+    numbers[0].toLocaleString('it-IT'),
+    numbers[1].toLocaleString('it-IT'),
+    numbers[2].toLocaleString('it-IT'),
+    numbers[3].toLocaleString('it-IT'),
+  ]);
   const { pageNumber } = pagination;
+
   useEffect(() => {
     dispatch(setEntityPagination({ pageSize: 8 }));
-    dispatch(resetProgramDetails());
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-    setNewFormValues({
-      ...newFormValues,
-      dataInizio: new Date().toISOString().split('T')[0],
-      dataFine: new Date().toISOString().split('T')[0],
-    });
-    console.log('newFormValues', newFormValues);
+    // dispatch(resetProgramDetails());
   }, []);
 
   const permissions = useAppSelector(selectPermissions);
-  // const filteredPermissions = permissions.filter((permission: string) => permission.startsWith('vis'));
-  
-  console.log("filteredPermissions", permissions);
-  console.log("hasPermission", hasUserPermission(['vis.mntr']));
-  
+  // console.log("filteredPermissions", permissions);
+  // console.log("hasPermission", hasUserPermission(['vis.mntr']));
+
   const updateTableValues = () => {
     const table = newTable(
       TableHeading,
@@ -94,17 +86,16 @@ const Monitoring: React.FC<MonitoringI> = ({
     );
     return table;
   };
-  
-  const [tableValues, setTableValues] = useState(updateTableValues());  
+
+  const [tableValues, setTableValues] = useState(updateTableValues());
   const [numeroRisultati, setNumeroRisultati] = useState(pagination.totalElements);
-  
+
   useEffect(() => {
     if (Array.isArray(caricamentiList) && caricamentiList.length)
       setTableValues(updateTableValues());
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [caricamentiList]);
 
-  const getProgramsList = () => {    
+  const getProgramsList = () => {
     dispatch(GetEntityValues({ entity }));
   };
 
@@ -122,7 +113,6 @@ const Monitoring: React.FC<MonitoringI> = ({
   useEffect(() => {
     getProgramsList();
     setNumeroRisultati(pagination.totalElements);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [filtroCriterioRicerca, filtroPolicies, filtroStati, pageNumber]);
 
   const handleOnChangePage = (pageNumber: number = pagination?.pageNumber) => {
@@ -142,7 +132,26 @@ const Monitoring: React.FC<MonitoringI> = ({
           }
         },
       }
-    : {};    
+    : {};
+
+
+    const handleSearch = (searchParams: { [key: string]: formFieldI['value'] }) => {
+      console.log("searchParams", searchParams);
+    };
+
+  // const handleClearForm = () => {
+  //   console.log("formValues", newFormValues);
+  //   console.log("initialFormValues", initialFormValues);
+  //   setNewFormValues(initialFormValues);
+  //   clearForm();
+  // };
+
+  // const onInputDataChange = (value: formFieldI['value'], field?: formFieldI['field']) => {
+  //   if (field) {
+  //     setNewFormValues((prevValues) => ({ ...prevValues, [field]: value }));
+  //   }
+  // };
+
   return (
     <div>
       Monitora l'avanzamento dei caricamenti massivi dei dati degli enti. La visualizzazione di base è preimpostata in <br />
@@ -150,17 +159,11 @@ const Monitoring: React.FC<MonitoringI> = ({
 
       <div style={{ margin: '50px' }} />
       <Accordion title={'Ricerca avanzata'} className="custom-accordion">
-        <MonitoringSearchFilters
-          newFormValues={newFormValues}
-          creation={creation}
-          clearForm={clearForm}
-          formDisabled={!!formDisabled}
-          sendNewValues={(newData) => setNewFormValues({ ...newData })}
-          setIsFormValid={(value: boolean | undefined) => setIsFormValid(!!value)}       
-          />
+        <MonitoringSearchFilters onSearch={handleSearch}
+        />
       </Accordion>
       <div style={{ margin: '50px' }} />
-      
+
       <span className="results"><b>Risultati</b> ({numeroRisultati})</span>
 
       <div className="square-container">
@@ -182,38 +185,36 @@ const Monitoring: React.FC<MonitoringI> = ({
         </div>
       </div>
 
-        {tableValues?.values?.length ? (
-          <>
-            <Table
-              {...tableValues}
-              id='table'
-              onActionClick={onActionClick}
-              onCellClick={(field, row) => console.log(field, row)}
-              //onRowClick={row => console.log(row)}
-              withActions
-              totalCounter={pagination?.totalElements}
-            />
-            {pagination?.pageNumber ? (
-              <Paginator
-                activePage={pagination?.pageNumber}
-                center
-                refID='#table'
-                pageSize={pagination?.pageSize}
-                total={pagination?.totalPages}
-                onChange={handleOnChangePage}
-              />
-            ) : null}
-          </>
-        ) : (
-          <EmptySection
-            title='Non sono stati effettuati caricamenti massivi'
-            icon={IconNote}
-            withIcon
+      {tableValues?.values?.length ? (
+        <>
+          <Table
+            {...tableValues}
+            id='table'
+            onActionClick={onActionClick}
+            onCellClick={(field, row) => console.log(field, row)}
+            withActions
+            totalCounter={pagination?.totalElements}
           />
-        )}
+          {pagination?.pageNumber ? (
+            <Paginator
+              activePage={pagination?.pageNumber}
+              center
+              refID='#table'
+              pageSize={pagination?.pageSize}
+              total={pagination?.totalPages}
+              onChange={handleOnChangePage}
+            />
+          ) : null}
+        </>
+      ) : (
+        <EmptySection
+          title='Non sono stati effettuati caricamenti massivi'
+          icon={IconNote}
+          withIcon
+        />
+      )}
     </div>
-    
   );
 };
 
-export default Monitoring;
+export default Monitoring;
\ No newline at end of file
diff --git a/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoringSearchFilters.tsx b/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoringSearchFilters.tsx
index e145fbf40..c87fa909a 100644
--- a/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoringSearchFilters.tsx
+++ b/fe-piattaforma/src/pages/administrator/MonitoraggioCaricamenti/monitoringSearchFilters.tsx
@@ -1,224 +1,26 @@
-import React, { useEffect, useState } from 'react';
+import React, { useState } from 'react';
 import { Button } from 'design-react-kit';
-import { useTranslation } from 'react-i18next';
 import { Form, Input, Select } from '../../../components';
-import { formFieldI, FormHelper, newForm, newFormField } from '../../../utils/formHelper';
 import withFormHandler, { withFormHandlerProps } from '../../../hoc/withFormHandler';
-import { set } from 'react-hook-form';
+import { formFieldI, newForm, newFormField } from '../../../utils/formHelper';
 
-export interface SearchInformationI {
-  onHandleSearch?: (searchValue: string) => void;
-  placeholder: string;
-  title: string;
-  autocomplete: boolean;
-  isClearable: boolean;
-  onReset?: () => void;
-}
-
-interface GenericSearchFilterTableLayoutI extends withFormHandlerProps{
+interface MonitoringSearchFilterI {
   formDisabled?: boolean;
-  newFormValues: { [key: string]: any };
-  sendNewValues?: (param?: { [key: string]: formFieldI['value'] }) => void;
-  setIsFormValid?: (param: boolean | undefined) => void;
-  creation?: boolean;
+  sendNewValues?: (param: { [key: string]: formFieldI['value'] }) => void;
+  onSearch?: (param: { [key: string]: formFieldI['value'] }) => void;
+  clearForm?: () => void;
 }
 
-const monitoringSearchFilters: React.FC<GenericSearchFilterTableLayoutI> = (
-  props
-) => {
-  console.log('props', props);
-  const {
-    form,
-    newFormValues,
-    onInputChange = () => ({}),
-    getFormValues = () => ({}),
-    sendNewValues = () => ({}),
-    clearForm = () => ({}),
-    setFormValues = () => ({}),
-    updateForm = () => ({}),
-  } = props;
-  const { t } = useTranslation();
-  const bootClass = 'justify-content-between px-0 px-lg-5 mx-2';
-
-  useEffect(() => {
-    // Verifica se le date sono state passate tramite i props
-    if (newFormValues.dataInizio && newFormValues.dataFine) {
-      let newForm = { ...form };
-      const dataInizio = new Date(newFormValues.dataInizio);
-      const dataFine = new Date(newFormValues.dataFine);
-      // Imposta il minimo per dataFine basato su dataInizio
-      if (dataInizio && (!newForm.dataFine.minimum || new Date(newForm.dataFine.minimum) < dataInizio)) {
-        newForm.dataFine.minimum = formatDate(dataInizio.toISOString());
-      }
-      // Imposta il massimo per dataInizio basato su dataFine
-      if (dataFine && (!newForm.dataInizio.maximum || new Date(newForm.dataInizio.maximum) > dataFine)) {
-        newForm.dataInizio.maximum = formatDate(dataFine.toISOString());
-      }
-      updateForm(newForm); // Aggiorna il form con i valori min/max impostati
-      setFormValues(newFormValues); // Imposta i valori del form
-    }
-    
-  }, [newFormValues]); 
-  
-  const applicaFiltri = () => {
-    console.log("applica");
-  };
-
-  const cancellaFiltri = () => {
-    clearForm(); // Resetta il form
-  };
-
-  const onInputDataChange = (
-    value: formFieldI['value'],
-    field?: formFieldI['field']
-  ) => {
-    onInputChange(value, field);
-  };
-
- const onDateChange = (
-  value: formFieldI['value'],
-  field?: formFieldI['field']
-) => {
-  if (value && field && form) {
-    // Verifica se il valore è una stringa o un numero prima di usarlo in new Date()
-    const isValidDateValue =
-      typeof value === 'string' || typeof value === 'number' || value instanceof Date;
-
-    if (!isValidDateValue) {
-      console.error('Valore non valido per la data:', value);
-      return; // Interrompe l'esecuzione se il valore non è valido
-    }
-    const formattedDate = formatDate(value as string); // Converti la data in formato YYYY-MM-DD
-    let newForm = { ...form};
-
-    if (field === 'dataInizio') {
-      // Controlla se dataFine è inferiore a dataInizio
-      if (newForm.dataFine.value && (typeof newForm.dataFine.value === 'string' || typeof newForm.dataFine.value === 'number' || newForm.dataFine.value instanceof Date) && new Date(newForm.dataFine.value) < new Date(formattedDate)) {
-        newForm.dataFine.value = ''; // Resetta dataFine se è inferiore a dataInizio
-      }
-      newForm = {
-        ...newForm,
-        dataInizio: {
-          ...form.dataInizio,
-          value: formattedDate,
-        },
-        dataFine: {
-          ...form.dataFine,
-          minimum: formattedDate,
-        },
-      };
-    } else if (field === 'dataFine') {
-      // Controlla se dataFine è inferiore a dataInizio
-      if (newForm.dataInizio.value && new Date(formattedDate) < new Date(newForm.dataInizio.value as string | number | Date)) {
-        console.error('La data di fine non può essere inferiore alla data di inizio');
-        return;
-      }
-      newForm = {
-        ...newForm,
-        dataFine: {
-          ...form.dataFine,
-          value: formattedDate,
-        },
-        dataInizio: {
-          ...form.dataInizio,
-          maximum: formattedDate,
-        },
-      };
-    }
-    updateForm(newForm);
-  }
-};
-
-  const formatDate = (dateString: string) => {
-    const date = new Date(dateString);
-    const year = date.getFullYear();
-    const month = String(date.getMonth() + 1).padStart(2, '0');
-    const day = String(date.getDate()).padStart(2, '0');
-    return `${year}-${month}-${day}`;
-  };
-
-  return (
-    <Form
-      id='form-categories'
-      className='mt-3 mb-5 pb-5'
-      customMargin='mb-3 pb-3'
-    >
-      <Form.Row className={bootClass}>
-        <Input
-          {...form?.ente}
-          col='col-12 col-lg-6'
-          label='Ente'
-          onInputChange={onInputDataChange}
-          placeholder="Inizia a scrivere il nome dell'ente"
-        />
-        <Select
-          {...form?.intervento}
-          col='col-12 col-lg-6'
-          label='Intervento'
-          onInputChange={onInputDataChange}
-          options={[
-            { value: '', label: 'Seleziona' },
-            { value: 'rfd', label: 'RFD' },
-            { value: 'scd', label: 'SCD' },
-          ]}
-          >
-        </Select>
-      </Form.Row>
-      <Form.Row className={bootClass}>
-        <Input
-          {...form?.dataInizio}
-          type='date'
-          col='col-12 col-lg-6'
-          label='Data inizio'
-          min={form?.dataInizio?.minimum}
-          max={form?.dataInizio?.maximum}
-          onInputChange={onDateChange}
-        />
-        <Input
-          {...form?.dataFine}
-          type='date'
-          col='col-12 col-lg-6'
-          label='Data fine'
-          min={form?.dataFine?.minimum}
-          max={form?.dataFine?.maximum}
-          onInputChange={onDateChange}
-        />
-      </Form.Row>
-      <Form.Row className={bootClass}>
-        <Select
-          {...form?.progetto}
-          col='col-12 col-lg-6'
-          label='Progetto'
-          onInputChange={onInputDataChange}
-          options={[
-            { value: '', label: 'Seleziona' },
-            { value: 'progetto1', label: 'Progetto 1' },
-            { value: 'progetto2', label: 'Progetto 2' },
-          ]}
-
-        />
-        <Select
-          {...form?.programma}
-          col='col-12 col-lg-6'
-          label='Programma'
-          onInputChange={onInputDataChange}
-          options={[
-            { value: '', label: 'Seleziona' },
-            { value: 'programma1', label: 'Programma 1' },
-            { value: 'programma2', label: 'Programma 2' },
-          ]}
-          >
-        </Select>
-      </Form.Row>
-      <Form.Row className='justify-content-end'>
-        <Button color='secondary' className='mr-2' onClick={cancellaFiltri}>Cancella filtri</Button>
-        <Button color='primary' onClick={applicaFiltri}>Applica filtri</Button>
-      </Form.Row>
-    </Form>
-  );
+const initialFormValues = {
+  ente: '',
+  programma: '',
+  intervento: '',
+  progetto: '',
+  dataInizio: new Date().toISOString().split('T')[0],
+  dataFine: new Date().toISOString().split('T')[0],
 };
 
-const form = newForm([
+const formSchema: { [key: string]: formFieldI } = newForm([
   newFormField({
     field: 'ente',
     id: 'ente',
@@ -258,4 +60,107 @@ const form = newForm([
   }),
 ]);
 
-export default withFormHandler({ form }, monitoringSearchFilters);
\ No newline at end of file
+const MonitoringSearchFilters: React.FC<MonitoringSearchFilterI> = ({
+  // sendNewValues = () => {},
+  onSearch = () => {},
+  // updateForm = () => {},
+  // clearForm = () => {},
+}) => {
+  const [formValues, setFormValues] = useState<{ [key: string]: formFieldI['value'] }>(initialFormValues);
+
+  const handleInputChange = (value: formFieldI['value'], field: formFieldI['field']) => {
+    console.log('field prima', field);
+    console.log('value prima', value);
+    console.log('formValues prima', formValues);
+    
+    setFormValues((prevValues) => {
+      const newValues = { ...prevValues, [field]: value };
+      console.log('prevValues', prevValues);
+      console.log('newValues', newValues);
+      return newValues;
+    });
+
+  };
+
+  const handleClearForm = () => {
+    setFormValues(initialFormValues);
+
+    // clearForm();
+  };
+
+  const handleSubmit = () => {
+    // sendNewValues(formValues);
+    onSearch(formValues);
+  };
+
+  const renderSelect = (field: string, label: string, options: Array<{ value: string; label: string }>) => (
+    <Select
+      col="col-12 col-lg-6"
+      label={label}
+      onInputChange={(value) => handleInputChange(value, field)}
+      options={options}
+      field={field}
+      value={formValues[field]} // Usa i valori attuali dello stato
+    />
+  );
+
+  return (
+    <Form id="form-categories" className="mt-3 mb-5 pb-5">
+      <Form.Row className="justify-content-between px-0 px-lg-5 mx-2">
+        <Input
+          value={formValues.ente} // Usa il valore attuale dello stato
+          col="col-12 col-lg-6"
+          label="Ente"
+          onInputChange={(value) => handleInputChange(value, 'ente')}
+          placeholder="Inizia a scrivere il nome dell'ente"
+        />
+        {renderSelect('intervento', 'Intervento', [
+          { value: '', label: 'Seleziona' },
+          { value: 'rfd', label: 'RFD' },
+          { value: 'scd', label: 'SCD' },
+        ])}
+      </Form.Row>
+
+      <Form.Row className="justify-content-between px-0 px-lg-5 mx-2">
+        <Input
+          value={formValues.dataInizio} // Usa il valore attuale dello stato
+          type="date"
+          col="col-12 col-lg-6"
+          label="Data inizio"
+          onInputChange={(value) => handleInputChange(value, 'dataInizio')}
+        />
+        <Input
+          value={formValues.dataFine} // Usa il valore attuale dello stato
+          type="date"
+          col="col-12 col-lg-6"
+          label="Data fine"
+          onInputChange={(value) => handleInputChange(value, 'dataFine')}
+        />
+      </Form.Row>
+
+      <Form.Row className="justify-content-between px-0 px-lg-5 mx-2">
+        {renderSelect('progetto', 'Progetto', [
+          { value: '', label: 'Seleziona' },
+          { value: 'progetto1', label: 'Progetto 1' },
+          { value: 'progetto2', label: 'Progetto 2' },
+        ])}
+        {renderSelect('programma', 'Programma', [
+          { value: '', label: 'Seleziona' },
+          { value: 'programma1', label: 'Programma 1' },
+          { value: 'programma2', label: 'Programma 2' },
+        ])}
+      </Form.Row>
+
+      <Form.Row className="justify-content-end">
+        <Button color="secondary" className="mr-2" onClick={handleClearForm}>
+          Cancella filtri
+        </Button>
+        <Button color="primary" onClick={handleSubmit}>
+          Applica filtri
+        </Button>
+      </Form.Row>
+    </Form>
+  );
+};
+
+export default  MonitoringSearchFilters;
diff --git a/fe-piattaforma/src/utils/common.ts b/fe-piattaforma/src/utils/common.ts
index 66fd6ff37..9a55661cf 100644
--- a/fe-piattaforma/src/utils/common.ts
+++ b/fe-piattaforma/src/utils/common.ts
@@ -240,7 +240,7 @@ export const MenuRoutes = [
       newMenuItem({
         label: 'Monitoraggio dei caricamenti massivi',
         path: '/report-dati/monitoraggio-caricamenti-massivi',
-        visible: ['tab.dshb', 'visible'],
+        visible: ['tab.dshb', 'vis.mntr'],
       })
     ],
   }),