@opencitylabs/formio-sdk 1.2.0 → 1.3.0

package/index.js

@@ -79,7 +79,8 @@ class FormIoHelper {
       const response = await axios.get(this.basePath + '/api/' + endPoint, {
         headers: {
           "Content-Type": "application/json",
-          "Authorization": "Bearer " + token
+          "Authorization": "Bearer " + token,
+          "x-locale": this.getCurrentLocale()
         }
       })
       return response.data
@@ -92,7 +93,8 @@ class FormIoHelper {
       const response = await axios.post(this.basePath + '/api/' + endPoint, JSON.stringify(params),{
         headers: {
           "Content-Type": "application/json",
-          "Authorization": "Bearer " + token
+          "Authorization": "Bearer " + token,
+          "x-locale": this.getCurrentLocale()
         }
       })
       return response.data
@@ -115,6 +117,7 @@ class FormIoHelper {
         headers: {
           "Content-Type": "application/json",
           Authorization: `Bearer ${token}`,
+          "x-locale": this.getCurrentLocale()
         },
       });
 
@@ -161,7 +164,8 @@ class FormIoHelper {
   async anonymousCall(endPoint) {
     const response = await axios.get(this.basePath + '/api/' + endPoint, {
       headers: {
-        "Content-Type": "application/json"
+        "Content-Type": "application/json",
+        "x-locale": this.getCurrentLocale()
       }
     })
     return response.data
@@ -568,6 +572,324 @@ class FormIoHelper {
     }
   }
 
+  // --- PROFILE BLOCKS (PDND + Once-Only) ---
+
+  /**
+   * Applies PDND prefilling and once-only fallback to profile block components
+   * that have `sdk_mode: true` in their custom properties.
+   *
+   * @param {object} formInstance - Form.io instance (Webform/Wizard)
+   * @param {string} fiscalCode - User's codice fiscale
+   * @param {object} options
+   * @param {string} options.serviceId - Portal service ID (used to fetch PDND configs)
+   * @param {string} [options.userId] - Portal user ID (used for once-only API; omit for anonymous)
+   * @returns {Promise<Array<{data: object}>>} Data objects to merge via formInstance.setValue()
+   */
+  async applyProfileBlocks(formInstance, fiscalCode, options = {}) {
+    const { serviceId, userId } = options;
+
+    if (!formInstance || !fiscalCode) return [];
+
+    // Load PDND configs autonomously
+    let pdndConfigs = {};
+    if (serviceId) {
+      try {
+        pdndConfigs = await this.authenticatedCall(`services/${serviceId}/pdnd-configs`) || {};
+      } catch (e) {
+        console.warn('[applyProfileBlocks] Could not load PDND configs:', e);
+      }
+    }
+
+    const profileBlockComponents = this._findProfileBlockComponents(formInstance);
+    if (!profileBlockComponents.length) return [];
+
+    // Register once-only event listener once per formInstance lifetime
+    if (userId && !formInstance._sdkOnceOnlyListenerAttached) {
+      formInstance._sdkOnceOnlyListenerAttached = true;
+      formInstance.on('sdkOnceOnlySelected', ({ key, value }) => {
+        formInstance.emit('sdkProfileBlockData', { data: { [key]: value } });
+      });
+    }
+
+    const results = [];
+
+    for (const component of profileBlockComponents) {
+      await component.subFormReady.then(async (subForm) => {
+        if (!subForm?.components?.length) return;
+
+        // Already has PDND meta → just disable fields
+        if (component.getValue().meta !== undefined) {
+          await this._disableProfileBlockFields(component);
+          return;
+        }
+
+        const pdndComponent = subForm.components[0];
+        const eserviceId = pdndComponent?.component?.properties?.eservice;
+        const format = pdndComponent?.component?.properties?.format || 'default';
+
+        if (!eserviceId) {
+          if (userId) await this._initOnceOnly(formInstance, component, pdndComponent, userId);
+          return;
+        }
+
+        if (pdndConfigs[eserviceId]?.is_active) {
+          try {
+            const callUrl =
+              pdndConfigs[eserviceId].call_url +
+              `&fiscal_code=${encodeURIComponent(fiscalCode)}&format=${encodeURIComponent(format)}`;
+            const response = await this._getWithToken(callUrl);
+
+            results.push({ data: { [component.key]: { ...response } } });
+            await this._disableProfileBlockFields(component);
+          } catch (e) {
+            console.warn('[applyProfileBlocks] PDND call failed, falling back to once-only:', e);
+            if (userId) await this._initOnceOnly(formInstance, component, pdndComponent, userId);
+          }
+        } else {
+          if (userId) await this._initOnceOnly(formInstance, component, pdndComponent, userId);
+        }
+      }).catch(e => {
+        console.warn('[applyProfileBlocks] subFormReady error:', e);
+      });
+    }
+
+    return results;
+  }
+
+  _findProfileBlockComponents(formInstance) {
+    const components = [];
+    if (typeof formInstance.everyComponent === 'function') {
+      formInstance.everyComponent(component => {
+        if (
+          component.component.properties?.profile_block !== undefined &&
+          component.component.properties?.sdk_mode
+        ) {
+          components.push(component);
+        }
+      });
+    }
+    return components;
+  }
+
+  async _getWithToken(url) {
+    const token = await this.getCurrentToken();
+    const response = await axios.get(url, {
+      headers: {
+        ...(token ? { 'Authorization': `Bearer ${token}` } : {}),
+        'x-locale': this.getCurrentLocale(),
+      },
+    });
+    return response.data;
+  }
+
+  async _disableProfileBlockFields(component) {
+    const componentData = component.getValue();
+    const source = componentData?.meta?.source || '';
+    const createdAt = componentData?.meta?.created_at;
+    const formattedDate = createdAt
+      ? new Date(createdAt).toLocaleDateString(this.getCurrentLocale() || 'it-IT')
+      : null;
+
+    // Inject PDND alert into component description (rendered natively by Form.io)
+    const alertHtml =
+      `<p class="mt-n4 pdnd-alert">I dati contrassegnati con ` +
+      `<span class="text-success"><i class="bi bi-check-circle"></i></span> ` +
+      `provengono da ${source}` +
+      (formattedDate ? ` aggiornati al ${formattedDate}` : '') +
+      `</p>`;
+
+    if (!component.component.description?.includes('pdnd-alert')) {
+      component.component.description = (component.component.description || '') + alertHtml;
+      if (typeof component.redraw === 'function') component.redraw();
+    }
+
+    if (!component.subFormReady) return;
+
+    component.subFormReady.then(subForm => {
+      if (!subForm?.components) return;
+
+      this._traverseSubformComponents(subForm.components, subComponent => {
+        if (subComponent.type === 'datagrid') {
+          subComponent.component.disableAddingRemovingRows = true;
+          if (typeof subComponent.redraw === 'function') subComponent.redraw();
+        }
+
+        if (subComponent.component.properties?.pdnd_field) {
+          // Add success icon via description (prefix/suffix would appear near input, not label)
+          if (!subComponent.component.description?.includes('pdnd-success-icon')) {
+            subComponent.component.description =
+              `<small class="me-1 text-success pdnd-success-icon"><i class="bi bi-check-circle"></i></small>` +
+              (subComponent.component.description || '');
+          }
+          subComponent.component.disabled = true;
+          if (typeof subComponent.redraw === 'function') subComponent.redraw();
+        }
+      });
+    });
+  }
+
+  async _initOnceOnly(formInstance, component, nestedFormComponent, userId) {
+    if (!component.rendered) return;
+    if (
+      component.path === 'applicant.data.address' ||
+      component.component.key === 'applicant'
+    ) return;
+
+    const componentKey = component.component.key;
+
+    // Avoid double initialization
+    if (component.component.description?.includes('data-once-only-key')) return;
+
+    const isDatagrid =
+      nestedFormComponent?.type === 'datagrid' ||
+      nestedFormComponent?.components?.[0]?.type === 'datagrid';
+
+    try {
+      const response = await this.authenticatedCall(
+        `users/${userId}/profile-blocks?keys=${componentKey}`
+      );
+      if (!response?.data?.length) return;
+
+      if (isDatagrid) {
+        const datagridComponent =
+          nestedFormComponent.type === 'datagrid'
+            ? nestedFormComponent
+            : nestedFormComponent.components[0];
+
+        const datagridKey = datagridComponent.component.key;
+        const datagridData = component.getValue().data?.[datagridKey];
+        const isEmpty =
+          !datagridData ||
+          (Array.isArray(datagridData) &&
+            (datagridData.length === 0 ||
+              (datagridData.length === 1 &&
+                !Object.values(datagridData[0]).some(Boolean))));
+
+        if (isEmpty) {
+          const value = { ...response.data[0].value };
+          if ('meta' in value) delete value.meta;
+          formInstance.emit('sdkProfileBlockData', {
+            data: { [datagridKey]: value },
+          });
+        }
+      } else {
+        const entries = {};
+        response.data.forEach(d => { entries[d.id] = d; });
+
+        // Inject CTA into description — Form.io renders this as HTML natively
+        const ctaHtml =
+          `<p class="once-only-cta mt-2">` +
+          `Compila i campi seguenti oppure ` +
+          `<a href="#" data-once-only-key="${componentKey}">` +
+          `utilizza le informazioni che hai già fornito ` +
+          `<i class="bi bi-box-arrow-up-right"></i></a></p>`;
+
+        component.component.description = (component.component.description || '') + ctaHtml;
+        component.redraw();
+
+        // Scoped click listener — NOT on document, only on this component's element
+        component.element?.addEventListener('click', e => {
+          const anchor = e.target.closest('[data-once-only-key]');
+          if (!anchor) return;
+          e.preventDefault();
+          this._showOnceOnlyModal(formInstance, component, entries, userId);
+        });
+      }
+    } catch (e) {
+      console.warn('[applyProfileBlocks] once-only error:', e);
+    }
+  }
+
+  _showOnceOnlyModal(formInstance, component, entries, userId) {
+    let html = '<div class="it-list-wrapper"><ul class="it-list">';
+    for (const id in entries) {
+      const d = entries[id];
+      const dateStr = new Date(d.updated_at).toLocaleDateString('it-IT');
+      const timeStr = new Date(d.updated_at).toLocaleTimeString('it-IT', {
+        hour: '2-digit',
+        minute: '2-digit',
+      });
+      let name = d.unique_id;
+      const subtitle = `Valore inserito in data ${dateStr} alle ${timeStr}`;
+      if (!name || name === 'undefined' || name === '') name = subtitle;
+
+      // Escape single quotes to avoid breaking data-content attribute
+      const safeContent = JSON.stringify(d.value).replace(/'/g, '&#39;');
+
+      html += `<li>
+        <div class="list-item">
+          <button class="btn btn-link btn-xs text-left select-once-only-entry" data-content='${safeContent}' type="button">
+            <p class="text text-start mb-0">${name}</p>
+            <p class="text-info">${subtitle}</p>
+          </button>
+          <div class="it-right-zone justify-content-end">
+            <button class="btn btn-outline-danger btn-xs mr-1 delete-once-only-entry" data-id="${d.id}" type="button">
+              <i class="bi bi-trash px-1 fs-5"></i>
+            </button>
+          </div>
+        </div>
+      </li>`;
+    }
+    html += '</ul></div>';
+
+    Swal.fire({
+      title: 'Seleziona tra i valori precedentemente salvati',
+      showCloseButton: true,
+      html,
+      showConfirmButton: false,
+      showCancelButton: false,
+      didOpen: () => {
+        Swal.getPopup().querySelectorAll('.select-once-only-entry').forEach(el => {
+          el.addEventListener('click', e => {
+            e.preventDefault();
+            const value = JSON.parse(el.dataset.content);
+            formInstance.emit('sdkOnceOnlySelected', { key: component.path, value });
+            Swal.close();
+          });
+        });
+
+        Swal.getPopup().querySelectorAll('.delete-once-only-entry').forEach(el => {
+          el.addEventListener('click', async () => {
+            const id = el.dataset.id;
+            const result = await Swal.fire({
+              title: 'Sei sicuro di voler procedere?',
+              showDenyButton: true,
+              showCancelButton: false,
+              confirmButtonText: 'Elimina',
+              denyButtonText: 'Annulla',
+              customClass: {
+                confirmButton: 'btn btn-sm btn-danger',
+                denyButton: 'btn btn-sm btn-outline',
+              },
+            });
+            if (result.isConfirmed) {
+              try {
+                await this.authenticatedRequest('DELETE', `users/${userId}/profile-blocks/${id}`);
+                delete entries[id];
+                el.closest('li').remove();
+                if (Swal.getPopup().querySelectorAll('.delete-once-only-entry').length === 0) {
+                  Swal.close();
+                }
+              } catch (err) {
+                console.error('[applyProfileBlocks] delete profile block error:', err);
+              }
+            }
+          });
+        });
+      },
+    });
+  }
+
+  _traverseSubformComponents(components, callback) {
+    if (!components?.length) return;
+    components.forEach(component => {
+      callback(component);
+      if (component.components?.length) {
+        this._traverseSubformComponents(component.components, callback);
+      }
+    });
+  }
+
 }
 
 function createFormioHelper(options = {}) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opencitylabs/formio-sdk",
-  "version": "1.2.0",
+  "version": "1.3.0",
   "description": "Node/browser SDK helper for Form.io APIs",
   "type": "module",
   "main": "index.js",
@@ -24,9 +24,9 @@
   "author": "OpencityLabs",
   "license": "ISC",
   "dependencies": {
-    "axios": "^1.16.0",
+    "axios": "^1.18.1",
     "jwt-decode": "^4.0.0",
     "lodash.get": "^4.4.2",
-    "sweetalert2": "^11.26.24"
+    "sweetalert2": "^11.26.25"
   }
 }