@selfcommunity/react-ui 0.7.0-alpha.32 → 0.7.0-alpha.320

package/lib/esm/components/Composer/Poll/Poll.d.ts

@@ -29,4 +29,3 @@ export interface PollProps {
 }
 declare const _default: (inProps: PollProps) => JSX.Element;
 export default _default;
-//# sourceMappingURL=Poll.d.ts.map

package/lib/esm/components/Composer/Poll/Poll.js

@@ -1,14 +1,4 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
+import { __rest } from "tslib";
 import React, { forwardRef, useEffect, useState } from 'react';
 import { Box, Button, Checkbox, Divider, FormControlLabel, FormGroup, IconButton, TextField, Tooltip, Typography } from '@mui/material';
 import { styled } from '@mui/material/styles';
@@ -23,6 +13,7 @@ import itLocale from 'date-fns/locale/it';
 import enLocale from 'date-fns/locale/en-US';
 import classNames from 'classnames';
 import { useThemeProps } from '@mui/system';
+import { parseISO } from 'date-fns';
 const localeMap = {
     en: enLocale,
     it: itLocale
@@ -97,7 +88,7 @@ export default (inProps) => {
     const intl = useIntl();
     // Component update
     useEffect(() => {
-        if (onChange && (title || expiration !== null || choices.filter((c) => c.choice.length > 0).length > 0)) {
+        if (onChange && (title || titleError || expiration !== null || choices.filter((c) => c.choice.length > 0).length > 0)) {
             onChange({ title, expiration_at: expiration, multiple_choices: multiple, choices: choices.filter((c) => c.choice.length > 0) });
         }
     }, [title, multiple, expiration, choices]);
@@ -133,13 +124,13 @@ export default (inProps) => {
     return (React.createElement(Root, { id: id, className: classNames(classes.root, className) },
         generalError && React.createElement(Typography, { className: classes.generalError }, generalError),
         React.createElement(Box, { className: classes.title },
-            React.createElement(TextField, { label: React.createElement(FormattedMessage, { id: "ui.composer.poll.title", defaultMessage: "ui.composer.poll.title" }), variant: "outlined", value: title, onChange: handleChangeTitle, fullWidth: true, error: Boolean(titleError), helperText: titleError ? titleError.error : null, InputProps: {
+            React.createElement(TextField, { label: React.createElement(FormattedMessage, { id: "ui.composer.poll.title", defaultMessage: "ui.composer.poll.title" }), variant: "outlined", value: title, onChange: handleChangeTitle, fullWidth: true, error: Boolean(titleError), helperText: titleError && titleError, InputProps: {
                     endAdornment: React.createElement(Typography, { variant: "body2" }, COMPOSER_POLL_TITLE_MAX_LENGTH - title.length)
                 } })),
         React.createElement(Box, { className: classes.choices },
             React.createElement(ReactSortable, { list: [...choices], setList: (newSort) => setChoices(newSort), tag: SortableComponent }, choices.map((choice, index) => (React.createElement(TextField, { key: index, placeholder: intl.formatMessage(messages.choicePlaceholder), value: choice.choice, onChange: handleChangeChoice(index), variant: "outlined", InputProps: {
                     startAdornment: (React.createElement(InputAdornment, { position: "start" },
-                        React.createElement(Icon, null, "check"))),
+                        React.createElement(Icon, null, "drag"))),
                     endAdornment: (React.createElement(InputAdornment, { position: "end" },
                         React.createElement(Tooltip, { title: choices.length <= COMPOSER_POLL_MIN_CHOICES ? (React.createElement(FormattedMessage, { id: "ui.composer.poll.choice.delete.disabled", defaultMessage: "ui.composer.poll.choice.delete.disabled" })) : (React.createElement(FormattedMessage, { id: "ui.composer.poll.choice.delete", defaultMessage: "ui.composer.poll.choice.delete" })) },
                             React.createElement("span", null,
@@ -153,7 +144,6 @@ export default (inProps) => {
         React.createElement(Divider, null),
         React.createElement(FormGroup, { className: classes.metadata },
             React.createElement(FormControlLabel, { control: React.createElement(Checkbox, { checked: multiple, onChange: handleChangeMultiple }), label: React.createElement(FormattedMessage, { id: "ui.composer.poll.multiple", defaultMessage: "ui.composer.poll.multiple" }) }),
-            React.createElement(LocalizationProvider, { dateAdapter: AdapterDateFns, locale: localeMap[intl.locale] },
-                React.createElement(DatePicker, { label: React.createElement(FormattedMessage, { id: "ui.composer.poll.expiration", defaultMessage: "ui.composer.poll.expiration" }), value: expiration, onChange: handleChangeExpiration, renderInput: (params) => React.createElement(TextField, Object.assign({}, params)), minDate: minDate })))));
+            React.createElement(LocalizationProvider, { dateAdapter: AdapterDateFns, adapterLocale: localeMap[intl.locale] },
+                React.createElement(DatePicker, { label: React.createElement(FormattedMessage, { id: "ui.composer.poll.expiration", defaultMessage: "ui.composer.poll.expiration" }), value: typeof expiration === 'string' ? parseISO(expiration) : expiration, onChange: handleChangeExpiration, slotProps: { textField: { variant: 'outlined' } }, minDate: minDate })))));
 };
-//# sourceMappingURL=Poll.js.map

package/lib/esm/components/Composer/Poll/index.d.ts

@@ -1,4 +1,3 @@
 import Poll, { PollProps } from './Poll';
 export default Poll;
 export { PollProps };
-//# sourceMappingURL=index.d.ts.map

package/lib/esm/components/Composer/Poll/index.js

@@ -1,3 +1,2 @@
 import Poll from './Poll';
 export default Poll;
-//# sourceMappingURL=index.js.map

package/lib/esm/components/Composer/Skeleton.d.ts

@@ -23,4 +23,3 @@
  *
  */
 export default function ComposerSkeleton(): JSX.Element;
-//# sourceMappingURL=Skeleton.d.ts.map

package/lib/esm/components/Composer/Skeleton.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { styled } from '@mui/material/styles';
 import Skeleton from '@mui/material/Skeleton';
-import { Box, DialogActions, DialogContent, DialogTitle } from '@mui/material';
+import { Box, DialogActions, DialogContent, DialogTitle, useTheme } from '@mui/material';
 const PREFIX = 'SCComposerSkeleton';
 const classes = {
     root: `${PREFIX}-root`,
@@ -85,12 +85,13 @@ const Root = styled(Box, {
  *
  */
 export default function ComposerSkeleton() {
+    const theme = useTheme();
     return (React.createElement(Root, { className: classes.root },
         React.createElement(DialogTitle, { className: classes.title },
             React.createElement(Box, null,
                 React.createElement(Skeleton, { animation: "wave", height: 10, width: "100%" })),
             React.createElement(Box, null,
-                React.createElement(Skeleton, { className: classes.avatar, animation: "wave", variant: "circular", width: 40, height: 40 })),
+                React.createElement(Skeleton, { className: classes.avatar, animation: "wave", variant: "circular", width: theme.selfcommunity.user.avatar.sizeMedium, height: theme.selfcommunity.user.avatar.sizeMedium })),
             React.createElement(Box, null,
                 React.createElement(Skeleton, { animation: "wave", height: 10, width: "100%" }))),
         React.createElement(DialogContent, { className: classes.content },
@@ -99,4 +100,3 @@ export default function ComposerSkeleton() {
             React.createElement(Skeleton, { animation: "wave", height: 10, width: "40%" }),
             React.createElement(Skeleton, { animation: "wave", height: 10, width: "40%" }))));
 }
-//# sourceMappingURL=Skeleton.js.map

package/lib/esm/components/Composer/index.d.ts

@@ -2,4 +2,3 @@ import Composer, { ComposerProps, MAIN_VIEW, POLL_VIEW } from './Composer';
 import ComposerSkeleton from './Skeleton';
 export default Composer;
 export { ComposerProps, ComposerSkeleton, MAIN_VIEW, POLL_VIEW };
-//# sourceMappingURL=index.d.ts.map

package/lib/esm/components/Composer/index.js

@@ -2,4 +2,3 @@ import Composer, { MAIN_VIEW, POLL_VIEW } from './Composer';
 import ComposerSkeleton from './Skeleton';
 export default Composer;
 export { ComposerSkeleton, MAIN_VIEW, POLL_VIEW };
-//# sourceMappingURL=index.js.map

package/lib/esm/components/ComposerIconButton/ComposerIconButton.d.ts

@@ -0,0 +1,36 @@
+import { IconButtonProps } from '@mui/material';
+import { ComposerProps } from '../Composer';
+export interface ComposerIconButtonProps extends IconButtonProps {
+    /**
+     * Composer Props
+     * @default null
+     */
+    ComposerProps?: ComposerProps;
+    /**
+     * Other props
+     */
+    items?: any;
+}
+/**
+ * > API documentation for the Community-JS Composer Icon Button component. Learn about the available props and the CSS API.
+
+ #### Import
+
+ ```jsx
+ import {ComposerIconButton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SComposerIconButton` can be used when providing style overrides in the theme.
+
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SComposerIconButton-root|Styles applied to the root element.|
+
+ * @param inProps
+ */
+export default function ComposerIconButton(inProps: ComposerIconButtonProps): JSX.Element;

package/lib/esm/components/ComposerIconButton/ComposerIconButton.js

@@ -0,0 +1,90 @@
+import { __rest } from "tslib";
+import React, { useCallback, useMemo, useState } from 'react';
+import { styled } from '@mui/material/styles';
+import { Icon, IconButton } from '@mui/material';
+import { Link, SCRoutes, UserUtils, useSCContext, useSCRouting, useSCUser } from '@selfcommunity/react-core';
+import classNames from 'classnames';
+import { useThemeProps } from '@mui/system';
+import { FormattedMessage } from 'react-intl';
+import Composer from '../Composer';
+import { useSnackbar } from 'notistack';
+import { getRouteData } from '../../utils/contribution';
+const PREFIX = 'SCComposerIconButton';
+const classes = {
+    root: `${PREFIX}-root`
+};
+const Root = styled(IconButton, {
+    name: PREFIX,
+    slot: 'Root',
+    overridesResolver: (props, styles) => styles.root
+})(({ theme }) => ({}));
+/**
+ * > API documentation for the Community-JS Composer Icon Button component. Learn about the available props and the CSS API.
+
+ #### Import
+
+ ```jsx
+ import {ComposerIconButton} from '@selfcommunity/react-ui';
+ ```
+
+ #### Component Name
+
+ The name `SComposerIconButton` can be used when providing style overrides in the theme.
+
+
+ #### CSS
+
+ |Rule Name|Global class|Description|
+ |---|---|---|
+ |root|.SComposerIconButton-root|Styles applied to the root element.|
+
+ * @param inProps
+ */
+export default function ComposerIconButton(inProps) {
+    // PROPS
+    const props = useThemeProps({
+        props: inProps,
+        name: PREFIX
+    });
+    const { className = null, ComposerProps = {} } = props, rest = __rest(props, ["className", "ComposerProps"]);
+    // STATE
+    const [open, setOpen] = useState(false);
+    // CONTEXT
+    const scUserContext = useSCUser();
+    const scContext = useSCContext();
+    const scRoutingContext = useSCRouting();
+    const { enqueueSnackbar } = useSnackbar();
+    // HANDLERS
+    const handleOpen = useCallback((event) => {
+        if (scUserContext.user) {
+            if (UserUtils.isBlocked(scUserContext.user)) {
+                enqueueSnackbar(React.createElement(FormattedMessage, { id: "ui.common.userBlocked", defaultMessage: "ui.common.userBlocked" }), {
+                    variant: 'warning',
+                    autoHideDuration: 3000
+                });
+            }
+            else {
+                setOpen(true);
+            }
+        }
+        else {
+            scContext.settings.handleAnonymousAction();
+        }
+    }, [enqueueSnackbar, scContext.settings, scUserContext.user]);
+    const handleClose = useCallback(() => {
+        setOpen(false);
+    }, []);
+    const handleSuccess = useMemo(() => (feedObject) => {
+        setOpen(false);
+        enqueueSnackbar(React.createElement(FormattedMessage, { id: "ui.composerIconButton.composer.success", defaultMessage: "ui.composerIconButton.composer.success" }), {
+            action: (snackbarId) => (React.createElement(Link, { to: scRoutingContext.url(SCRoutes[`${feedObject.type.toUpperCase()}_ROUTE_NAME`], getRouteData(feedObject)) },
+                React.createElement(FormattedMessage, { id: "ui.composerIconButton.composer.viewContribute", defaultMessage: "ui.composerIconButton.composer.viewContribute" }))),
+            variant: 'success',
+            autoHideDuration: 7000
+        });
+    }, []);
+    return (React.createElement(React.Fragment, null,
+        React.createElement(Root, Object.assign({ className: classNames(classes.root, className), onClick: handleOpen }, rest),
+            React.createElement(Icon, null, "add_circle_outline")),
+        React.createElement(Composer, Object.assign({ open: open, fullWidth: true, scroll: "body", onClose: handleClose, onSuccess: handleSuccess }, ComposerProps))));
+}

package/lib/esm/components/ComposerIconButton/index.d.ts

@@ -0,0 +1,3 @@
+import ComposerIconButton, { ComposerIconButtonProps } from './ComposerIconButton';
+export default ComposerIconButton;
+export { ComposerIconButtonProps };

package/lib/esm/components/ComposerIconButton/index.js

@@ -0,0 +1,2 @@
+import ComposerIconButton from './ComposerIconButton';
+export default ComposerIconButton;

package/lib/esm/components/ConnectionUserButton/ConnectionUserButton.d.ts

@@ -18,8 +18,10 @@ export interface ConnectionUserButtonProps {
     [p: string]: any;
 }
 /**
- > API documentation for the Community-JS Connection User Button component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Connection User Button component. Learn about the available props and the CSS API.
  *
+ *
+
  #### Import
  ```jsx
  import {ConnectionUserButton} from '@selfcommunity/react-ui';
@@ -36,4 +38,3 @@ export interface ConnectionUserButtonProps {
  * @param inProps
  */
 export default function ConnectionUserButton(inProps: ConnectionUserButtonProps): JSX.Element;
-//# sourceMappingURL=ConnectionUserButton.d.ts.map

package/lib/esm/components/ConnectionUserButton/ConnectionUserButton.js

@@ -1,14 +1,4 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
+import { __rest } from "tslib";
 import React, { useContext } from 'react';
 import { styled } from '@mui/material/styles';
 import { SCPreferences, SCPreferencesContext } from '@selfcommunity/react-core';
@@ -26,8 +16,10 @@ const Root = styled(Box, {
     overridesResolver: (props, styles) => styles.root
 })(({ theme }) => ({}));
 /**
- > API documentation for the Community-JS Connection User Button component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS Connection User Button component. Learn about the available props and the CSS API.
+ *
  *
+
  #### Import
  ```jsx
  import {ConnectionUserButton} from '@selfcommunity/react-ui';
@@ -56,4 +48,3 @@ export default function ConnectionUserButton(inProps) {
         scPreferencesContext.preferences[SCPreferences.CONFIGURATIONS_FOLLOW_ENABLED].value;
     return (React.createElement(React.Fragment, null, followEnabled ? (React.createElement(FollowUserButton, Object.assign({ user: user }, followConnectUserButtonProps, rest))) : (React.createElement(FriendshipUserButton, Object.assign({ user: user }, followConnectUserButtonProps, rest)))));
 }
-//# sourceMappingURL=ConnectionUserButton.js.map

package/lib/esm/components/ConnectionUserButton/index.d.ts

@@ -1,3 +1,2 @@
 import ConnectionUserButton from './ConnectionUserButton';
 export default ConnectionUserButton;
-//# sourceMappingURL=index.d.ts.map

package/lib/esm/components/ConnectionUserButton/index.js

@@ -1,3 +1,2 @@
 import ConnectionUserButton from './ConnectionUserButton';
 export default ConnectionUserButton;
-//# sourceMappingURL=index.js.map

package/lib/esm/components/ConsentSolution/ConsentSolution.d.ts

@@ -34,7 +34,7 @@ export declare const ACCEPT_VIEW = "accept";
 export declare const REJECTION_VIEW = "rejection";
 export declare const CONFIRM_DELETE_ACCOUNT = "delete_account";
 /**
- *> API documentation for the Community-JS ConsentSolution component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS ConsentSolution component. Learn about the available props and the CSS API.
  *
  #### Import
  ```jsx
@@ -62,11 +62,9 @@ export declare const CONFIRM_DELETE_ACCOUNT = "delete_account";
  |confirmDeleteAccountButton|.SCConsentSolution-confirm-delete-account-button|Styles applied to the confirm delete account button in the rejection section.|
  |logoutAccountButton|.SCConsentSolution-logout-account-button|Styles applied to the exit account button in the rejection section.|
  |deleteAccountButton|.SCConsentSolution-delete-account-button|Styles applied to the delete account button in the rejection section.|
- |createDataPortabilityButton|.SCConsentSolution-create-data-portability-button|Styles applied to the create data portability button in the rejection section.|
- |downloadDataPortabilityButton|.SCConsentSolution-download-data-portability-button|Styles applied to the download data portability button in the rejection section.|
+ |dataPortability|.SCConsentSolution-data-portability|Styles applied to the data portability component in the rejection section.|
  |dataPortabilityCheck|.SCConsentSolution-data-portability-check|Styles applied to the checkbox in the rejection section.|
 
  * @param inProps
  */
 export default function ConsentSolution(inProps: ConsentSolutionProps): JSX.Element;
-//# sourceMappingURL=ConsentSolution.d.ts.map

package/lib/esm/components/ConsentSolution/ConsentSolution.js

@@ -1,25 +1,13 @@
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
+import { __rest } from "tslib";
 import React, { forwardRef, useContext, useEffect, useMemo, useRef, useState } from 'react';
 import { useThemeProps } from '@mui/system';
 import { styled } from '@mui/material/styles';
-import { Alert, Checkbox, Button, FormControlLabel, Typography } from '@mui/material';
+import { Alert, Button, Checkbox, FormControlLabel, Typography } from '@mui/material';
 import classNames from 'classnames';
 import Icon from '@mui/material/Icon';
-import { LoadingButton } from '@mui/lab';
-import moment from 'moment';
-import { DataPortabilityService, LegalPageService, UserService } from '@selfcommunity/api-services';
+import { LegalPageService, UserService } from '@selfcommunity/api-services';
 import { arraysEqual, capitalize, Logger } from '@selfcommunity/utils';
-import { useSCPreferences, SCUserContext, SCPreferences } from '@selfcommunity/react-core';
+import { SCPreferences, SCUserContext, useSCPreferences } from '@selfcommunity/react-core';
 import ConsentSolutionSwitch from '../../shared/ConsentSolutionSwitch';
 import { SCOPE_SC_UI } from '../../constants/Errors';
 import Dialog from '@mui/material/Dialog';
@@ -30,8 +18,9 @@ import Slide from '@mui/material/Slide';
 import { LEGAL_POLICIES } from './../../constants/LegalPolicies';
 import ConsentSolutionSkeleton from './Skeleton';
 import { getDocumentBody, isDocumentApproved, isEmptyDocumentBody } from '../../utils/legalPages';
-import { FormattedMessage, FormattedDate, FormattedTime, defineMessages, useIntl } from 'react-intl';
+import { defineMessages, FormattedMessage, useIntl } from 'react-intl';
 import { elementScrollTo } from 'seamless-scroll-polyfill';
+import AccountDataPortability from '../AccountDataPortability';
 const PREFIX = 'SCConsentSolution';
 const classes = {
     root: `${PREFIX}-root`,
@@ -47,8 +36,7 @@ const classes = {
     confirmDeleteAccountButton: `${PREFIX}-confirm-delete-account-button`,
     logoutAccountButton: `${PREFIX}-logout-account-button`,
     deleteAccountButton: `${PREFIX}-delete-account-button`,
-    createDataPortabilityButton: `${PREFIX}-create-data-portability-button`,
-    downloadDataPortabilityButton: `${PREFIX}-download-data-portability-button`,
+    dataPortability: `${PREFIX}-data-portability`,
     dataPortabilityCheck: `${PREFIX}-download-data-portability-check`,
     alertAcceptDocument: `${PREFIX}-alert-accept-document`,
     acceptConditions: `${PREFIX}-accept-conditions`
@@ -123,12 +111,8 @@ const Root = styled(Dialog, {
     [`& .${classes.logoutAccountButton}`]: {
         marginBottom: theme.spacing()
     },
-    [`& .${classes.createDataPortabilityButton}`]: {
-        marginRight: theme.spacing(2),
-        marginBottom: theme.spacing()
-    },
-    [`& .${classes.downloadDataPortabilityButton}`]: {
-        marginBottom: theme.spacing()
+    [`& .${classes.dataPortability}`]: {
+        marginBottom: theme.spacing(2)
     },
     [`& .${classes.alertAcceptDocument}`]: {
         padding: theme.spacing(),
@@ -151,22 +135,10 @@ const Root = styled(Dialog, {
  * Translations
  */
 const messages = defineMessages({
-    createDpSectionInfo: {
-        id: 'ui.consentSolution.createDpSectionInfo',
-        defaultMessage: 'ui.consentSolution.createDpSectionInfo'
-    },
     deleteAccountDpSectionInfo: {
         id: 'ui.consentSolution.deleteAccountDpSectionInfo',
         defaultMessage: 'ui.consentSolution.deleteAccountDpSectionInfo'
     },
-    createDpSectionTitle: {
-        id: 'ui.consentSolution.createDpSectionTitle',
-        defaultMessage: 'ui.consentSolution.createDpSectionTitle'
-    },
-    createDpSectionGeneratedAt: {
-        id: 'ui.consentSolution.createDpSectionGeneratedAt',
-        defaultMessage: 'ui.consentSolution.createDpSectionGeneratedAt'
-    },
     deleteAccountDpSectionTitle: {
         id: 'ui.consentSolution.deleteAccountDpSectionTitle',
         defaultMessage: 'ui.consentSolution.deleteAccountDpSectionTitle'
@@ -185,7 +157,7 @@ export const ACCEPT_VIEW = 'accept';
 export const REJECTION_VIEW = 'rejection';
 export const CONFIRM_DELETE_ACCOUNT = 'delete_account';
 /**
- *> API documentation for the Community-JS ConsentSolution component. Learn about the available props and the CSS API.
+ * > API documentation for the Community-JS ConsentSolution component. Learn about the available props and the CSS API.
  *
  #### Import
  ```jsx
@@ -213,8 +185,7 @@ export const CONFIRM_DELETE_ACCOUNT = 'delete_account';
  |confirmDeleteAccountButton|.SCConsentSolution-confirm-delete-account-button|Styles applied to the confirm delete account button in the rejection section.|
  |logoutAccountButton|.SCConsentSolution-logout-account-button|Styles applied to the exit account button in the rejection section.|
  |deleteAccountButton|.SCConsentSolution-delete-account-button|Styles applied to the delete account button in the rejection section.|
- |createDataPortabilityButton|.SCConsentSolution-create-data-portability-button|Styles applied to the create data portability button in the rejection section.|
- |downloadDataPortabilityButton|.SCConsentSolution-download-data-portability-button|Styles applied to the download data portability button in the rejection section.|
+ |dataPortability|.SCConsentSolution-data-portability|Styles applied to the data portability component in the rejection section.|
  |dataPortabilityCheck|.SCConsentSolution-data-portability-check|Styles applied to the checkbox in the rejection section.|
 
  * @param inProps
@@ -245,8 +216,6 @@ export default function ConsentSolution(inProps) {
     const [rejected, setRejected] = useState(false);
     const [dataPortability, setDataPortability] = useState(null);
     const [dataPortabilityChecked, setDataPortabilityChecked] = useState(false);
-    const [loadingDataPortability, setLoadingDataPortability] = useState(false);
-    const [downloadingDataPortability, setDownloadingDataPortability] = useState(false);
     const [loadingDeleteAccount, setLoadingDeleteAccount] = useState(false);
     // CONST
     const authUserId = scUserContext.user ? scUserContext.user.id : null;
@@ -301,43 +270,6 @@ export default function ConsentSolution(inProps) {
             Logger.error(SCOPE_SC_UI, _error);
         });
     };
-    /**
-     * Handle create data portability
-     */
-    const handleCreateDataPortabilityFile = () => {
-        setLoadingDataPortability(true);
-        DataPortabilityService.generateDataPortability()
-            .then((res) => {
-            if (res) {
-                setDataPortability(dataPortability);
-            }
-        })
-            .catch((_error) => {
-            Logger.error(SCOPE_SC_UI, _error);
-        });
-    };
-    /**
-     * Handle download data portability
-     */
-    const handleDownloadDataPortabilityFile = () => {
-        setDownloadingDataPortability(true);
-        DataPortabilityService.downloadDataPortability()
-            .then((res) => {
-            const url = window.URL.createObjectURL(new Blob([res], { type: 'application/zip' }));
-            const link = document.createElement('a');
-            link.href = url;
-            link.setAttribute('download', `${scUserContext.user.username}_${intl.formatDate(moment().format(), { year: 'numeric', month: 'numeric', day: 'numeric' })}.zip`);
-            document.body.appendChild(link);
-            link.click();
-            document.body.removeChild(link);
-            URL.revokeObjectURL(url);
-            setDownloadingDataPortability(false);
-        })
-            .catch((_error) => {
-            setDownloadingDataPortability(false);
-            Logger.error(SCOPE_SC_UI, _error);
-        });
-    };
     /**
      * Handle confirm delete account
      */
@@ -368,7 +300,8 @@ export default function ConsentSolution(inProps) {
         setLoading(true);
         return LegalPageService.getAllLastRevisionsOfLegalPages()
             .then((documents) => {
-            let docs = documents.filter((lp) => legalPolicies.filter((p) => lp.name_and_version.startsWith(p)).length > 0);
+            // filter documents (show only privacy and tec)
+            let docs = documents.filter((lp) => legalPolicies.filter((p) => lp.slug.startsWith(p)).length > 0);
             // if initial legalPolicies !== LEGAL_POLICIES
             if (arraysEqual(legalPolicies, LEGAL_POLICIES)) {
                 docs = docs.filter((d) => !isEmptyDocumentBody(d) && !isDocumentApproved(d));
@@ -385,23 +318,6 @@ export default function ConsentSolution(inProps) {
             Logger.error(SCOPE_SC_UI, _error);
         });
     };
-    /**
-     * Fetch data portability status
-     */
-    const fetchDataPortabilityStatus = () => {
-        DataPortabilityService.dataPortabilityStatus()
-            .then((res) => {
-            if (res) {
-                if (!res.computing && res.generated_at) {
-                    setLoadingDataPortability(false);
-                }
-                setDataPortability(res);
-            }
-        })
-            .catch((_error) => {
-            Logger.error(SCOPE_SC_UI, _error);
-        });
-    };
     /**
      * On mount, fetches legal and custom documents
      */
@@ -411,21 +327,6 @@ export default function ConsentSolution(inProps) {
         }
         fetchLegalPages();
     }, [authUserId]);
-    /**
-     * Sync data portability status
-     */
-    useEffect(() => {
-        let interval;
-        if (authUserId !== null && ready) {
-            fetchDataPortabilityStatus();
-            if (_view === REJECTION_VIEW) {
-                interval = setInterval(() => {
-                    fetchDataPortabilityStatus();
-                }, 5000);
-            }
-        }
-        return () => interval && clearInterval(interval);
-    }, [authUserId, ready, _view]);
     /**
      * Render main view
      */
@@ -433,10 +334,10 @@ export default function ConsentSolution(inProps) {
         if (!doc) {
             return null;
         }
-        const isAccept = Boolean(doc.ack !== null && doc.ack.accepted_at);
+        const isAccept = Boolean(doc.ack && doc.ack.accepted_at);
         return (React.createElement(React.Fragment, null,
             React.createElement(DialogTitle, { className: classes.title },
-                React.createElement(FormattedMessage, { id: "ui.consentSolution.acceptDocumentTitle", defaultMessage: "ui.consentSolution.acceptDocumentTitle", values: { label: doc.label } })),
+                React.createElement(FormattedMessage, { id: "ui.consentSolution.acceptDocumentTitle", defaultMessage: "ui.consentSolution.acceptDocumentTitle", values: { label: doc.title } })),
             React.createElement(DialogContent, { className: classes.content, dividers: true, ref: contentDialog },
                 React.createElement(Typography, { component: "div", gutterBottom: true, dangerouslySetInnerHTML: {
                         __html: getDocumentBody(doc)
@@ -471,24 +372,7 @@ export default function ConsentSolution(inProps) {
                 React.createElement(Button, { size: "small", variant: 'outlined', onClick: () => setView(ACCEPT_VIEW), className: classes.backButton, startIcon: React.createElement(Icon, null, "arrow_back") },
                     React.createElement(FormattedMessage, { id: "ui.consentSolution.backButton", defaultMessage: "ui.consentSolution.backButton" }))),
             React.createElement(DialogContent, { className: classes.content, dividers: true },
-                React.createElement(Typography, { variant: "h6" },
-                    React.createElement(FormattedMessage, { id: "ui.consentSolution.createDpSectionTitle", defaultMessage: "ui.consentSolution.createDpSectionTitle", values: { username: capitalize(scUserContext.user.username) } })),
-                React.createElement("br", null),
-                React.createElement(Typography, { variant: "body2" },
-                    React.createElement(FormattedMessage, { id: "ui.consentSolution.deleteAccountTitle", defaultMessage: "ui.consentSolution.deleteAccountTitle" })),
-                React.createElement("ul", null, intl.formatMessage(messages.createDpSectionInfo, {
-                    li: (chunks) => React.createElement("li", null, chunks)
-                })),
-                React.createElement(LoadingButton, { size: "small", loading: (dataPortability && dataPortability.computing) || loadingDataPortability, disabled: dataPortability && (dataPortability.computing || moment().diff(moment(dataPortability.requested_at), 'hours') < 24), loadingPosition: "start", startIcon: React.createElement(Icon, null, "copy_all_outlined"), variant: "outlined", className: classes.createDataPortabilityButton, onClick: handleCreateDataPortabilityFile }, (dataPortability && dataPortability.computing) || loadingDataPortability ? (React.createElement(FormattedMessage, { id: "ui.consentSolution.createFileLoadingButton", defaultMessage: "ui.consentSolution.createFileLoadingButton" })) : (React.createElement(FormattedMessage, { id: "ui.consentSolution.createFileButton", defaultMessage: "ui.consentSolution.createFileButton" }))),
-                dataPortability && !dataPortability.computing && dataPortability.generated_at && (React.createElement(LoadingButton, { size: "small", loading: downloadingDataPortability, loadingPosition: "start", startIcon: React.createElement(Icon, null, "cloud_download_outlined"), variant: 'outlined', className: classes.downloadDataPortabilityButton, onClick: handleDownloadDataPortabilityFile },
-                    React.createElement(FormattedMessage, { id: "ui.consentSolution.downloadFileButton", defaultMessage: "ui.consentSolution.downloadFileButton" }))),
-                React.createElement("br", null),
-                dataPortability && !dataPortability.computing && dataPortability.generated_at && (React.createElement(Typography, { variant: "body2" },
-                    React.createElement("b", null, intl.formatMessage(messages.createDpSectionGeneratedAt, {
-                        date: React.createElement(FormattedDate, { value: dataPortability.requested_at, day: "numeric", month: "long", year: "numeric" }),
-                        time: React.createElement(FormattedTime, { value: dataPortability.requested_at })
-                    })))),
-                React.createElement("br", null),
+                React.createElement(AccountDataPortability, { className: classes.dataPortability }),
                 React.createElement(Typography, { variant: "h6" },
                     React.createElement(FormattedMessage, { id: "ui.consentSolution.deleteAccountDpSectionTitle", defaultMessage: "ui.consentSolution.deleteAccountDpSectionTitle", values: { username: capitalize(scUserContext.user.username) } })),
                 React.createElement("ul", null, intl.formatMessage(messages.deleteAccountDpSectionInfo, { communityName, li: (chunks) => React.createElement("li", null, chunks) })),
@@ -496,7 +380,7 @@ export default function ConsentSolution(inProps) {
                 React.createElement("br", null),
                 React.createElement(Button, { size: "small", startIcon: React.createElement(Icon, null, "delete_outlined"), disabled: !dataPortabilityChecked, variant: 'contained', className: classes.confirmDeleteAccountButton, onClick: () => setView(CONFIRM_DELETE_ACCOUNT) },
                     React.createElement(FormattedMessage, { id: "ui.consentSolution.confirmDeleteAccountButton", defaultMessage: "ui.consentSolution.confirmDeleteAccountButton" })),
-                React.createElement(Button, { size: "small", variant: 'outlined', className: classes.logoutAccountButton, startIcon: React.createElement(Icon, null, "door_back_outlined"), onClick: handleLogout },
+                React.createElement(Button, { size: "small", variant: 'outlined', className: classes.logoutAccountButton, startIcon: React.createElement(Icon, null, "upload"), onClick: handleLogout },
                     React.createElement(FormattedMessage, { id: "ui.consentSolution.logoutImmediatelyButton", defaultMessage: "ui.consentSolution.logoutImmediatelyButton" })))));
     };
     /**
@@ -555,4 +439,3 @@ export default function ConsentSolution(inProps) {
      */
     return (React.createElement(React.Fragment, null, open && (React.createElement(Root, Object.assign({ "aria-describedby": "consent--solution-dialog", className: classNames(classes.root, className), TransitionComponent: DialogTransition, maxWidth: 'md', fullWidth: true, open: ready, disableEscapeKeyDown: true, onClose: handleClose, scroll: 'paper' }, rest), content()))));
 }
-//# sourceMappingURL=ConsentSolution.js.map

package/lib/esm/components/ConsentSolution/Skeleton.d.ts

@@ -24,4 +24,3 @@
  *
  */
 export default function ConsentSolutionSkeleton(): JSX.Element;
-//# sourceMappingURL=Skeleton.d.ts.map

package/lib/esm/components/ConsentSolution/Skeleton.js

@@ -83,4 +83,3 @@ export default function ConsentSolutionSkeleton() {
         React.createElement(DialogActions, { className: classes.actions },
             React.createElement(Skeleton, { animation: "wave", height: 40, width: "20%" }))));
 }
-//# sourceMappingURL=Skeleton.js.map

package/lib/esm/components/ConsentSolution/index.d.ts

@@ -2,4 +2,3 @@ import ConsentSolution, { ConsentSolutionProps } from './ConsentSolution';
 import ConsentSolutionSkeleton from './Skeleton';
 export default ConsentSolution;
 export { ConsentSolutionProps, ConsentSolutionSkeleton };
-//# sourceMappingURL=index.d.ts.map

package/lib/esm/components/ConsentSolution/index.js

@@ -2,4 +2,3 @@ import ConsentSolution from './ConsentSolution';
 import ConsentSolutionSkeleton from './Skeleton';
 export default ConsentSolution;
 export { ConsentSolutionSkeleton };
-//# sourceMappingURL=index.js.map