@pagopa/mui-italia/dist/components/FooterPreLogin/FooterPreLogin.js

[Material-UI](https://mui.com/core/) theme inspired by [Bootstrap Italia](https://italia.github.io/bootstrap-italia/).

"use strict";
'use client';
Object.defineProperty(exports, "__esModule", { value: true });
exports.FooterPreLogin = void 0;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const react_1 = require("react");
const material_1 = require("@mui/material");
const LangSwitch_1 = require("../LangSwitch");
const Either_1 = require("fp-ts/lib/Either");
const ts_utils_1 = require("../../utils/ts-utils");
/* Icons */
const LinkedIn_1 = tslib_1.__importDefault(require("@mui/icons-material/LinkedIn"));
const Instagram_1 = tslib_1.__importDefault(require("@mui/icons-material/Instagram"));
const Twitter_1 = tslib_1.__importDefault(require("@mui/icons-material/Twitter"));
const LogoPagoPACompany_1 = require("../../assets/LogoPagoPACompany");
const FundedByNextGenerationEU_1 = require("../../assets/FundedByNextGenerationEU");
const ThreadsIcon_1 = require("../../icons/ThreadsIcon");
const YoutubeIcon_1 = require("../../icons/YoutubeIcon");
const MediumIcon_1 = require("../../icons/MediumIcon");
const ProductType_1 = require("./ProductType");
const FooterPreLogin = (_a) => {
    var _b, _c;
    var { companyLink, links, onExit, productsJsonUrl = 'https://selfcare.pagopa.it/assets/products.json', productsTitle = 'Prodotti e Servizi', onProductsJsonFetchError, hideProductsColumn } = _a, langProps = tslib_1.__rest(_a, ["companyLink", "links", "onExit", "productsJsonUrl", "productsTitle", "onProductsJsonFetchError", "hideProductsColumn"]);
    const { aboutUs, resources, followUs } = links;
    const [jsonProducts, setJsonProducts] = (0, react_1.useState)([]);
    (0, react_1.useEffect)(() => {
        if (!hideProductsColumn) {
            fetch(productsJsonUrl)
                .then((r) => r.json())
                .then((json) => {
                const decodeProducts = ProductType_1.ProductArrayType.decode(json);
                if ((0, Either_1.isRight)(decodeProducts)) {
                    setJsonProducts(decodeProducts.right.slice());
                }
                else {
                    throw (0, Either_1.toError)(JSON.stringify(decodeProducts.left));
                }
            })
                .catch(onProductsJsonFetchError !== null && onProductsJsonFetchError !== void 0 ? onProductsJsonFetchError : ((reason) => console.error(reason)));
        }
    }, []);
    const iconMap = {
        linkedin: (0, jsx_runtime_1.jsx)(LinkedIn_1.default, {}),
        instagram: (0, jsx_runtime_1.jsx)(Instagram_1.default, {}),
        threads: (0, jsx_runtime_1.jsx)(ThreadsIcon_1.ThreadsIcon, {}),
        youtube: (0, jsx_runtime_1.jsx)(YoutubeIcon_1.YoutubeIcon, {}),
        twitter: (0, jsx_runtime_1.jsx)(Twitter_1.default, {}),
        medium: (0, jsx_runtime_1.jsx)(MediumIcon_1.MediumIcon, {}),
    };
    return ((0, jsx_runtime_1.jsx)(material_1.Box, Object.assign({ sx: {
            borderTop: 1,
            borderColor: 'divider',
            backgroundColor: 'background.paper',
        } }, { children: (0, jsx_runtime_1.jsx)(material_1.Container, Object.assign({ maxWidth: false, sx: { py: 8 } }, { children: (0, jsx_runtime_1.jsxs)(material_1.Grid, Object.assign({ container: true, spacing: { xs: 6, sm: 3 } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 3 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ spacing: 2, alignItems: { xs: 'center', sm: 'start' } }, { children: [companyLink && ((0, jsx_runtime_1.jsx)(material_1.Link, Object.assign({ "aria-label": companyLink.ariaLabel, href: (_b = companyLink.href) !== null && _b !== void 0 ? _b : ts_utils_1.hrefNoOp, onClick: (0, ts_utils_1.wrapHandleExitAction)((_c = companyLink.href) !== null && _c !== void 0 ? _c : ts_utils_1.hrefNoOp, companyLink.onClick, onExit), sx: { display: 'inline-flex' } }, { children: (0, jsx_runtime_1.jsx)(LogoPagoPACompany_1.LogoPagoPACompany, {}) }))), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ component: "ul", alignItems: { xs: 'center', sm: 'start' }, sx: { padding: 0, listStyle: 'none' } }, { children: aboutUs === null || aboutUs === void 0 ? void 0 : aboutUs.links.map(({ href = ts_utils_1.hrefNoOp, label, ariaLabel, onClick }, i) => ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(material_1.Link, Object.assign({ "aria-label": ariaLabel, component: "a", href: href, onClick: (0, ts_utils_1.wrapHandleExitAction)(href, onClick, onExit), underline: "none", color: "text.primary", sx: { display: 'inline-block', py: 0.5 }, variant: "subtitle2" }, { children: label })) }, i))) }))] })) })), !hideProductsColumn && ((0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 3 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ spacing: 2, alignItems: { xs: 'center', sm: 'start' } }, { children: [jsonProducts && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "overline" }, { children: productsTitle })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ component: "ul", alignItems: { xs: 'center', sm: 'start' }, sx: { padding: 0, listStyle: 'none' } }, { children: jsonProducts &&
                                        (jsonProducts === null || jsonProducts === void 0 ? void 0 : jsonProducts.map(({ href = ts_utils_1.hrefNoOp, label, ariaLabel, onClick }, i) => ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(material_1.Link, Object.assign({ "aria-label": ariaLabel, component: "a", href: href, onClick: (0, ts_utils_1.wrapHandleExitAction)(href, onClick, onExit), underline: "none", color: "text.primary", sx: { display: 'inline-block', py: 0.5 }, variant: "subtitle2", lang: "it" // json products are in Italian, so we can set lang attribute to it for a11y
                                             }, { children: label })) }, i)))) }))] })) }))), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 3 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ spacing: 2, alignItems: { xs: 'center', sm: 'start' } }, { children: [(resources === null || resources === void 0 ? void 0 : resources.title) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "overline" }, { children: resources.title })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ component: "ul", alignItems: { xs: 'center', sm: 'start' }, sx: { padding: 0, listStyle: 'none' } }, { children: resources === null || resources === void 0 ? void 0 : resources.links.map(({ href = ts_utils_1.hrefNoOp, label, ariaLabel, onClick }, i) => ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(material_1.Link, Object.assign({ "aria-label": ariaLabel, component: "a", href: href, onClick: (0, ts_utils_1.wrapHandleExitAction)(href, onClick, onExit), underline: "none", color: "text.primary", sx: { display: 'inline-block', py: 0.5 }, variant: "subtitle2" }, { children: label })) }, i))) }))] })) })), (0, jsx_runtime_1.jsx)(material_1.Grid, Object.assign({ item: true, xs: 12, sm: 3 }, { children: (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ spacing: 3, justifyContent: "space-between", sx: { height: '100%' }, alignItems: { xs: 'center', sm: 'start' } }, { children: [(0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ spacing: 2, alignItems: { xs: 'center', sm: 'start' } }, { children: [(followUs === null || followUs === void 0 ? void 0 : followUs.title) && (0, jsx_runtime_1.jsx)(material_1.Typography, Object.assign({ variant: "overline" }, { children: followUs.title })), (0, jsx_runtime_1.jsxs)(material_1.Stack, Object.assign({ alignItems: { xs: 'center', sm: 'start' } }, { children: [(0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ spacing: { xs: 3, sm: 1.5, lg: 3 }, direction: "row", component: "ul", alignItems: { xs: 'center', sm: 'start' }, sx: { padding: 0, mt: 0.5, listStyle: 'none' } }, { children: followUs === null || followUs === void 0 ? void 0 : followUs.socialLinks.filter(({ icon }) => icon in iconMap).map(({ icon, href = ts_utils_1.hrefNoOp, ariaLabel, onClick }, i) => ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(material_1.Link, Object.assign({ "aria-label": ariaLabel, href: href, onClick: (0, ts_utils_1.wrapHandleExitAction)(href, onClick, onExit), underline: "none", color: "text.primary", sx: { display: 'inline-flex' }, variant: "caption" }, { children: iconMap[icon] })) }, i))) })), (0, jsx_runtime_1.jsx)(material_1.Stack, Object.assign({ component: "ul", alignItems: { xs: 'center', sm: 'start' }, sx: { padding: 0, margin: 0, listStyle: 'none' } }, { children: followUs === null || followUs === void 0 ? void 0 : followUs.links.map(({ href = ts_utils_1.hrefNoOp, label, ariaLabel, onClick }, i) => ((0, jsx_runtime_1.jsx)("li", { children: (0, jsx_runtime_1.jsx)(material_1.Link, Object.assign({ "aria-label": ariaLabel, href: href, onClick: (0, ts_utils_1.wrapHandleExitAction)(href, onClick, onExit), underline: "none", color: "text.primary", sx: { display: 'inline-block', py: 0.5 }, variant: "subtitle2" }, { children: label })) }, i))) })), (0, jsx_runtime_1.jsx)(LangSwitch_1.LangSwitch, Object.assign({}, langProps))] }))] })), (0, jsx_runtime_1.jsx)(FundedByNextGenerationEU_1.FundedByNextGenerationEU, { size: 180 })] })) }))] })) })) })));
};
exports.FooterPreLogin = FooterPreLogin;