From a42806c0f0334e07efefc783663e64cab71646cc Mon Sep 17 00:00:00 2001
From: Vitalii Kiiko <mr.psiho@gmail.com>
Date: Mon, 11 Nov 2024 14:16:33 +0100
Subject: [PATCH] - added btn 'add to favourites;

---
 src/assets/scss/components/appPage.scss       | 14 +++--
 .../components/AllBandiAccordion/index.js     |  9 ++-
 .../components/LatestBandiTable/index.js      | 63 ++++++++++++-------
 3 files changed, 58 insertions(+), 28 deletions(-)

diff --git a/src/assets/scss/components/appPage.scss b/src/assets/scss/components/appPage.scss
index 3c62a17..4fdac21 100644
--- a/src/assets/scss/components/appPage.scss
+++ b/src/assets/scss/components/appPage.scss
@@ -355,8 +355,8 @@
 
 .appPageSection__tableActions {
     display: flex;
-    gap: 24px;
-    padding: 0;
+    gap: 10px;
+    align-items: center;
     flex-wrap: wrap;
 }
 
@@ -368,12 +368,18 @@
     justify-content: center;
     border-radius: 50%;
     border: none;
-    background-color: var(--message-info-color);
-    color: white;
+    background-color: transparent;
+    color: var(--global-textColor);
     padding: 0;
     
     &:hover {
         cursor: pointer;
+        color: var(--message-info-color);
+    }
+
+    &[data-active="true"] {
+        background-color: var(--message-info-color);
+        color: white;
     }
 
     &[disabled] {
diff --git a/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js b/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js
index 0fc5fe1..183e894 100644
--- a/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js
+++ b/src/pages/BandiBeneficiario/components/AllBandiAccordion/index.js
@@ -102,7 +102,9 @@ const AllBandiAccordion = () => {
 
     const actionsBodyTemplate = (rowData) => {
         return <div className="appPageSection__tableActions">
-            <button type="button" className="appPageSection__addToFavourites" onClick={addToFavourites} disabled={true}>
+            <button type="button"
+                    className="appPageSection__addToFavourites"
+                    onClick={() => addToFavourites(rowData.id)}>
                 <i className="pi pi-heart" style={{ fontSize: '1rem' }}></i>
             </button>
         </div>
@@ -151,8 +153,9 @@ const AllBandiAccordion = () => {
                 <Column field="status" header={__('Stato', 'gepafin')} filterMenuStyle={{ width: '14rem' }}
                         style={{ width: '120px' }} body={statusBodyTemplate} filter sortable
                         filterElement={statusFilterTemplate}/>
-                {/*<Column header={__('Azioni', 'gepafin')}
-                        body={actionsBodyTemplate}/>*/}
+                <Column header={__('Azioni', 'gepafin')}
+                        style={{ width: '120px' }}
+                        body={actionsBodyTemplate}/>
             </DataTable>
         </div>
     )
diff --git a/src/pages/DashboardBeneficiario/components/LatestBandiTable/index.js b/src/pages/DashboardBeneficiario/components/LatestBandiTable/index.js
index 301094f..9ae2864 100644
--- a/src/pages/DashboardBeneficiario/components/LatestBandiTable/index.js
+++ b/src/pages/DashboardBeneficiario/components/LatestBandiTable/index.js
@@ -55,6 +55,10 @@ const LatestBandiTable = () => {
         storeSet.main.unsetAsyncRequest();
     }
 
+    const addToFavourites = (id) => {
+
+    }
+
     const getFormattedData = (data) => {
         return [...(data || [])].map((d) => {
             d.start_date = new Date(d.dates[0]);
@@ -89,9 +93,18 @@ const LatestBandiTable = () => {
     const initFilters = () => {
         setFilters({
             global: { value: null, matchMode: FilterMatchMode.CONTAINS },
-            name: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }] },
-            start_date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
-            end_date: { operator: FilterOperator.AND, constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }] },
+            name: {
+                operator: FilterOperator.AND,
+                constraints: [{ value: null, matchMode: FilterMatchMode.STARTS_WITH }]
+            },
+            start_date: {
+                operator: FilterOperator.AND,
+                constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
+            },
+            end_date: {
+                operator: FilterOperator.AND,
+                constraints: [{ value: null, matchMode: FilterMatchMode.DATE_IS }]
+            },
             status: { operator: FilterOperator.OR, constraints: [{ value: null, matchMode: FilterMatchMode.EQUALS }] }
         });
         setGlobalFilterValue('');
@@ -100,10 +113,12 @@ const LatestBandiTable = () => {
     const renderHeader = () => {
         return (
             <div className="appTableHeader">
-                <Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined onClick={clearFilter} />
+                <Button type="button" icon="pi pi-filter-slash" label={__('Pulisci', 'gepafin')} outlined
+                        onClick={clearFilter}/>
                 <IconField iconPosition="left">
-                    <InputIcon className="pi pi-search" />
-                    <InputText value={globalFilterValue} onChange={onGlobalFilterChange} placeholder={__('Cerca', 'gepafin')} />
+                    <InputIcon className="pi pi-search"/>
+                    <InputText value={globalFilterValue} onChange={onGlobalFilterChange}
+                               placeholder={__('Cerca', 'gepafin')}/>
                 </IconField>
             </div>
         );
@@ -118,26 +133,31 @@ const LatestBandiTable = () => {
     };
 
     const dateFilterTemplate = (options) => {
-        return <Calendar value={options.value} onChange={(e) => options.filterCallback(e.value, options.index)} dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999" />;
+        return <Calendar value={options.value} onChange={(e) => options.filterCallback(e.value, options.index)}
+                         dateFormat="mm/dd/yy" placeholder="mm/dd/yyyy" mask="99/99/9999"/>;
     };
 
     const statusBodyTemplate = (rowData) => {
         return <ProperBandoLabel status={rowData.status}/>;
     };
 
-    const statusItemTemplate = (option) => {
-        return <Tag value={getBandoLabel(option)} severity={getBandoSeverity(option)} />;
-    };
-
     const actionsBodyTemplate = (rowData) => {
-        return rowData.confidi
-            ? <Link to={`/bandi/${rowData.id}`}>
-                <Button severity="info" label={__('Mostra', 'gepafin')} icon="pi pi-eye" size="small" iconPos="right"/>
-            </Link>
-            : <Link to={`/bandi/${rowData.id}`}>
-                <Button severity="info" label={__('Partecipa', 'gepafin')} icon="pi pi-arrow-right" size="small"
-                        iconPos="right"/>
-            </Link>
+        return <div className="appPageSection__tableActions">
+            <button type="button"
+                    className="appPageSection__addToFavourites"
+                    onClick={() => addToFavourites(rowData.id)}>
+                <i className="pi pi-heart" style={{ fontSize: '1rem' }}></i>
+            </button>
+            {rowData.confidi
+                ? <Link to={`/bandi/${rowData.id}`}>
+                    <Button severity="info" label={__('Mostra', 'gepafin')} icon="pi pi-eye" size="small"
+                            iconPos="right"/>
+                </Link>
+                : <Link to={`/bandi/${rowData.id}`}>
+                    <Button severity="info" label={__('Partecipa', 'gepafin')} icon="pi pi-arrow-right" size="small"
+                            iconPos="right"/>
+                </Link>}
+        </div>
     }
 
     const header = renderHeader();
@@ -150,7 +170,8 @@ const LatestBandiTable = () => {
                        header={header}
                        emptyMessage={__('Nessun dato disponibile', 'gepafin')}
                        onFilter={(e) => setFilters(e.filters)}>
-                <Column field="name" header={__('Nome Bando', 'gepafin')} filter filterPlaceholder={__('Cerca il nome', 'gepafin')}
+                <Column field="name" header={__('Nome Bando', 'gepafin')} filter
+                        filterPlaceholder={__('Cerca il nome', 'gepafin')}
                         style={{ minWidth: '8rem' }}/>
                 <Column header={__('Data Pubblicazione', 'gepafin')} filterField="start_date" dataType="date"
                         style={{ minWidth: '8rem' }}
@@ -159,7 +180,7 @@ const LatestBandiTable = () => {
                         style={{ minWidth: '8rem' }}
                         body={dateEndBodyTemplate} filter filterElement={dateFilterTemplate}/>
                 <Column field="status" header={__('Stato', 'gepafin')}
-                        style={{ minWidth: '7rem' }} body={statusBodyTemplate} />
+                        style={{ minWidth: '7rem' }} body={statusBodyTemplate}/>
                 <Column header={__('Azioni', 'gepafin')}
                         body={actionsBodyTemplate}/>
             </DataTable>