@pagopa/selfcare-common-frontend 1.34.103 → 1.34.106

package/CHANGELOG.md

@@ -4,8 +4,10 @@ All notable changes to this project will be documented in this file. Dates are d
 
 Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 
-#### [v1.34.103](https://github.com/pagopa/selfcare-common-frontend/compare/v1.35.0...v1.34.103)
+#### [v1.34.106](https://github.com/pagopa/selfcare-common-frontend/compare/v1.35.0...v1.34.106)
 
+- add utility function getAppArea [`#339`](https://github.com/pagopa/selfcare-common-frontend/pull/339)
+- created a new reducer for products [`#338`](https://github.com/pagopa/selfcare-common-frontend/pull/338)
 - Add new util to check for pec email [`#336`](https://github.com/pagopa/selfcare-common-frontend/pull/336)
 - reset type module [`#335`](https://github.com/pagopa/selfcare-common-frontend/pull/335)
 - update to esm [`#334`](https://github.com/pagopa/selfcare-common-frontend/pull/334)
@@ -159,12 +161,30 @@ Generated by [`auto-changelog`](https://github.com/CookPete/auto-changelog).
 - SELC-2590 - update common [`#2590`](https://pagopa.atlassian.net/browse/2590)
 - Bump @emotion/react from 11.11.1 to 11.13.3 [`5ecabb5`](https://github.com/pagopa/selfcare-common-frontend/commit/5ecabb5e2f1dd3a289efb98fcb49cd13074bd5d7)
 - Bump rimraf from 3.0.2 to 6.0.1 [`e6941b9`](https://github.com/pagopa/selfcare-common-frontend/commit/e6941b9e6b05c973d991e2470a851b5ca03926ce)
-- Used a environment variable to manage correct links in the footer based to product and  actual environment [`960e2fb`](https://github.com/pagopa/selfcare-common-frontend/commit/960e2fbaa8aa8f79061639b26dc1a27f28b8aae3)
+- add GitHub Actions workflow for deploying to npm [`745bcbb`](https://github.com/pagopa/selfcare-common-frontend/commit/745bcbb8465bf88417dbc82df12b504bdb3b5757)
 
-#### [v1.35.0](https://github.com/pagopa/selfcare-common-frontend/compare/v1.34.102...v1.35.0)
+#### [v1.35.0](https://github.com/pagopa/selfcare-common-frontend/compare/v1.34.105...v1.35.0)
 
 > 20 July 2023
 
+#### [v1.34.105](https://github.com/pagopa/selfcare-common-frontend/compare/v1.34.104...v1.34.105)
+
+> 29 April 2026
+
+- add utility function getAppArea [`#339`](https://github.com/pagopa/selfcare-common-frontend/pull/339)
+
+#### [v1.34.104](https://github.com/pagopa/selfcare-common-frontend/compare/v1.34.103...v1.34.104)
+
+> 21 April 2026
+
+- created a new reducer for products [`#338`](https://github.com/pagopa/selfcare-common-frontend/pull/338)
+
+#### [v1.34.103](https://github.com/pagopa/selfcare-common-frontend/compare/v1.34.102...v1.34.103)
+
+> 8 April 2026
+
+- [SELC-8372] Feat: [AR-34] Label in the name [`#8372`](https://pagopa.atlassian.net/browse/8372)
+
 #### [v1.34.102](https://github.com/pagopa/selfcare-common-frontend/compare/v1.34.101...v1.34.102)
 
 > 26 March 2026

package/build.info

@@ -1,2 +1,2 @@
-20260408.1 - selfcare-common-frontend.deploy(266529)
-tags/v1.29.0~1^2 d661ef989498df1bdb00e1f747bd1593b3f14f41
+20260507.1 - selfcare-common-frontend.deploy(270827)
+tags/v1.29.0~1^2 7606863c627968a4113c1cc95ed43ee476615afe

package/lib/components/CustomPagination.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { Page } from '../model/Page';
 import { PageRequest } from '../model/PageRequest';
 type Props = {
@@ -7,7 +8,11 @@ type Props = {
     sort?: string;
     /** The function to be invoked if the user change page */
     onPageRequest: (r: PageRequest) => void;
+    /** The variant of the pagination component */
+    variant?: 'outlined' | 'text';
+    /** The component to control the page size */
+    pageSizeControl?: React.ReactNode;
 };
 /** Selfcare custom table available pages component */
-export default function CustomPagination({ page, onPageRequest, sort }: Props): import("react/jsx-runtime").JSX.Element;
+export default function CustomPagination({ page, onPageRequest, sort, variant, pageSizeControl, }: Readonly<Props>): import("react/jsx-runtime").JSX.Element;
 export {};

package/lib/components/CustomPagination.js

@@ -1,7 +1,6 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { Grid, Pagination } from '@mui/material';
 import PaginationItem from '@mui/material/PaginationItem';
-import React from 'react';
 function defaultLabelDisplayedRows(from, to, count) {
     // eslint-disable-next-line sonarjs/no-nested-template-literals
     return `${from}-${to} di ${count !== -1 ? count : `più di ${to}`}`;
@@ -13,14 +12,14 @@ const getLabelDisplayedRowsTo = (count, page, size) => {
     return size === -1 ? count : Math.min(count, (page + 1) * size);
 };
 /** Selfcare custom table available pages component */
-export default function CustomPagination({ page, onPageRequest, sort }) {
+export default function CustomPagination({ page, onPageRequest, sort, variant, pageSizeControl, }) {
     const count = page.totalElements;
     const from = count === 0 ? 0 : page.number * page.size + 1;
     const to = getLabelDisplayedRowsTo(count, page.number, page.size);
-    return (_jsx(React.Fragment, { children: _jsxs(Grid, { container: true, sx: { padding: '0 10px' }, children: [_jsx(Grid, { item: true, xs: 6, display: "flex", justifyContent: "start", alignItems: 'center', children: defaultLabelDisplayedRows(from, to, count) }), _jsx(Grid, { item: true, xs: 6, display: "flex", justifyContent: "end", alignItems: 'center', children: page.totalElements > page.size && (_jsx(Pagination, { sx: { display: 'flex' }, color: "primary", shape: "rounded", page: page.number + 1, count: page.totalPages, renderItem: (props2) => (_jsx(PaginationItem, { ...props2, sx: { border: 'none' }, variant: "outlined" })), onChange: (_event, value) => (onPageRequest({
-                            page: value - 1,
-                            size: page.size,
-                            sort,
-                        }),
-                            window.scrollTo(0, 0)) })) })] }) }));
+    return (_jsxs(Grid, { container: true, sx: { padding: '0 10px' }, children: [_jsx(Grid, { item: true, xs: 6, display: "flex", justifyContent: "start", alignItems: 'center', children: pageSizeControl ?? defaultLabelDisplayedRows(from, to, count) }), _jsx(Grid, { item: true, xs: 6, display: "flex", justifyContent: "end", alignItems: 'center', children: page.totalElements > page.size && (_jsx(Pagination, { sx: { display: 'flex' }, color: "primary", shape: "rounded", page: page.number + 1, count: page.totalPages, renderItem: (props2) => (_jsx(PaginationItem, { ...props2, sx: { border: 'none' }, variant: variant ?? 'outlined' })), onChange: (_event, value) => (onPageRequest({
+                        page: value - 1,
+                        size: page.size,
+                        sort,
+                    }),
+                        window.scrollTo(0, 0)) })) })] }));
 }

package/lib/redux/slices/productsSlice.d.ts

@@ -0,0 +1,204 @@
+import { PayloadAction } from '@reduxjs/toolkit';
+export declare enum StatusEnum {
+    'ACTIVE' = "ACTIVE",
+    'TESTING' = "TESTING",
+    'PHASE_OUT' = "PHASE_OUT",
+    'INACTIVE' = "INACTIVE"
+}
+export interface SubProductResource {
+    /** Product's unique identifier */
+    id: string;
+    /** Product's title */
+    title: string;
+    /** Product's onBoarding status */
+    productOnBoardingStatus: 'ACTIVE' | 'PENDING' | 'INACTIVE';
+    /** Product's status */
+    status: StatusEnum;
+    /** If a product is delegable to a technical partner */
+    delegable: boolean;
+    /** Product's depict image */
+    imageUrl: string;
+    /** Product's logo */
+    logo: string;
+    /** Product logo's background color */
+    logoBgColor: string;
+    /** Product's description */
+    description: string;
+    /** URL that redirects to the public information webpage of the product */
+    urlPublic: string;
+    /** If a product is invoiceable */
+    invoiceable: boolean;
+}
+export interface Product {
+    description: string;
+    id: string;
+    logo: string;
+    title: string;
+    urlBO: string;
+    backOfficeEnvironmentConfigurations?: Array<{
+        environment?: string;
+        url?: string;
+    }>;
+    urlPublic?: string;
+    tag?: string;
+    status: StatusEnum;
+    imageUrl: string;
+    subProducts?: Array<SubProductResource>;
+    logoBgColor?: string;
+    delegable: boolean;
+    invoiceable?: boolean;
+}
+export declare const InitialState: never[];
+export declare const productsSlice: import("@reduxjs/toolkit").Slice<Product[], {
+    setProducts: (state: {
+        description: string;
+        id: string;
+        logo: string;
+        title: string;
+        urlBO: string;
+        backOfficeEnvironmentConfigurations?: {
+            environment?: string | undefined;
+            url?: string | undefined;
+        }[] | undefined;
+        urlPublic?: string | undefined;
+        tag?: string | undefined;
+        status: StatusEnum;
+        imageUrl: string;
+        subProducts?: {
+            id: string;
+            title: string;
+            productOnBoardingStatus: "ACTIVE" | "PENDING" | "INACTIVE";
+            status: StatusEnum;
+            delegable: boolean;
+            imageUrl: string;
+            logo: string;
+            logoBgColor: string;
+            description: string;
+            urlPublic: string;
+            invoiceable: boolean;
+        }[] | undefined;
+        logoBgColor?: string | undefined;
+        delegable: boolean;
+        invoiceable?: boolean | undefined;
+    }[], action: PayloadAction<Array<Product>>) => {
+        [x: number]: Product | {
+            description: string;
+            id: string;
+            logo: string;
+            title: string;
+            urlBO: string;
+            backOfficeEnvironmentConfigurations?: {
+                environment?: string | undefined;
+                url?: string | undefined;
+            }[] | undefined;
+            urlPublic?: string | undefined;
+            tag?: string | undefined;
+            status: StatusEnum;
+            imageUrl: string;
+            subProducts?: {
+                id: string;
+                title: string;
+                productOnBoardingStatus: "ACTIVE" | "PENDING" | "INACTIVE";
+                status: StatusEnum;
+                delegable: boolean;
+                imageUrl: string;
+                logo: string;
+                logoBgColor: string;
+                description: string;
+                urlPublic: string;
+                invoiceable: boolean;
+            }[] | undefined;
+            logoBgColor?: string | undefined;
+            delegable: boolean;
+            invoiceable?: boolean | undefined;
+        };
+        length: number;
+        toString(): string;
+        toLocaleString(): string;
+        toLocaleString(locales: string | string[], options?: Intl.NumberFormatOptions & Intl.DateTimeFormatOptions): string;
+        pop(): Product | undefined;
+        push(...items: Product[]): number;
+        concat(...items: ConcatArray<Product>[]): Product[];
+        concat(...items: (Product | ConcatArray<Product>)[]): Product[];
+        join(separator?: string): string;
+        reverse(): Product[];
+        shift(): Product | undefined;
+        slice(start?: number, end?: number): Product[];
+        sort(compareFn?: ((a: Product, b: Product) => number) | undefined): Product[];
+        splice(start: number, deleteCount?: number): Product[];
+        splice(start: number, deleteCount: number, ...items: Product[]): Product[];
+        unshift(...items: Product[]): number;
+        indexOf(searchElement: Product, fromIndex?: number): number;
+        lastIndexOf(searchElement: Product, fromIndex?: number): number;
+        every<S extends Product>(predicate: (value: Product, index: number, array: Product[]) => value is S, thisArg?: any): this is S[];
+        every(predicate: (value: Product, index: number, array: Product[]) => unknown, thisArg?: any): boolean;
+        some(predicate: (value: Product, index: number, array: Product[]) => unknown, thisArg?: any): boolean;
+        forEach(callbackfn: (value: Product, index: number, array: Product[]) => void, thisArg?: any): void;
+        map<U>(callbackfn: (value: Product, index: number, array: Product[]) => U, thisArg?: any): U[];
+        filter<S extends Product>(predicate: (value: Product, index: number, array: Product[]) => value is S, thisArg?: any): S[];
+        filter(predicate: (value: Product, index: number, array: Product[]) => unknown, thisArg?: any): Product[];
+        reduce(callbackfn: (previousValue: Product, currentValue: Product, currentIndex: number, array: Product[]) => Product): Product;
+        reduce(callbackfn: (previousValue: Product, currentValue: Product, currentIndex: number, array: Product[]) => Product, initialValue: Product): Product;
+        reduce<U>(callbackfn: (previousValue: U, currentValue: Product, currentIndex: number, array: Product[]) => U, initialValue: U): U;
+        reduceRight(callbackfn: (previousValue: Product, currentValue: Product, currentIndex: number, array: Product[]) => Product): Product;
+        reduceRight(callbackfn: (previousValue: Product, currentValue: Product, currentIndex: number, array: Product[]) => Product, initialValue: Product): Product;
+        reduceRight<U>(callbackfn: (previousValue: U, currentValue: Product, currentIndex: number, array: Product[]) => U, initialValue: U): U;
+        find<S extends Product>(predicate: (value: Product, index: number, obj: Product[]) => value is S, thisArg?: any): S | undefined;
+        find(predicate: (value: Product, index: number, obj: Product[]) => unknown, thisArg?: any): Product | undefined;
+        findIndex(predicate: (value: Product, index: number, obj: Product[]) => unknown, thisArg?: any): number;
+        fill(value: Product, start?: number, end?: number): Product[];
+        copyWithin(target: number, start: number, end?: number): Product[];
+        entries(): ArrayIterator<[number, Product]>;
+        keys(): ArrayIterator<number>;
+        values(): ArrayIterator<Product>;
+        includes(searchElement: Product, fromIndex?: number): boolean;
+        flatMap<U, This = undefined>(callback: (this: This, value: Product, index: number, array: Product[]) => U | readonly U[], thisArg?: This | undefined): U[];
+        flat<A, D extends number = 1>(this: A, depth?: D | undefined): FlatArray<A, D>[];
+        [Symbol.iterator](): ArrayIterator<Product>;
+        [Symbol.unscopables]: {
+            [x: number]: boolean | undefined;
+            length?: boolean | undefined;
+            toString?: boolean | undefined;
+            toLocaleString?: boolean | undefined;
+            pop?: boolean | undefined;
+            push?: boolean | undefined;
+            concat?: boolean | undefined;
+            join?: boolean | undefined;
+            reverse?: boolean | undefined;
+            shift?: boolean | undefined;
+            slice?: boolean | undefined;
+            sort?: boolean | undefined;
+            splice?: boolean | undefined;
+            unshift?: boolean | undefined;
+            indexOf?: boolean | undefined;
+            lastIndexOf?: boolean | undefined;
+            every?: boolean | undefined;
+            some?: boolean | undefined;
+            forEach?: boolean | undefined;
+            map?: boolean | undefined;
+            filter?: boolean | undefined;
+            reduce?: boolean | undefined;
+            reduceRight?: boolean | undefined;
+            find?: boolean | undefined;
+            findIndex?: boolean | undefined;
+            fill?: boolean | undefined;
+            copyWithin?: boolean | undefined;
+            entries?: boolean | undefined;
+            keys?: boolean | undefined;
+            values?: boolean | undefined;
+            includes?: boolean | undefined;
+            flatMap?: boolean | undefined;
+            flat?: boolean | undefined;
+            [Symbol.iterator]?: boolean | undefined;
+            readonly [Symbol.unscopables]?: boolean | undefined;
+            at?: boolean | undefined;
+        };
+        at(index: number): Product | undefined;
+    };
+    resetProducts: () => never[];
+}, "products", "products", import("@reduxjs/toolkit").SliceSelectors<Product[]>>;
+export declare const setProducts: import("@reduxjs/toolkit").ActionCreatorWithPayload<Product[], "products/setProducts">, resetProducts: import("@reduxjs/toolkit").ActionCreatorWithoutPayload<"products/resetProducts">;
+export declare const productsReducer: import("redux").Reducer<Product[]>;
+export declare const selectProducts: (state: {
+    products: Array<Product>;
+}) => Product[];

package/lib/redux/slices/productsSlice.js

@@ -0,0 +1,26 @@
+/* eslint-disable functional/immutable-data */
+import { createSlice } from '@reduxjs/toolkit';
+export var StatusEnum;
+(function (StatusEnum) {
+    StatusEnum["ACTIVE"] = "ACTIVE";
+    StatusEnum["TESTING"] = "TESTING";
+    StatusEnum["PHASE_OUT"] = "PHASE_OUT";
+    StatusEnum["INACTIVE"] = "INACTIVE";
+})(StatusEnum || (StatusEnum = {}));
+export const InitialState = [];
+export const productsSlice = createSlice({
+    name: 'products',
+    initialState: InitialState,
+    reducers: {
+        setProducts: (state, action) => ({
+            ...state,
+            ...action.payload,
+        }),
+        resetProducts: () => InitialState,
+    },
+});
+// Actions
+export const { setProducts, resetProducts } = productsSlice.actions;
+export const productsReducer = productsSlice.reducer;
+// Selectors
+export const selectProducts = (state) => state.products;

package/lib/utils/constants.js

@@ -73,6 +73,7 @@ export const PRODUCT_IDS = {
     CIBAN: 'prod-ciban',
     CGN: 'prod-cgn',
 };
+// TODO remove this. Moved this logic into env files
 export const ALLOWED_PREFIXES = ['prod-interop', 'prod-pn'];
 /**
  * Validates if a product ID matches our allowed prefixes.

package/lib/utils/utils.d.ts

@@ -6,3 +6,6 @@ export declare const specialChar2NormalChar: (char: string) => string;
 export declare const acceptedVowels: RegExp;
 export declare const acceptedConsonants: RegExp;
 export declare const isPecEmail: (email: string) => boolean;
+type AppArea = 'imprese' | 'ar_backstage' | 'area_riservata';
+export declare const getAppArea: () => AppArea;
+export {};

package/lib/utils/utils.js

@@ -1,3 +1,4 @@
+import { isPagoPaUser } from './storage';
 export const formatDateAsLongString = (date) => {
     const ye = new Intl.DateTimeFormat('it', { year: 'numeric' }).format(date);
     const mo = new Intl.DateTimeFormat('it', { month: 'long' }).format(date);
@@ -130,3 +131,18 @@ export const acceptedVowels = /[aeiouàèìòùáéíóúäëïöüâêîôûæ
 export const acceptedConsonants = /[bcdfghjklmnpqrstvwxyzñçčšžǩßḃḍḫķḻḳṅṯẓẟẝƁƇƔƝƤƧƬƲƳƵʍʜʎɹɾʃʒʔɲ]/gi;
 const PEC_PATTERNS = [/@pec\./i, /@postecert\./i, /@legalmail\./i];
 export const isPecEmail = (email) => PEC_PATTERNS.some((pattern) => pattern.test(email));
+const IMPRESE_URL_PREFIXES = [
+    'https://imprese.notifichedigitali.it',
+    'https://imprese.uat.notifichedigitali.it',
+    'https://pnpg.dev.selfcare.pagopa.it',
+];
+export const getAppArea = () => {
+    const currentUrl = window.location.origin + window.location.pathname;
+    if (IMPRESE_URL_PREFIXES.some((prefix) => currentUrl.startsWith(prefix))) {
+        return 'imprese';
+    }
+    if (isPagoPaUser()) {
+        return 'ar_backstage';
+    }
+    return 'area_riservata';
+};

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@pagopa/selfcare-common-frontend",
   "description": "Shared React components for the pagopa selfcare project",
-  "version": "1.34.103",
+  "version": "1.34.106",
   "license": "MIT",
   "repository": "https://github.com/pagopa/selfcare-common-frontend",
   "author": "https://www.pagopa.gov.it",