@stack-spot/portal-components 2.11.0 → 2.12.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +16 -0
- package/dist/components/BannerWarning.d.ts.map +1 -1
- package/dist/components/BannerWarning.js +16 -28
- package/dist/components/BannerWarning.js.map +1 -1
- package/dist/components/notification/NotificationComponent.d.ts.map +1 -1
- package/dist/components/notification/NotificationComponent.js.map +1 -1
- package/dist/components/notification/NotificationItem.d.ts +5 -0
- package/dist/components/notification/NotificationItem.d.ts.map +1 -1
- package/dist/components/notification/NotificationItem.js +29 -4
- package/dist/components/notification/NotificationItem.js.map +1 -1
- package/dist/components/notification/NotificationList.d.ts +5 -1
- package/dist/components/notification/NotificationList.d.ts.map +1 -1
- package/dist/components/notification/NotificationList.js +2 -2
- package/dist/components/notification/NotificationList.js.map +1 -1
- package/dist/context/notification/types.d.ts +4 -0
- package/dist/context/notification/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/components/BannerWarning.tsx +19 -35
- package/src/components/notification/NotificationComponent.tsx +7 -4
- package/src/components/notification/NotificationItem.tsx +63 -17
- package/src/components/notification/NotificationList.tsx +8 -1
- package/src/context/notification/types.ts +4 -0
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,21 @@
|
|
|
1
1
|
# Changelog
|
|
2
2
|
|
|
3
|
+
## [2.12.0](https://github.com/stack-spot/portal-commons/compare/portal-components@v2.11.1...portal-components@v2.12.0) (2025-01-15)
|
|
4
|
+
|
|
5
|
+
|
|
6
|
+
### Features
|
|
7
|
+
|
|
8
|
+
* add new notification button read more ([2201cd1](https://github.com/stack-spot/portal-commons/commit/2201cd119b477ddf875c5c269061d7d7b86f9535))
|
|
9
|
+
|
|
10
|
+
## [2.11.1](https://github.com/stack-spot/portal-commons/compare/portal-components@v2.11.0...portal-components@v2.11.1) (2025-01-03)
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
### Bug Fixes
|
|
14
|
+
|
|
15
|
+
* banner style adjustments" ([c2263b4](https://github.com/stack-spot/portal-commons/commit/c2263b4c3befacdedb592afba688d8f31d48c524))
|
|
16
|
+
* Code Cleanup & adjustments ([2d0b4a8](https://github.com/stack-spot/portal-commons/commit/2d0b4a80c2eb9ddad7b91fabb4e5e39707f26239))
|
|
17
|
+
* lyout update libs banner ([#631](https://github.com/stack-spot/portal-commons/issues/631)) ([6d4ee46](https://github.com/stack-spot/portal-commons/commit/6d4ee46878395607d8cbf80d58c38a22681ece74))
|
|
18
|
+
|
|
3
19
|
## [2.11.0](https://github.com/stack-spot/portal-commons/compare/portal-components@v2.10.4...portal-components@v2.11.0) (2024-12-27)
|
|
4
20
|
|
|
5
21
|
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerWarning.d.ts","sourceRoot":"","sources":["../../src/components/BannerWarning.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"BannerWarning.d.ts","sourceRoot":"","sources":["../../src/components/BannerWarning.tsx"],"names":[],"mappings":"AAOA;;;;;GAKG;AACH,eAAO,MAAM,aAAa,iBAAkB;IAAE,QAAQ,EAAE,MAAM,SAAS,CAAA;CAAE,mDA2ExE,CAAA"}
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
|
-
/* eslint-disable comma-dangle */
|
|
3
2
|
import { Button, Flex, IconBox, Text } from '@citric/core';
|
|
4
3
|
import { ExclamationTriangle, TimesCircleFill } from '@citric/icons';
|
|
5
4
|
import { Alert } from '@citric/ui';
|
|
6
5
|
import { useState } from 'react';
|
|
6
|
+
import { getCookie, setCookie } from '../utils/cookie.js';
|
|
7
7
|
/**
|
|
8
8
|
* A styled and dismissible alert box for showing important warnings for the user.
|
|
9
9
|
*
|
|
@@ -12,18 +12,10 @@ import { useState } from 'react';
|
|
|
12
12
|
*/
|
|
13
13
|
export const BannerWarning = ({ children }) => {
|
|
14
14
|
const bannerKey = 'bannerClosed';
|
|
15
|
-
const getCookie = (key) => document.cookie
|
|
16
|
-
.split('; ')
|
|
17
|
-
.find((row) => row.startsWith(`${key}=`))
|
|
18
|
-
?.split('=')[1];
|
|
19
|
-
const setCookie = (key, value, domain = '.stackspot.com') => {
|
|
20
|
-
document.cookie = `${key}=${value};path=/${location.host.endsWith(domain) ? `;domain=${domain}` : ''}`;
|
|
21
|
-
};
|
|
22
15
|
const [isVisible, setIsVisible] = useState(() => {
|
|
23
16
|
if (typeof window !== 'undefined') {
|
|
24
|
-
const isBannerValid = getCookie(bannerKey) !== 'expired';
|
|
25
17
|
const isBannerClosed = getCookie(bannerKey) === 'true';
|
|
26
|
-
return
|
|
18
|
+
return !isBannerClosed;
|
|
27
19
|
}
|
|
28
20
|
return false;
|
|
29
21
|
});
|
|
@@ -34,26 +26,22 @@ export const BannerWarning = ({ children }) => {
|
|
|
34
26
|
if (!isVisible) {
|
|
35
27
|
return null;
|
|
36
28
|
}
|
|
37
|
-
return (_jsx(Flex, {
|
|
38
|
-
height: '48px',
|
|
29
|
+
return (_jsx(Flex, { sx: { zIndex: '1', w: '12', mb: 7 }, children: _jsxs(Alert, { colorScheme: "warning", sx: {
|
|
39
30
|
position: 'relative',
|
|
40
31
|
px: 3,
|
|
41
|
-
py: 1
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
32
|
+
py: 1,
|
|
33
|
+
alignItems: 'center',
|
|
34
|
+
display: 'flex',
|
|
35
|
+
justifyContent: 'space-between',
|
|
36
|
+
height: 'auto',
|
|
37
|
+
}, children: [_jsxs(Flex, { sx: {
|
|
38
|
+
alignItems: 'center',
|
|
39
|
+
flexWrap: 'nowrap',
|
|
40
|
+
}, children: [_jsx(IconBox, { size: "sm", colorIcon: "light.500", children: _jsx(ExclamationTriangle, {}) }), _jsx(Text, { sx: {
|
|
41
|
+
ml: 5,
|
|
48
42
|
}, appearance: "body2", colorScheme: "warning.contrastText", children: children })] }), _jsx(Button, { appearance: 'text', onClick: handleClose, sx: {
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
boxShadow: 'none'
|
|
53
|
-
},
|
|
54
|
-
ml: 2
|
|
55
|
-
}, children: _jsx(IconBox, { size: "lg", colorIcon: "light.500", sx: {
|
|
56
|
-
display: ['flex', 'flex']
|
|
57
|
-
}, children: _jsx(TimesCircleFill, {}) }) })] }) }));
|
|
43
|
+
p: 0,
|
|
44
|
+
ml: 2,
|
|
45
|
+
}, children: _jsx(IconBox, { size: "lg", colorIcon: "light.500", children: _jsx(TimesCircleFill, {}) }) })] }) }));
|
|
58
46
|
};
|
|
59
47
|
//# sourceMappingURL=BannerWarning.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BannerWarning.js","sourceRoot":"","sources":["../../src/components/BannerWarning.tsx"],"names":[],"mappings":";
|
|
1
|
+
{"version":3,"file":"BannerWarning.js","sourceRoot":"","sources":["../../src/components/BannerWarning.tsx"],"names":[],"mappings":";AACA,OAAO,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AAC1D,OAAO,EAAE,mBAAmB,EAAE,eAAe,EAAE,MAAM,eAAe,CAAA;AACpE,OAAO,EAAE,KAAK,EAAE,MAAM,YAAY,CAAA;AAClC,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAChC,OAAO,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAA;AAEtD;;;;;GAKG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,EAAE,QAAQ,EAAiC,EAAE,EAAE;IAC3E,MAAM,SAAS,GAAG,cAAc,CAAA;IAEhC,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,QAAQ,CAAC,GAAG,EAAE;QAC9C,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE,CAAC;YAClC,MAAM,cAAc,GAAG,SAAS,CAAC,SAAS,CAAC,KAAK,MAAM,CAAA;YACtD,OAAO,CAAC,cAAc,CAAA;QACxB,CAAC;QACD,OAAO,KAAK,CAAA;IACd,CAAC,CAAC,CAAA;IAEF,MAAM,WAAW,GAAG,GAAG,EAAE;QACvB,SAAS,CAAC,SAAS,EAAE,MAAM,CAAC,CAAA;QAC5B,YAAY,CAAC,KAAK,CAAC,CAAA;IACrB,CAAC,CAAA;IAED,IAAI,CAAC,SAAS,EAAE,CAAC;QACf,OAAO,IAAI,CAAA;IACb,CAAC;IAED,OAAO,CACL,KAAC,IAAI,IAAC,EAAE,EAAE,EAAE,MAAM,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,EAAE,YACvC,MAAC,KAAK,IACJ,WAAW,EAAC,SAAS,EACrB,EAAE,EAAE;gBACF,QAAQ,EAAE,UAAU;gBACpB,EAAE,EAAE,CAAC;gBACL,EAAE,EAAE,CAAC;gBACL,UAAU,EAAE,QAAQ;gBACpB,OAAO,EAAE,MAAM;gBACf,cAAc,EAAE,eAAe;gBAC/B,MAAM,EAAE,MAAM;aACf,aAED,MAAC,IAAI,IACH,EAAE,EAAE;wBACF,UAAU,EAAE,QAAQ;wBACpB,QAAQ,EAAE,QAAQ;qBACnB,aAED,KAAC,OAAO,IACN,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,WAAW,YAErB,KAAC,mBAAmB,KAAG,GACf,EACV,KAAC,IAAI,IACH,EAAE,EAAE;gCACF,EAAE,EAAC,CAAC;6BACL,EACD,UAAU,EAAC,OAAO,EAClB,WAAW,EAAC,sBAAsB,YAEjC,QAAQ,GACJ,IACF,EAEP,KAAC,MAAM,IACL,UAAU,EAAE,MAAM,EAClB,OAAO,EAAE,WAAW,EACpB,EAAE,EAAE;wBACF,CAAC,EAAE,CAAC;wBACJ,EAAE,EAAE,CAAC;qBACN,YAED,KAAC,OAAO,IACN,IAAI,EAAC,IAAI,EACT,SAAS,EAAC,WAAW,YAErB,KAAC,eAAe,KAAG,GACX,GACH,IACH,GACH,CACR,CAAA;AACH,CAAC,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationComponent.d.ts","sourceRoot":"","sources":["../../../src/components/notification/NotificationComponent.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAqC,MAAM,OAAO,CAAA;AAEvE,OAAO,EAAgB,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAK1D,OAAO,EAAE,8BAA8B,EAAE,uBAAuB,EAAc,MAAM,SAAS,CAAA;AAE7F,UAAU,KAAK;IACb,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAyID,UAAU,KAAK;IACb,kBAAkB,EAAE,CAAC,cAAc,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,KAAK,IAAI,CAAC;IACnG,aAAa,CAAC,EAAE,8BAA8B,EAAE,CAAC;IACjD,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,EAAE,UAAU,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,uBAAuB,CAAC;IAC/B,YAAY,EAAE,CAAC,WAAW,CAAC,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAC9D,oBAAoB,EAAE,YAAY,CAAC;IACnC,SAAS,EAAE,OAAO,CAAC;CACpB;AAGD;;;;;;GAMG;AACH,eAAO,MAAM,qBAAqB,6NAK/B,KAAK,
|
|
1
|
+
{"version":3,"file":"NotificationComponent.d.ts","sourceRoot":"","sources":["../../../src/components/notification/NotificationComponent.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAqC,MAAM,OAAO,CAAA;AAEvE,OAAO,EAAgB,UAAU,EAAE,MAAM,iBAAiB,CAAA;AAK1D,OAAO,EAAE,8BAA8B,EAAE,uBAAuB,EAAc,MAAM,SAAS,CAAA;AAE7F,UAAU,KAAK;IACb,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC;AAyID,UAAU,KAAK;IACb,kBAAkB,EAAE,CAAC,cAAc,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,KAAK,IAAI,CAAC;IACnG,aAAa,CAAC,EAAE,8BAA8B,EAAE,CAAC;IACjD,SAAS,EAAE,OAAO,CAAC;IACnB,KAAK,CAAC,EAAE,GAAG,CAAC;IACZ,wBAAwB,EAAE,MAAM,IAAI,CAAC;IACrC,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B,YAAY,EAAE,UAAU,CAAC;IACzB,aAAa,EAAE,MAAM,IAAI,CAAC;IAC1B,WAAW,EAAE,OAAO,CAAC;IACrB,IAAI,CAAC,EAAE,uBAAuB,CAAC;IAC/B,YAAY,EAAE,CAAC,WAAW,CAAC,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAC9D,oBAAoB,EAAE,YAAY,CAAC;IACnC,SAAS,EAAE,OAAO,CAAC;CACpB;AAGD;;;;;;GAMG;AACH,eAAO,MAAM,qBAAqB,6NAK/B,KAAK,4CAwHP,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationComponent.js","sourceRoot":"","sources":["../../../src/components/notification/NotificationComponent.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"NotificationComponent.js","sourceRoot":"","sources":["../../../src/components/notification/NotificationComponent.tsx"],"names":[],"mappings":"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"}
|
|
@@ -3,6 +3,7 @@ interface Props {
|
|
|
3
3
|
notification: GetTenantNotificationsResponse;
|
|
4
4
|
isSummary: boolean;
|
|
5
5
|
id?: string;
|
|
6
|
+
onClickViewNotification?: () => void;
|
|
6
7
|
}
|
|
7
8
|
interface DeprecatedNotificationItemProps extends Props {
|
|
8
9
|
/**
|
|
@@ -30,6 +31,10 @@ interface NewNotificationItemProps extends Props {
|
|
|
30
31
|
* If you need additional behavior, use this parameter, which is a function to call whenever the button is clicked.
|
|
31
32
|
*/
|
|
32
33
|
onClickAction?: () => void;
|
|
34
|
+
/**
|
|
35
|
+
* Function to call when the user clicks in read more button.
|
|
36
|
+
*/
|
|
37
|
+
onClickViewNotification?: () => void;
|
|
33
38
|
}
|
|
34
39
|
type NotificationItemProps = DeprecatedNotificationItemProps | NewNotificationItemProps;
|
|
35
40
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationItem.d.ts","sourceRoot":"","sources":["../../../src/components/notification/NotificationItem.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,8BAA8B,EAAE,MAAM,SAAS,CAAA;AAexD,UAAU,KAAK;IACb,YAAY,EAAE,8BAA8B,CAAC;IAC7C,SAAS,EAAE,OAAO,CAAC;IAEnB,EAAE,CAAC,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"NotificationItem.d.ts","sourceRoot":"","sources":["../../../src/components/notification/NotificationItem.tsx"],"names":[],"mappings":"AASA,OAAO,EAAE,8BAA8B,EAAE,MAAM,SAAS,CAAA;AAexD,UAAU,KAAK;IACb,YAAY,EAAE,8BAA8B,CAAC;IAC7C,SAAS,EAAE,OAAO,CAAC;IAEnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;CACtC;AAwKD,UAAU,+BAAgC,SAAQ,KAAK;IACrD;;;;;;;;;;OAUG;IACH,qBAAqB,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,IAAI,EAAE,cAAc,GAAG,MAAM,KAAK,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CAC/F;AAED,UAAU,wBAAyB,SAAQ,KAAK;IAC9C;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;OAKG;IACH,aAAa,CAAC,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;CACtC;AAED,KAAK,qBAAqB,GAAG,+BAA+B,GAAG,wBAAwB,CAAA;AAEvF;;;;GAIG;AACH,eAAO,MAAM,gBAAgB,0CAA2C,qBAAqB,4CA4C5F,CAAA"}
|
|
@@ -25,13 +25,22 @@ const style = {
|
|
|
25
25
|
top: '25%',
|
|
26
26
|
},
|
|
27
27
|
},
|
|
28
|
+
notificationDescription: {
|
|
29
|
+
display: '-webkit-box',
|
|
30
|
+
WebkitBoxOrient: 'vertical',
|
|
31
|
+
overflow: 'hidden',
|
|
32
|
+
WebkitLineClamp: '2',
|
|
33
|
+
lineHeight: '1.5',
|
|
34
|
+
maxHeight: '3em',
|
|
35
|
+
maxWidth: '340px',
|
|
36
|
+
},
|
|
28
37
|
};
|
|
29
38
|
/**
|
|
30
39
|
* NotificationHeader component that renders the header of a notification.
|
|
31
40
|
*
|
|
32
41
|
* @param props the component's props.
|
|
33
42
|
*/
|
|
34
|
-
const NotificationHeader = ({ title, isSummary }) => (_jsx(Flex, { justifyContent: "space-between", mb: 2, sx: { maxWidth: isSummary ? '330px' : '100%' }, flexWrap: "nowrap", children: _jsx(Text, { appearance: isSummary ? 'body2' : 'body1', nowrapEllipsis: true, children: title }) }));
|
|
43
|
+
const NotificationHeader = ({ title, isSummary }) => (_jsx(Flex, { justifyContent: "space-between", mb: 2, sx: { maxWidth: isSummary ? '330px' : '100%' }, flexWrap: "nowrap", children: _jsx(Text, { appearance: isSummary ? 'body2' : 'body1', weight: "medium", nowrapEllipsis: true, children: title }) }));
|
|
35
44
|
/**
|
|
36
45
|
* Get the number of days ago from the given date string.
|
|
37
46
|
*
|
|
@@ -48,15 +57,29 @@ const getDaysAgo = (dateString) => {
|
|
|
48
57
|
*
|
|
49
58
|
* @param props the component's props {@link Props}.
|
|
50
59
|
*/
|
|
51
|
-
const NotificationContent = ({ notification, isSummary }) => {
|
|
60
|
+
const NotificationContent = ({ notification, isSummary, onClickViewNotification }) => {
|
|
52
61
|
const { formatDate } = useDateFormatter();
|
|
62
|
+
const Link = useAnchorTag();
|
|
53
63
|
const t = useTranslate(dictionary);
|
|
54
64
|
const { description } = useGetNotificationTitleAndDescription(notification);
|
|
55
65
|
const daysAgo = getDaysAgo(notification.trigger_at);
|
|
56
66
|
const components = () => ({
|
|
57
67
|
ul: (props) => _jsx(Text, { as: "ul", appearance: "body2", colorScheme: "light.700", sx: { listStyleType: 'disc', marginLeft: '1rem' }, ...props }),
|
|
58
68
|
});
|
|
59
|
-
|
|
69
|
+
const navigateToNotificationPosition = (ev, anchorText) => {
|
|
70
|
+
ev.preventDefault();
|
|
71
|
+
const checkElement = setInterval(() => {
|
|
72
|
+
const target = document.getElementById(anchorText);
|
|
73
|
+
if (target) {
|
|
74
|
+
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
|
75
|
+
clearInterval(checkElement);
|
|
76
|
+
}
|
|
77
|
+
}, 100);
|
|
78
|
+
};
|
|
79
|
+
return (_jsxs(_Fragment, { children: [!isSummary && _jsx(Flex, { mt: 4, mb: 3, flexDirection: "column", children: _jsx(LazyMarkdown, { components: components(), children: description }) }), isSummary && (_jsx(Text, { appearance: "body2", mb: 3, sx: style.notificationDescription, children: description })), _jsxs(Flex, { justifyContent: "space-between", children: [_jsxs(Flex, { children: [_jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: t[notification.context] }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", mx: "2", children: "\u2022" }), !isSummary && _jsxs(_Fragment, { children: [_jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: formatDate(notification.trigger_at) }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", mx: "2", children: "\u2022" })] }), _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: daysAgo > 0 ? daysAgo + ' ' + t.daysAgo : t.today })] }), isSummary && description.length > 120 && (_jsx(Link, { href: "/notifications", onClick: (ev) => {
|
|
80
|
+
onClickViewNotification?.();
|
|
81
|
+
navigateToNotificationPosition(ev, `notification-item-${notification.id}`);
|
|
82
|
+
}, children: _jsx(Text, { appearance: "microtext1", colorScheme: "light.700", children: t.readMore }) }))] })] }));
|
|
60
83
|
};
|
|
61
84
|
/**
|
|
62
85
|
* NotificationFooter component that renders the footer of a notification.
|
|
@@ -91,7 +114,7 @@ export const NotificationItem = ({ notification, isSummary, ...props }) => {
|
|
|
91
114
|
else
|
|
92
115
|
props.onClickMarkReadUnread(true, 'callToAction');
|
|
93
116
|
}
|
|
94
|
-
return (_jsxs(Box, { sx: { position: 'relative' }, children: [_jsxs(Flex, { bg: "light.400", p: "3 3 3 5", r: "xs", flexDirection: "column", w: "100%", sx: styles.item(statusToColor[notification.criticality], notification.committed), children: [_jsx(NotificationHeader, { title: title, isSummary: isSummary }), _jsx(NotificationContent, { notification: notification, isSummary: isSummary }), notification.call_to_action && _jsx(NotificationFooter, { actionURL: notification.call_to_action, onClickAction: clickAction, title: title })] }), _jsx(Box, { sx: { position: 'absolute', top: '8px', right: '8px' }, children: _jsx(Tooltip, { text: notification.committed ? t.committed : t.uncommitted, position: "left", sx: style.tooltip, children: notification.committed
|
|
117
|
+
return (_jsxs(Box, { sx: { position: 'relative' }, id: props.id, children: [_jsxs(Flex, { bg: "light.400", p: "3 3 3 5", r: "xs", flexWrap: "nowrap", flexDirection: "column", w: "100%", sx: styles.item(statusToColor[notification.criticality], notification.committed), children: [_jsx(NotificationHeader, { title: title, isSummary: isSummary }), _jsx(NotificationContent, { notification: notification, isSummary: isSummary, onClickViewNotification: props.onClickViewNotification }), notification.call_to_action && _jsx(NotificationFooter, { actionURL: notification.call_to_action, onClickAction: clickAction, title: title })] }), _jsx(Box, { sx: { position: 'absolute', top: '8px', right: '8px' }, children: _jsx(Tooltip, { text: notification.committed ? t.committed : t.uncommitted, position: "left", sx: style.tooltip, children: notification.committed
|
|
95
118
|
? _jsx(IconBox, { role: "img", "aria-label": t.committed, size: "xs", style: { margin: '4px', opacity: 0.5 }, children: _jsx(EnvelopeOpen, {}) })
|
|
96
119
|
: (_jsx(IconButton, { "aria-label": t.uncommitted, onClick: commit, children: _jsx(IconBox, { size: "xs", children: _jsx(Envelope, {}) }) })) }) })] }));
|
|
97
120
|
};
|
|
@@ -107,6 +130,7 @@ const dictionary = {
|
|
|
107
130
|
uncommitted: 'This notification has not been read yet. Click to mark as read.',
|
|
108
131
|
view: 'View',
|
|
109
132
|
viewNotification: 'View notification %s',
|
|
133
|
+
readMore: 'Read more',
|
|
110
134
|
},
|
|
111
135
|
pt: {
|
|
112
136
|
ACCOUNT: 'Conta',
|
|
@@ -119,6 +143,7 @@ const dictionary = {
|
|
|
119
143
|
uncommitted: 'Esta notificação ainda não foi lida. Clique para marcar como lida.',
|
|
120
144
|
view: 'Visualizar',
|
|
121
145
|
viewNotification: 'Visualizar notificação %s',
|
|
146
|
+
readMore: 'Ler mais',
|
|
122
147
|
},
|
|
123
148
|
};
|
|
124
149
|
//# sourceMappingURL=NotificationItem.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationItem.js","sourceRoot":"","sources":["../../../src/components/notification/NotificationItem.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAiD,IAAI,EAAE,MAAM,cAAc,CAAA;AAC9G,OAAO,EAAE,QAAQ,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,eAAe,CAAA;AACpE,OAAO,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,YAAY,CAAA;AAChD,OAAO,EAAc,YAAY,EAAE,MAAM,8BAA8B,CAAA;AACvE,OAAO,EAAE,gBAAgB,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAA;AACrD,OAAO,EAAE,YAAY,EAAE,MAAM,sBAAsB,CAAA;AACnD,OAAO,EAAE,qCAAqC,EAAE,MAAM,kCAAkC,CAAA;AACxF,OAAO,EAAE,gBAAgB,EAAE,MAAM,kBAAkB,CAAA;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAGpD,MAAM,MAAM,GAAG;IACb,IAAI,EAAE,CAAC,KAAa,EAAE,MAAe,EAAE,EAAE,CAAC,CAAC;QACzC,UAAU,EAAE,aAAa,KAAK,EAAE;QAChC,OAAO,EAAE,MAAM,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC;KAC1B,CAAC;CACgD,CAAA;AAEpD,MAAM,aAAa,GAAkD;IACnE,GAAG,EAAE,aAAa;IAClB,MAAM,EAAE,aAAa;IACrB,IAAI,EAAE,YAAY;CACnB,CAAA;
|
|
1
|
+
{"version":3,"file":"NotificationItem.js","sourceRoot":"","sources":["../../../src/components/notification/NotificationItem.tsx"],"names":[],"mappings":"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"}
|
|
@@ -12,6 +12,10 @@ export interface NotificationListProps {
|
|
|
12
12
|
* @param id the id of the notification where the button was clicked
|
|
13
13
|
*/
|
|
14
14
|
onClickAction?: (id: string) => void;
|
|
15
|
+
/**
|
|
16
|
+
* Optional. Function called when the button read more in notification is clicked.
|
|
17
|
+
*/
|
|
18
|
+
onClickViewNotification?: () => void;
|
|
15
19
|
/**
|
|
16
20
|
* If you need this notification list to be have an infinite scroll behavior, set this option.
|
|
17
21
|
*/
|
|
@@ -35,5 +39,5 @@ export interface NotificationListProps {
|
|
|
35
39
|
style?: React.CSSProperties;
|
|
36
40
|
className?: string;
|
|
37
41
|
}
|
|
38
|
-
export declare const NotificationList: ({ items, compact, onCommit, onClickAction, infiniteScroll, loading, showEmptySearch, style, className }: NotificationListProps) => false | import("react/jsx-runtime").JSX.Element;
|
|
42
|
+
export declare const NotificationList: ({ items, compact, onCommit, onClickAction, onClickViewNotification, infiniteScroll, loading, showEmptySearch, style, className }: NotificationListProps) => false | import("react/jsx-runtime").JSX.Element;
|
|
39
43
|
//# sourceMappingURL=NotificationList.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationList.d.ts","sourceRoot":"","sources":["../../../src/components/notification/NotificationList.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,8BAA8B,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAE9E,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC;;OAEG;IACH,KAAK,EAAE,8BAA8B,EAAE,CAAC;IACxC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuED,eAAO,MAAM,gBAAgB,
|
|
1
|
+
{"version":3,"file":"NotificationList.d.ts","sourceRoot":"","sources":["../../../src/components/notification/NotificationList.tsx"],"names":[],"mappings":";AAUA,OAAO,EAAE,8BAA8B,EAAE,oBAAoB,EAAE,MAAM,SAAS,CAAA;AAE9E,MAAM,WAAW,qBAAqB;IACpC;;;OAGG;IACH,QAAQ,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAC/B;;;;OAIG;IACH,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACtC;;QAEI;IACH,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;IACrC;;OAEG;IACH,cAAc,CAAC,EAAE,oBAAoB,CAAC;IACtC;;OAEG;IACH,KAAK,EAAE,8BAA8B,EAAE,CAAC;IACxC;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAuED,eAAO,MAAM,gBAAgB,qIAEqC,qBAAqB,oDAsDtF,CAAA"}
|
|
@@ -68,9 +68,9 @@ function groupNotificationsByDate(notifications) {
|
|
|
68
68
|
}
|
|
69
69
|
return groups;
|
|
70
70
|
}
|
|
71
|
-
export const NotificationList = ({ items, compact = false, onCommit, onClickAction, infiniteScroll, loading, showEmptySearch, style, className }) => {
|
|
71
|
+
export const NotificationList = ({ items, compact = false, onCommit, onClickAction, onClickViewNotification, infiniteScroll, loading, showEmptySearch, style, className }) => {
|
|
72
72
|
const groups = useMemo(() => compact ? [{ day: 0, month: 0, year: 0, items }] : groupNotificationsByDate(items), [compact, items]);
|
|
73
|
-
const renderNotifications = (notifications, key) => (_jsx(Flex, { sx: { gap: '4px' }, flexDirection: "column", children: notifications?.map((item) => (_jsx(NotificationItem, { notification: item, isSummary: compact, onCommit: () => onCommit(item.id), onClickAction: () => onClickAction?.(item.id) }, item.id))) }, key));
|
|
73
|
+
const renderNotifications = (notifications, key) => (_jsx(Flex, { sx: { gap: '4px' }, flexDirection: "column", children: notifications?.map((item) => (_jsx(NotificationItem, { id: key ? '' : `notification-item-${item.id}`, notification: item, isSummary: compact, onClickViewNotification: onClickViewNotification, onCommit: () => onCommit(item.id), onClickAction: () => onClickAction?.(item.id) }, item.id))) }, key));
|
|
74
74
|
return infiniteScroll?.scrollableTarget !== null && (_jsxs(StyledBox, { style: style, className: listToClass([className, loading && 'loading']), children: [items.length ? (_jsx(InfiniteScroll, { dataLength: items.length || 0, next: infiniteScroll?.loadMore ?? (() => { }), hasMore: infiniteScroll?.hasMore ?? false,
|
|
75
75
|
// @ts-ignore: the library is wrongly typed and abandoned, meaning, it will never be fixed. The source code clearly accepts
|
|
76
76
|
// HTMLElements as scrollable targets:
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NotificationList.js","sourceRoot":"","sources":["../../../src/components/notification/NotificationList.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,cAAc,CAAA;AACxC,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAA;AAEtD,OAAO,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAC7B,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,mBAAmB,CAAA;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAClD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AACpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AACrD,OAAO,EAAE,uBAAuB,EAAE,MAAM,2BAA2B,CAAA;
|
|
1
|
+
{"version":3,"file":"NotificationList.js","sourceRoot":"","sources":["../../../src/components/notification/NotificationList.tsx"],"names":[],"mappings":"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"}
|
|
@@ -50,6 +50,10 @@ export interface NotificationConfig {
|
|
|
50
50
|
* @param id the id of the notification.
|
|
51
51
|
*/
|
|
52
52
|
onClickAction?: (id: string) => void;
|
|
53
|
+
/**
|
|
54
|
+
* Function that is called whenever the "read more" button is clicked.
|
|
55
|
+
*/
|
|
56
|
+
onClickViewNotification?: () => void;
|
|
53
57
|
}
|
|
54
58
|
export type UnreadNotificationListener = (hasUnreadNotification: boolean) => void;
|
|
55
59
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/context/notification/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,8BAA8B,EAAE,2CAA2C,EAAE,MAAM,qBAAqB,CAAA;AAEjH,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAA;AAE5D,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,QAAQ,GAAG,WAAW,CAAA;AAEpE,MAAM,WAAW,wBAAwB;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,oBAAoB,CAAC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,wBAAyB,SAAQ,wBAAwB;IACxE,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,wBAAwB,GAAG,CAAC,aAAa,EAAE,8BAA8B,EAAE,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;AAElH,MAAM,WAAW,kBAAkB;IACjC;;;;OAIG;IACH,IAAI,CAAC,OAAO,EAAE,wBAAwB,GAAG,OAAO,CAAC,2CAA2C,CAAC,CAAC;IAC9F;;;;OAIG;IACH,gCAAgC,CAAC,IAAI,CAAC,EAAE,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAChE;;;OAGG;IACH,eAAe,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;CACtC;AAED,MAAM,MAAM,0BAA0B,GAAG,CAAC,qBAAqB,EAAE,OAAO,KAAK,IAAI,CAAA"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/context/notification/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,8BAA8B,EAAE,2CAA2C,EAAE,MAAM,qBAAqB,CAAA;AAEjH,MAAM,MAAM,oBAAoB,GAAG,MAAM,GAAG,QAAQ,GAAG,KAAK,CAAA;AAE5D,MAAM,MAAM,mBAAmB,GAAG,SAAS,GAAG,QAAQ,GAAG,WAAW,CAAA;AAEpE,MAAM,WAAW,wBAAwB;IACvC,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,WAAW,CAAC,EAAE,oBAAoB,CAAC;IACnC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,OAAO,CAAC,EAAE,mBAAmB,CAAC;IAC9B,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,WAAW,wBAAyB,SAAQ,wBAAwB;IACxE,IAAI,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,MAAM,MAAM,wBAAwB,GAAG,CAAC,aAAa,EAAE,8BAA8B,EAAE,EAAE,OAAO,EAAE,OAAO,KAAK,IAAI,CAAA;AAElH,MAAM,WAAW,kBAAkB;IACjC;;;;OAIG;IACH,IAAI,CAAC,OAAO,EAAE,wBAAwB,GAAG,OAAO,CAAC,2CAA2C,CAAC,CAAC;IAC9F;;;;OAIG;IACH,gCAAgC,CAAC,IAAI,CAAC,EAAE,IAAI,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;IAChE;;;OAGG;IACH,eAAe,CAAC,EAAE,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC3C;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;OAGG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAC3B;;;;;;OAMG;IACH,aAAa,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IACrC;;OAEG;IACH,uBAAuB,CAAC,EAAE,MAAM,IAAI,CAAC;CACtC;AAED,MAAM,MAAM,0BAA0B,GAAG,CAAC,qBAAqB,EAAE,OAAO,KAAK,IAAI,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,8 +1,9 @@
|
|
|
1
|
-
|
|
1
|
+
|
|
2
2
|
import { Button, Flex, IconBox, Text } from '@citric/core'
|
|
3
3
|
import { ExclamationTriangle, TimesCircleFill } from '@citric/icons'
|
|
4
4
|
import { Alert } from '@citric/ui'
|
|
5
5
|
import { useState } from 'react'
|
|
6
|
+
import { getCookie, setCookie } from '../utils/cookie'
|
|
6
7
|
|
|
7
8
|
/**
|
|
8
9
|
* A styled and dismissible alert box for showing important warnings for the user.
|
|
@@ -13,23 +14,10 @@ import { useState } from 'react'
|
|
|
13
14
|
export const BannerWarning = ({ children }: { children: React.ReactNode }) => {
|
|
14
15
|
const bannerKey = 'bannerClosed'
|
|
15
16
|
|
|
16
|
-
const getCookie = (key: string): string | undefined =>
|
|
17
|
-
document.cookie
|
|
18
|
-
.split('; ')
|
|
19
|
-
.find((row) => row.startsWith(`${key}=`))
|
|
20
|
-
?.split('=')[1]
|
|
21
|
-
|
|
22
|
-
const setCookie = (key: string, value: string, domain = '.stackspot.com') => {
|
|
23
|
-
document.cookie = `${key}=${value};path=/${
|
|
24
|
-
location.host.endsWith(domain) ? `;domain=${domain}` : ''
|
|
25
|
-
}`
|
|
26
|
-
}
|
|
27
|
-
|
|
28
17
|
const [isVisible, setIsVisible] = useState(() => {
|
|
29
18
|
if (typeof window !== 'undefined') {
|
|
30
|
-
const isBannerValid = getCookie(bannerKey) !== 'expired'
|
|
31
19
|
const isBannerClosed = getCookie(bannerKey) === 'true'
|
|
32
|
-
return
|
|
20
|
+
return !isBannerClosed
|
|
33
21
|
}
|
|
34
22
|
return false
|
|
35
23
|
})
|
|
@@ -44,32 +32,34 @@ export const BannerWarning = ({ children }: { children: React.ReactNode }) => {
|
|
|
44
32
|
}
|
|
45
33
|
|
|
46
34
|
return (
|
|
47
|
-
<Flex
|
|
35
|
+
<Flex sx={{ zIndex: '1', w: '12', mb: 7 }}>
|
|
48
36
|
<Alert
|
|
49
37
|
colorScheme="warning"
|
|
50
38
|
sx={{
|
|
51
|
-
height: '48px',
|
|
52
39
|
position: 'relative',
|
|
53
40
|
px: 3,
|
|
54
|
-
py: 1
|
|
41
|
+
py: 1,
|
|
42
|
+
alignItems: 'center',
|
|
43
|
+
display: 'flex',
|
|
44
|
+
justifyContent: 'space-between',
|
|
45
|
+
height: 'auto',
|
|
55
46
|
}}
|
|
56
47
|
>
|
|
57
|
-
<Flex
|
|
48
|
+
<Flex
|
|
49
|
+
sx={{
|
|
50
|
+
alignItems: 'center',
|
|
51
|
+
flexWrap: 'nowrap',
|
|
52
|
+
}}
|
|
53
|
+
>
|
|
58
54
|
<IconBox
|
|
59
55
|
size="sm"
|
|
60
56
|
colorIcon="light.500"
|
|
61
|
-
sx={{
|
|
62
|
-
display: ['flex', 'flex'],
|
|
63
|
-
mr: 2,
|
|
64
|
-
mb: 2
|
|
65
|
-
}}
|
|
66
57
|
>
|
|
67
58
|
<ExclamationTriangle />
|
|
68
59
|
</IconBox>
|
|
69
|
-
|
|
70
60
|
<Text
|
|
71
61
|
sx={{
|
|
72
|
-
|
|
62
|
+
ml:5,
|
|
73
63
|
}}
|
|
74
64
|
appearance="body2"
|
|
75
65
|
colorScheme="warning.contrastText"
|
|
@@ -77,24 +67,18 @@ export const BannerWarning = ({ children }: { children: React.ReactNode }) => {
|
|
|
77
67
|
{children}
|
|
78
68
|
</Text>
|
|
79
69
|
</Flex>
|
|
70
|
+
|
|
80
71
|
<Button
|
|
81
72
|
appearance={'text'}
|
|
82
73
|
onClick={handleClose}
|
|
83
74
|
sx={{
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
':hover': {
|
|
87
|
-
boxShadow: 'none'
|
|
88
|
-
},
|
|
89
|
-
ml: 2
|
|
75
|
+
p: 0,
|
|
76
|
+
ml: 2,
|
|
90
77
|
}}
|
|
91
78
|
>
|
|
92
79
|
<IconBox
|
|
93
80
|
size="lg"
|
|
94
81
|
colorIcon="light.500"
|
|
95
|
-
sx={{
|
|
96
|
-
display: ['flex', 'flex']
|
|
97
|
-
}}
|
|
98
82
|
>
|
|
99
83
|
<TimesCircleFill />
|
|
100
84
|
</IconBox>
|
|
@@ -263,8 +263,13 @@ export const NotificationComponent = ({
|
|
|
263
263
|
>
|
|
264
264
|
<Flex sx={{ gap: '4px' }} mr="3" flexDirection="column">
|
|
265
265
|
{notifications?.map((item, index) => (
|
|
266
|
-
<NotificationItem
|
|
267
|
-
|
|
266
|
+
<NotificationItem
|
|
267
|
+
key={item.id}
|
|
268
|
+
notification={item}
|
|
269
|
+
id={`notificationItem-${index}`}
|
|
270
|
+
isSummary={isSummary}
|
|
271
|
+
onClickMarkReadUnread={(read, type) => onMarkAsReadUnread(item.id, read, type)}
|
|
272
|
+
/>
|
|
268
273
|
))}
|
|
269
274
|
</Flex>
|
|
270
275
|
</InfiniteScroll>
|
|
@@ -293,8 +298,6 @@ export const NotificationComponent = ({
|
|
|
293
298
|
</Button>
|
|
294
299
|
</Flex>
|
|
295
300
|
</Flex>
|
|
296
|
-
|
|
297
|
-
|
|
298
301
|
</NotificationsComponent>
|
|
299
302
|
</Flex >)
|
|
300
303
|
}
|
|
@@ -27,6 +27,7 @@ interface Props {
|
|
|
27
27
|
isSummary: boolean,
|
|
28
28
|
// @deprecated this property currently does nothing. Remove in next major.
|
|
29
29
|
id?: string,
|
|
30
|
+
onClickViewNotification?: () => void,
|
|
30
31
|
}
|
|
31
32
|
|
|
32
33
|
const style: Styles = {
|
|
@@ -35,6 +36,15 @@ const style: Styles = {
|
|
|
35
36
|
top: '25%',
|
|
36
37
|
},
|
|
37
38
|
},
|
|
39
|
+
notificationDescription: {
|
|
40
|
+
display: '-webkit-box',
|
|
41
|
+
WebkitBoxOrient: 'vertical',
|
|
42
|
+
overflow: 'hidden',
|
|
43
|
+
WebkitLineClamp: '2',
|
|
44
|
+
lineHeight: '1.5',
|
|
45
|
+
maxHeight: '3em',
|
|
46
|
+
maxWidth: '340px',
|
|
47
|
+
},
|
|
38
48
|
}
|
|
39
49
|
|
|
40
50
|
/**
|
|
@@ -44,7 +54,7 @@ const style: Styles = {
|
|
|
44
54
|
*/
|
|
45
55
|
const NotificationHeader = ({ title, isSummary }: { title: string, isSummary: boolean }) => (
|
|
46
56
|
<Flex justifyContent="space-between" mb={2} sx={{ maxWidth: isSummary ? '330px' : '100%' }} flexWrap="nowrap">
|
|
47
|
-
<Text appearance={isSummary ? 'body2' : 'body1'} nowrapEllipsis>
|
|
57
|
+
<Text appearance={isSummary ? 'body2' : 'body1'} weight="medium" nowrapEllipsis>
|
|
48
58
|
{title}
|
|
49
59
|
</Text>
|
|
50
60
|
</Flex>
|
|
@@ -67,11 +77,14 @@ const getDaysAgo = (dateString: string): number => {
|
|
|
67
77
|
*
|
|
68
78
|
* @param props the component's props {@link Props}.
|
|
69
79
|
*/
|
|
70
|
-
const NotificationContent = ({ notification, isSummary }: Props) => {
|
|
80
|
+
const NotificationContent = ({ notification, isSummary, onClickViewNotification }: Props) => {
|
|
71
81
|
const { formatDate } = useDateFormatter()
|
|
82
|
+
const Link = useAnchorTag()
|
|
83
|
+
|
|
72
84
|
const t = useTranslate(dictionary)
|
|
73
85
|
const { description } = useGetNotificationTitleAndDescription(notification)
|
|
74
86
|
const daysAgo = getDaysAgo(notification.trigger_at)
|
|
87
|
+
|
|
75
88
|
const components = () => ({
|
|
76
89
|
ul: (props: any) => <Text
|
|
77
90
|
as="ul"
|
|
@@ -82,29 +95,55 @@ const NotificationContent = ({ notification, isSummary }: Props) => {
|
|
|
82
95
|
/>,
|
|
83
96
|
})
|
|
84
97
|
|
|
98
|
+
const navigateToNotificationPosition = (ev: React.MouseEvent<HTMLElement>, anchorText: string) => {
|
|
99
|
+
ev.preventDefault()
|
|
100
|
+
|
|
101
|
+
const checkElement = setInterval(() => {
|
|
102
|
+
const target = document.getElementById(anchorText)
|
|
103
|
+
if (target) {
|
|
104
|
+
target.scrollIntoView({ behavior: 'smooth', block: 'start' })
|
|
105
|
+
clearInterval(checkElement)
|
|
106
|
+
}
|
|
107
|
+
}, 100)
|
|
108
|
+
}
|
|
109
|
+
|
|
85
110
|
return (
|
|
86
111
|
<>
|
|
87
112
|
{!isSummary && <Flex mt={4} mb={3} flexDirection="column">
|
|
88
113
|
<LazyMarkdown components={components()}>{description}</LazyMarkdown>
|
|
89
114
|
</Flex>}
|
|
90
|
-
|
|
91
|
-
<Text appearance="
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
<
|
|
95
|
-
•
|
|
96
|
-
</Text>
|
|
97
|
-
{!isSummary && <>
|
|
115
|
+
{isSummary && (
|
|
116
|
+
<Text appearance="body2" mb={3} sx={style.notificationDescription}>{description}</Text>
|
|
117
|
+
)}
|
|
118
|
+
<Flex justifyContent="space-between">
|
|
119
|
+
<Flex>
|
|
98
120
|
<Text appearance="microtext1" colorScheme="light.700">
|
|
99
|
-
{
|
|
121
|
+
{t[notification.context]}
|
|
100
122
|
</Text>
|
|
101
123
|
<Text appearance="microtext1" colorScheme="light.700" mx="2">
|
|
124
|
+
•
|
|
125
|
+
</Text>
|
|
126
|
+
{!isSummary && <>
|
|
127
|
+
<Text appearance="microtext1" colorScheme="light.700">
|
|
128
|
+
{formatDate(notification.trigger_at)}
|
|
129
|
+
</Text>
|
|
130
|
+
<Text appearance="microtext1" colorScheme="light.700" mx="2">
|
|
102
131
|
•
|
|
132
|
+
</Text>
|
|
133
|
+
</>}
|
|
134
|
+
<Text appearance="microtext1" colorScheme="light.700">
|
|
135
|
+
{daysAgo > 0 ? daysAgo + ' ' + t.daysAgo : t.today}
|
|
103
136
|
</Text>
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
137
|
+
</Flex>
|
|
138
|
+
{isSummary && description.length > 120 && (
|
|
139
|
+
<Link
|
|
140
|
+
href="/notifications"
|
|
141
|
+
onClick={(ev: React.MouseEvent<HTMLElement>) => {
|
|
142
|
+
onClickViewNotification?.()
|
|
143
|
+
navigateToNotificationPosition(ev, `notification-item-${notification.id}`)}}>
|
|
144
|
+
<Text appearance="microtext1" colorScheme="light.700">{t.readMore}</Text>
|
|
145
|
+
</Link>
|
|
146
|
+
)}
|
|
108
147
|
</Flex>
|
|
109
148
|
</>
|
|
110
149
|
)
|
|
@@ -184,6 +223,10 @@ interface NewNotificationItemProps extends Props {
|
|
|
184
223
|
* If you need additional behavior, use this parameter, which is a function to call whenever the button is clicked.
|
|
185
224
|
*/
|
|
186
225
|
onClickAction?: () => void,
|
|
226
|
+
/**
|
|
227
|
+
* Function to call when the user clicks in read more button.
|
|
228
|
+
*/
|
|
229
|
+
onClickViewNotification?: () => void,
|
|
187
230
|
}
|
|
188
231
|
|
|
189
232
|
type NotificationItemProps = DeprecatedNotificationItemProps | NewNotificationItemProps
|
|
@@ -211,11 +254,12 @@ export const NotificationItem = ({ notification, isSummary, ...props }: Notifica
|
|
|
211
254
|
}
|
|
212
255
|
|
|
213
256
|
return (
|
|
214
|
-
<Box sx={{ position: 'relative' }}>
|
|
257
|
+
<Box sx={{ position: 'relative' }} id={props.id}>
|
|
215
258
|
<Flex bg="light.400" p="3 3 3 5" r="xs"
|
|
259
|
+
flexWrap="nowrap"
|
|
216
260
|
flexDirection="column" w="100%" sx={styles.item(statusToColor[notification.criticality], notification.committed)}>
|
|
217
261
|
<NotificationHeader title={title} isSummary={isSummary} />
|
|
218
|
-
<NotificationContent notification={notification} isSummary={isSummary} />
|
|
262
|
+
<NotificationContent notification={notification} isSummary={isSummary} onClickViewNotification={props.onClickViewNotification} />
|
|
219
263
|
{notification.call_to_action && <NotificationFooter
|
|
220
264
|
actionURL={notification.call_to_action}
|
|
221
265
|
onClickAction={clickAction}
|
|
@@ -250,6 +294,7 @@ const dictionary = {
|
|
|
250
294
|
uncommitted: 'This notification has not been read yet. Click to mark as read.',
|
|
251
295
|
view: 'View',
|
|
252
296
|
viewNotification: 'View notification %s',
|
|
297
|
+
readMore: 'Read more',
|
|
253
298
|
},
|
|
254
299
|
pt: {
|
|
255
300
|
ACCOUNT: 'Conta',
|
|
@@ -262,5 +307,6 @@ const dictionary = {
|
|
|
262
307
|
uncommitted: 'Esta notificação ainda não foi lida. Clique para marcar como lida.',
|
|
263
308
|
view: 'Visualizar',
|
|
264
309
|
viewNotification: 'Visualizar notificação %s',
|
|
310
|
+
readMore: 'Ler mais',
|
|
265
311
|
},
|
|
266
312
|
} satisfies Dictionary
|
|
@@ -22,6 +22,10 @@ export interface NotificationListProps {
|
|
|
22
22
|
* @param id the id of the notification where the button was clicked
|
|
23
23
|
*/
|
|
24
24
|
onClickAction?: (id: string) => void,
|
|
25
|
+
/**
|
|
26
|
+
* Optional. Function called when the button read more in notification is clicked.
|
|
27
|
+
*/
|
|
28
|
+
onClickViewNotification?: () => void,
|
|
25
29
|
/**
|
|
26
30
|
* If you need this notification list to be have an infinite scroll behavior, set this option.
|
|
27
31
|
*/
|
|
@@ -116,7 +120,8 @@ function groupNotificationsByDate(notifications: GetTenantNotificationsResponse[
|
|
|
116
120
|
}
|
|
117
121
|
|
|
118
122
|
export const NotificationList = (
|
|
119
|
-
{ items, compact = false, onCommit, onClickAction,
|
|
123
|
+
{ items, compact = false, onCommit, onClickAction, onClickViewNotification,
|
|
124
|
+
infiniteScroll, loading, showEmptySearch, style, className }: NotificationListProps,
|
|
120
125
|
) => {
|
|
121
126
|
const groups: NotificationGroup[] = useMemo(
|
|
122
127
|
() => compact ? [{ day: 0, month: 0, year: 0, items }] : groupNotificationsByDate(items),
|
|
@@ -128,8 +133,10 @@ export const NotificationList = (
|
|
|
128
133
|
{notifications?.map((item) => (
|
|
129
134
|
<NotificationItem
|
|
130
135
|
key={item.id}
|
|
136
|
+
id={key ? '' : `notification-item-${item.id}`}
|
|
131
137
|
notification={item}
|
|
132
138
|
isSummary={compact}
|
|
139
|
+
onClickViewNotification={onClickViewNotification}
|
|
133
140
|
onCommit={() => onCommit(item.id)}
|
|
134
141
|
onClickAction={() => onClickAction?.(item.id)}
|
|
135
142
|
/>
|
|
@@ -56,6 +56,10 @@ export interface NotificationConfig {
|
|
|
56
56
|
* @param id the id of the notification.
|
|
57
57
|
*/
|
|
58
58
|
onClickAction?: (id: string) => void,
|
|
59
|
+
/**
|
|
60
|
+
* Function that is called whenever the "read more" button is clicked.
|
|
61
|
+
*/
|
|
62
|
+
onClickViewNotification?: () => void,
|
|
59
63
|
}
|
|
60
64
|
|
|
61
65
|
export type UnreadNotificationListener = (hasUnreadNotification: boolean) => void
|