@times-components/ts-components 1.21.0 → 1.22.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.
Files changed (35) hide show
  1. package/CHANGELOG.md +11 -0
  2. package/dist/components/article-flag/ArticleFlag.stories.js +21 -3
  3. package/dist/components/article-flag/LiveArticleFlag.js +13 -6
  4. package/dist/components/article-flag/styles.d.ts +1 -0
  5. package/dist/components/article-flag/styles.js +6 -1
  6. package/dist/components/updated-timestamp/UpdatedTimestamp.d.ts +4 -0
  7. package/dist/components/updated-timestamp/UpdatedTimestamp.js +21 -0
  8. package/dist/components/updated-timestamp/UpdatedTimestamp.stories.d.ts +1 -0
  9. package/dist/components/updated-timestamp/UpdatedTimestamp.stories.js +13 -0
  10. package/dist/components/updated-timestamp/__tests__/UpdatedTimestamp.test.d.ts +1 -0
  11. package/dist/components/updated-timestamp/__tests__/UpdatedTimestamp.test.js +34 -0
  12. package/dist/components/updated-timestamp/styles.d.ts +2 -0
  13. package/dist/components/updated-timestamp/styles.js +14 -0
  14. package/dist/helpers/time/UpdatedTimeProvider.d.ts +5 -0
  15. package/dist/helpers/time/UpdatedTimeProvider.js +9 -0
  16. package/dist/helpers/time/__tests__/UpdatedTimeProvider.test.d.ts +1 -0
  17. package/dist/helpers/time/__tests__/UpdatedTimeProvider.test.js +17 -0
  18. package/dist/index.d.ts +2 -0
  19. package/dist/index.js +3 -1
  20. package/package.json +5 -5
  21. package/rnw.js +1 -1
  22. package/src/components/article-flag/ArticleFlag.stories.tsx +28 -2
  23. package/src/components/article-flag/LiveArticleFlag.tsx +19 -9
  24. package/src/components/article-flag/__tests__/__snapshots__/ArticleFlag.test.tsx.snap +73 -73
  25. package/src/components/article-flag/__tests__/__snapshots__/LiveArticleFlag.test.tsx.snap +39 -27
  26. package/src/components/article-flag/styles.ts +6 -0
  27. package/src/components/article-header/__tests__/__snapshots__/ArticleHeader.test.tsx.snap +13 -9
  28. package/src/components/updated-timestamp/UpdatedTimestamp.stories.tsx +18 -0
  29. package/src/components/updated-timestamp/UpdatedTimestamp.tsx +38 -0
  30. package/src/components/updated-timestamp/__tests__/UpdatedTimestamp.test.tsx +50 -0
  31. package/src/components/updated-timestamp/__tests__/__snapshots__/UpdatedTimestamp.test.tsx.snap +11 -0
  32. package/src/components/updated-timestamp/styles.ts +15 -0
  33. package/src/helpers/time/UpdatedTimeProvider.tsx +17 -0
  34. package/src/helpers/time/__tests__/UpdatedTimeProvider.test.tsx +23 -0
  35. package/src/index.ts +6 -0
package/CHANGELOG.md CHANGED
@@ -3,6 +3,17 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ # [1.22.0](https://github.com/newsuk/times-components/compare/@times-components/ts-components@1.21.0...@times-components/ts-components@1.22.0) (2022-03-02)
7
+
8
+
9
+ ### Features
10
+
11
+ * **TDP-1247:** Last updated timestamp ([#2864](https://github.com/newsuk/times-components/issues/2864)) ([57355b6](https://github.com/newsuk/times-components/commit/57355b6a2a067ca098e63802f018e69e78ac186e))
12
+
13
+
14
+
15
+
16
+
6
17
  # [1.21.0](https://github.com/newsuk/times-components/compare/@times-components/ts-components@1.20.0...@times-components/ts-components@1.21.0) (2022-03-01)
7
18
 
8
19
 
@@ -1,11 +1,29 @@
1
1
  import React from 'react';
2
2
  import { storiesOf } from '@storybook/react';
3
+ import { date } from '@storybook/addon-knobs';
3
4
  import { NewArticleFlag, UpdatedArticleFlag, ExclusiveArticleFlag, SponsoredArticleFlag, LongReadArticleFlag, ArticleFlags } from './ArticleFlag';
4
5
  import { LiveArticleFlag, BreakingArticleFlag } from './LiveArticleFlag';
6
+ import { UpdatedTimeProvider } from '../../helpers/time/UpdatedTimeProvider';
5
7
  storiesOf('Typescript Component/Article Flag', module)
6
8
  .add('Article Flag (New)', () => React.createElement(NewArticleFlag, null))
7
- .add('Article Flag (Live)', () => React.createElement(LiveArticleFlag, null))
8
- .add('Article Flag (Breaking)', () => React.createElement(BreakingArticleFlag, null))
9
+ .add('Article Flag (Live)', () => {
10
+ const label = 'Updated Date/Time';
11
+ const defaultValue = new Date();
12
+ const groupId = 'Options';
13
+ const value = date(label, defaultValue, groupId);
14
+ const updated = new Date(value).toISOString();
15
+ return (React.createElement(UpdatedTimeProvider, { updatedTime: updated },
16
+ React.createElement(LiveArticleFlag, null)));
17
+ })
18
+ .add('Article Flag (Breaking)', () => {
19
+ const label = 'Updated Date/Time';
20
+ const defaultValue = new Date();
21
+ const groupId = 'Options';
22
+ const value = date(label, defaultValue, groupId);
23
+ const updated = new Date(value).toISOString();
24
+ return (React.createElement(UpdatedTimeProvider, { updatedTime: updated },
25
+ React.createElement(BreakingArticleFlag, null)));
26
+ })
9
27
  .add('Article Flag (Updated)', () => React.createElement(UpdatedArticleFlag, null))
10
28
  .add('Article Flag (Exclusive)', () => React.createElement(ExclusiveArticleFlag, null))
11
29
  .add('Article Flag (Sponsored)', () => React.createElement(SponsoredArticleFlag, null))
@@ -26,4 +44,4 @@ storiesOf('Typescript Component/Article Flag', module)
26
44
  { expiryTime: '2030-03-14T12:00:00.000Z', type: 'NEW' },
27
45
  { expiryTime: '2030-03-14T12:00:00.000Z', type: 'SPONSORED' }
28
46
  ], longRead: true, withContainer: true })));
29
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXJ0aWNsZUZsYWcuc3Rvcmllcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2FydGljbGUtZmxhZy9BcnRpY2xlRmxhZy5zdG9yaWVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQzdDLE9BQU8sRUFDTCxjQUFjLEVBQ2Qsa0JBQWtCLEVBQ2xCLG9CQUFvQixFQUNwQixvQkFBb0IsRUFDcEIsbUJBQW1CLEVBQ25CLFlBQVksRUFDYixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsZUFBZSxFQUFFLG1CQUFtQixFQUFFLE1BQU0sbUJBQW1CLENBQUM7QUFFekUsU0FBUyxDQUFDLG1DQUFtQyxFQUFFLE1BQU0sQ0FBQztLQUNuRCxHQUFHLENBQUMsb0JBQW9CLEVBQUUsR0FBRyxFQUFFLENBQUMsb0JBQUMsY0FBYyxPQUFHLENBQUM7S0FDbkQsR0FBRyxDQUFDLHFCQUFxQixFQUFFLEdBQUcsRUFBRSxDQUFDLG9CQUFDLGVBQWUsT0FBRyxDQUFDO0tBQ3JELEdBQUcsQ0FBQyx5QkFBeUIsRUFBRSxHQUFHLEVBQUUsQ0FBQyxvQkFBQyxtQkFBbUIsT0FBRyxDQUFDO0tBQzdELEdBQUcsQ0FBQyx3QkFBd0IsRUFBRSxHQUFHLEVBQUUsQ0FBQyxvQkFBQyxrQkFBa0IsT0FBRyxDQUFDO0tBQzNELEdBQUcsQ0FBQywwQkFBMEIsRUFBRSxHQUFHLEVBQUUsQ0FBQyxvQkFBQyxvQkFBb0IsT0FBRyxDQUFDO0tBQy9ELEdBQUcsQ0FBQywwQkFBMEIsRUFBRSxHQUFHLEVBQUUsQ0FBQyxvQkFBQyxvQkFBb0IsT0FBRyxDQUFDO0tBQy9ELEdBQUcsQ0FBQywwQkFBMEIsRUFBRSxHQUFHLEVBQUUsQ0FBQyxvQkFBQyxtQkFBbUIsT0FBRyxDQUFDO0tBQzlELEdBQUcsQ0FBQyxlQUFlLEVBQUUsR0FBRyxFQUFFLENBQUMsQ0FDMUIsb0JBQUMsWUFBWSxJQUNYLEtBQUssRUFBRTtRQUNMLEVBQUUsVUFBVSxFQUFFLDBCQUEwQixFQUFFLElBQUksRUFBRSxNQUFNLEVBQUU7UUFDeEQsRUFBRSxVQUFVLEVBQUUsMEJBQTBCLEVBQUUsSUFBSSxFQUFFLFVBQVUsRUFBRTtRQUM1RCxFQUFFLFVBQVUsRUFBRSwwQkFBMEIsRUFBRSxJQUFJLEVBQUUsU0FBUyxFQUFFO1FBQzNELEVBQUUsVUFBVSxFQUFFLDBCQUEwQixFQUFFLElBQUksRUFBRSxXQUFXLEVBQUU7UUFDN0QsRUFBRSxVQUFVLEVBQUUsMEJBQTBCLEVBQUUsSUFBSSxFQUFFLEtBQUssRUFBRTtRQUN2RCxFQUFFLFVBQVUsRUFBRSwwQkFBMEIsRUFBRSxJQUFJLEVBQUUsV0FBVyxFQUFFO0tBQzlELEVBQ0QsUUFBUSxRQUNSLGFBQWEsRUFBRSxLQUFLLEdBQ3BCLENBQ0gsQ0FBQztLQUNELEdBQUcsQ0FBQyw4QkFBOEIsRUFBRSxHQUFHLEVBQUUsQ0FBQyxDQUN6QyxvQkFBQyxZQUFZLElBQ1gsS0FBSyxFQUFFO1FBQ0wsRUFBRSxVQUFVLEVBQUUsMEJBQTBCLEVBQUUsSUFBSSxFQUFFLE1BQU0sRUFBRTtRQUN4RCxFQUFFLFVBQVUsRUFBRSwwQkFBMEIsRUFBRSxJQUFJLEVBQUUsVUFBVSxFQUFFO1FBQzVELEVBQUUsVUFBVSxFQUFFLDBCQUEwQixFQUFFLElBQUksRUFBRSxTQUFTLEVBQUU7UUFDM0QsRUFBRSxVQUFVLEVBQUUsMEJBQTBCLEVBQUUsSUFBSSxFQUFFLFdBQVcsRUFBRTtRQUM3RCxFQUFFLFVBQVUsRUFBRSwwQkFBMEIsRUFBRSxJQUFJLEVBQUUsS0FBSyxFQUFFO1FBQ3ZELEVBQUUsVUFBVSxFQUFFLDBCQUEwQixFQUFFLElBQUksRUFBRSxXQUFXLEVBQUU7S0FDOUQsRUFDRCxRQUFRLFFBQ1IsYUFBYSxTQUNiLENBQ0gsQ0FBQyxDQUFDIn0=
47
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiQXJ0aWNsZUZsYWcuc3Rvcmllcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL2FydGljbGUtZmxhZy9BcnRpY2xlRmxhZy5zdG9yaWVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQzdDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUM5QyxPQUFPLEVBQ0wsY0FBYyxFQUNkLGtCQUFrQixFQUNsQixvQkFBb0IsRUFDcEIsb0JBQW9CLEVBQ3BCLG1CQUFtQixFQUNuQixZQUFZLEVBQ2IsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFFLGVBQWUsRUFBRSxtQkFBbUIsRUFBRSxNQUFNLG1CQUFtQixDQUFDO0FBQ3pFLE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLHdDQUF3QyxDQUFDO0FBRTdFLFNBQVMsQ0FBQyxtQ0FBbUMsRUFBRSxNQUFNLENBQUM7S0FDbkQsR0FBRyxDQUFDLG9CQUFvQixFQUFFLEdBQUcsRUFBRSxDQUFDLG9CQUFDLGNBQWMsT0FBRyxDQUFDO0tBQ25ELEdBQUcsQ0FBQyxxQkFBcUIsRUFBRSxHQUFHLEVBQUU7SUFDL0IsTUFBTSxLQUFLLEdBQUcsbUJBQW1CLENBQUM7SUFDbEMsTUFBTSxZQUFZLEdBQUcsSUFBSSxJQUFJLEVBQUUsQ0FBQztJQUNoQyxNQUFNLE9BQU8sR0FBRyxTQUFTLENBQUM7SUFDMUIsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxZQUFZLEVBQUUsT0FBTyxDQUFDLENBQUM7SUFDakQsTUFBTSxPQUFPLEdBQUcsSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsV0FBVyxFQUFFLENBQUM7SUFFOUMsT0FBTyxDQUNMLG9CQUFDLG1CQUFtQixJQUFDLFdBQVcsRUFBRSxP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
@@ -1,9 +1,16 @@
1
1
  import React from 'react';
2
- import { LiveArticleFlagContainer, LiveIconContainer, LiveArticleFlagText } from './styles';
3
- export const BaseLiveArticleFlag = ({ title }) => (React.createElement(LiveArticleFlagContainer, null,
4
- React.createElement(LiveIconContainer, null, '\u25a0'),
5
- React.createElement("div", null,
6
- React.createElement(LiveArticleFlagText, null, title))));
2
+ import { LiveArticleFlagContainer, LiveIconContainer, LiveArticleFlagText, LiveFlagAndTimestampContainer } from './styles';
3
+ import { UpdatedTimestamp } from '../updated-timestamp/UpdatedTimestamp';
4
+ import { useUpdatedTime } from '../../helpers/time/UpdatedTimeProvider';
5
+ export const BaseLiveArticleFlag = ({ title }) => {
6
+ const updatedTime = useUpdatedTime();
7
+ return (React.createElement(LiveFlagAndTimestampContainer, null,
8
+ React.createElement(LiveArticleFlagContainer, null,
9
+ React.createElement(LiveIconContainer, null, '\u25a0'),
10
+ React.createElement("div", null,
11
+ React.createElement(LiveArticleFlagText, null, title))),
12
+ React.createElement(UpdatedTimestamp, { updatedTime: updatedTime })));
13
+ };
7
14
  export const LiveArticleFlag = () => (React.createElement(BaseLiveArticleFlag, { title: "LIVE" }));
8
15
  export const BreakingArticleFlag = () => (React.createElement(BaseLiveArticleFlag, { title: "BREAKING" }));
9
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGl2ZUFydGljbGVGbGFnLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvYXJ0aWNsZS1mbGFnL0xpdmVBcnRpY2xlRmxhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFDTCx3QkFBd0IsRUFDeEIsaUJBQWlCLEVBQ2pCLG1CQUFtQixFQUNwQixNQUFNLFVBQVUsQ0FBQztBQUVsQixNQUFNLENBQUMsTUFBTSxtQkFBbUIsR0FBZ0MsQ0FBQyxFQUFFLEtBQUssRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUM3RSxvQkFBQyx3QkFBd0I7SUFDdkIsb0JBQUMsaUJBQWlCLFFBQUUsUUFBUSxDQUFxQjtJQUNqRDtRQUNFLG9CQUFDLG1CQUFtQixRQUFFLEtBQUssQ0FBdUIsQ0FDOUMsQ0FDbUIsQ0FDNUIsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGVBQWUsR0FBYSxHQUFHLEVBQUUsQ0FBQyxDQUM3QyxvQkFBQyxtQkFBbUIsSUFBQyxLQUFLLEVBQUMsTUFBTSxHQUFHLENBQ3JDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxtQkFBbUIsR0FBYSxHQUFHLEVBQUUsQ0FBQyxDQUNqRCxvQkFBQyxtQkFBbUIsSUFBQyxLQUFLLEVBQUMsVUFBVSxHQUFHLENBQ3pDLENBQUMifQ==
16
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiTGl2ZUFydGljbGVGbGFnLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvYXJ0aWNsZS1mbGFnL0xpdmVBcnRpY2xlRmxhZy50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFDTCx3QkFBd0IsRUFDeEIsaUJBQWlCLEVBQ2pCLG1CQUFtQixFQUNuQiw2QkFBNkIsRUFDOUIsTUFBTSxVQUFVLENBQUM7QUFDbEIsT0FBTyxFQUFFLGdCQUFnQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDekUsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHdDQUF3QyxDQUFDO0FBRXhFLE1BQU0sQ0FBQyxNQUFNLG1CQUFtQixHQUFnQyxDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRTtJQUM1RSxNQUFNLFdBQVcsR0FBRyxjQUFjLEVBQUUsQ0FBQztJQUVyQyxPQUFPLENBQ0wsb0JBQUMsNkJBQTZCO1FBQzVCLG9CQUFDLHdCQUF3QjtZQUN2QixvQkFBQyxpQkFBaUIsUUFBRSxRQUFRLENBQXFCO1lBQ2pEO2dCQUNFLG9CQUFDLG1CQUFtQixRQUFFLEtBQUssQ0FBdUIsQ0FDOUMsQ0FDbUI7UUFDM0Isb0JBQUMsZ0JBQWdCLElBQUMsV0FBVyxFQUFFLFdBQVcsR0FBSSxDQUNoQixDQUNqQyxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sZUFBZSxHQUFhLEdBQUcsRUFBRSxDQUFDLENBQzdDLG9CQUFDLG1CQUFtQixJQUFDLEtBQUssRUFBQyxNQUFNLEdBQUcsQ0FDckMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLG1CQUFtQixHQUFhLEdBQUcsRUFBRSxDQUFDLENBQ2pELG9CQUFDLG1CQUFtQixJQUFDLEtBQUssRUFBQyxVQUFVLEdBQUcsQ0FDekMsQ0FBQyJ9
@@ -1,5 +1,6 @@
1
1
  import { FlagType } from './ArticleFlag';
2
2
  export declare const ArticleFlagContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
3
+ export declare const LiveFlagAndTimestampContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
3
4
  export declare const LiveArticleFlagContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
4
5
  export declare const ArticleFlagBullet: import("styled-components").StyledComponent<"div", any, {}, never>;
5
6
  export declare const LiveIconContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -6,6 +6,11 @@ export const ArticleFlagContainer = styled.div `
6
6
  align-items: center;
7
7
  flex-direction: row;
8
8
  `;
9
+ export const LiveFlagAndTimestampContainer = styled.div `
10
+ display: flex;
11
+ align-items: center;
12
+ flex-direction: row;
13
+ `;
9
14
  export const LiveArticleFlagContainer = styled.div `
10
15
  display: flex;
11
16
  padding: 2px 6px;
@@ -53,4 +58,4 @@ export const FlagsContainer = styled.div `
53
58
  margin-bottom: 15px;
54
59
  margin-top: 5px;
55
60
  `;
56
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvYXJ0aWNsZS1mbGFnL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLE1BQU0sTUFBTSxtQkFBbUIsQ0FBQztBQUN2QyxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFFckQsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBRXpELE1BQU0sQ0FBQyxNQUFNLG9CQUFvQixHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7Q0FJN0MsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLHdCQUF3QixHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7O0NBS2pELENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxpQkFBaUIsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7O3NCQUlyQixDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUMsSUFBSSxLQUFLO0NBQ2xFLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxpQkFBaUIsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7O0NBSTFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSx3QkFBd0IsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7Ozs7O1dBT3ZDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQUMsY0FBYyxDQUFDLEtBQUssQ0FBQyxJQUFJLEtBQUs7Q0FDdkQsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLG1CQUFtQixHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUE7aUJBQzdCLEtBQUssQ0FBQyxVQUFVOzs7Ozs7Q0FNaEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFdBQVcsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUF3QjtrQkFDM0MsQ0FBQyxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztDQUNyRSxDQUFDO0FBQ0YsTUFBTSxDQUFDLE1BQU0sS0FBSyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7O0NBSzlCLENBQUM7QUFDRixNQUFNLENBQUMsTUFBTSxjQUFjLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTs7O0NBR3ZDLENBQUMifQ==
61
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvYXJ0aWNsZS1mbGFnL3N0eWxlcy50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLE1BQU0sTUFBTSxtQkFBbUIsQ0FBQztBQUN2QyxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFFckQsT0FBTyxFQUFFLGNBQWMsRUFBRSxNQUFNLHlCQUF5QixDQUFDO0FBRXpELE1BQU0sQ0FBQyxNQUFNLG9CQUFvQixHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7Q0FJN0MsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLDZCQUE2QixHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7Q0FJdEQsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLHdCQUF3QixHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7O0NBS2pELENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxpQkFBaUIsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7O3NCQUlyQixDQUFDLEVBQUUsS0FBSyxFQUFFLEVBQUUsRUFBRSxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUMsSUFBSSxLQUFLO0NBQ2xFLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSxpQkFBaUIsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7O0NBSTFDLENBQUM7QUFFRixNQUFNLENBQUMsTUFBTSx3QkFBd0IsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBOzs7Ozs7O1dBT3ZDLENBQUMsRUFBRSxLQUFLLEVBQUUsRUFBRSxFQUFFLENBQUMsY0FBYyxDQUFDLEtBQUssQ0FBQyxJQUFJLEtBQUs7Q0FDdkQsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLG1CQUFtQixHQUFHLE1BQU0sQ0FBQyxJQUFJLENBQUE7aUJBQzdCLEtBQUssQ0FBQyxVQUFVOzs7Ozs7Q0FNaEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLFdBQVcsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUF3QjtrQkFDM0MsQ0FBQyxFQUFFLFFBQVEsRUFBRSxFQUFFLEVBQUUsQ0FBQyxDQUFDLFFBQVEsQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQyxNQUFNLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQztDQUNyRSxDQUFDO0FBQ0YsTUFBTSxDQUFDLE1BQU0sS0FBSyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7O0NBSzlCLENBQUM7QUFDRixNQUFNLENBQUMsTUFBTSxjQUFjLEdBQUcsTUFBTSxDQUFDLEdBQUcsQ0FBQTs7O0NBR3ZDLENBQUMifQ==
@@ -0,0 +1,4 @@
1
+ import React from 'react';
2
+ export declare const UpdatedTimestamp: React.FC<{
3
+ updatedTime?: string;
4
+ }>;
@@ -0,0 +1,21 @@
1
+ import React from 'react';
2
+ import { differenceInSeconds, format, formatDistanceStrict } from 'date-fns';
3
+ import { Container, TimeSinceUpdate } from './styles';
4
+ export const UpdatedTimestamp = ({ updatedTime }) => {
5
+ if (!updatedTime) {
6
+ return null;
7
+ }
8
+ const currentDateTime = new Date();
9
+ const updatedDate = new Date(updatedTime);
10
+ const timeSincePublishing = formatDistanceStrict(updatedDate, currentDateTime, {
11
+ roundingMethod: 'floor'
12
+ }) + ' ago';
13
+ const diffInSeconds = differenceInSeconds(currentDateTime, updatedDate);
14
+ const isLessThan1Minute = diffInSeconds < 60;
15
+ const isLessThan13Hours = diffInSeconds < 60 * 60 * 13;
16
+ return (React.createElement(Container, null, !isLessThan1Minute && isLessThan13Hours ? (React.createElement(TimeSinceUpdate, { "data-testId": "MinutesHoursSinceUpdate" }, `Updated ${timeSincePublishing}`)) : !isLessThan13Hours ? (React.createElement(TimeSinceUpdate, { "data-testId": "DateTimeUpdated" },
17
+ `Updated `,
18
+ format(updatedDate, 'MMMM d, '),
19
+ format(updatedDate, 'h.mmaaa'))) : null));
20
+ };
21
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVXBkYXRlZFRpbWVzdGFtcC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9jb21wb25lbnRzL3VwZGF0ZWQtdGltZXN0YW1wL1VwZGF0ZWRUaW1lc3RhbXAudHN4Il0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sS0FBSyxNQUFNLE9BQU8sQ0FBQztBQUMxQixPQUFPLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSxFQUFFLG9CQUFvQixFQUFFLE1BQU0sVUFBVSxDQUFDO0FBRTdFLE9BQU8sRUFBRSxTQUFTLEVBQUUsZUFBZSxFQUFFLE1BQU0sVUFBVSxDQUFDO0FBRXRELE1BQU0sQ0FBQyxNQUFNLGdCQUFnQixHQUV4QixDQUFDLEVBQUUsV0FBVyxFQUFFLEVBQUUsRUFBRTtJQUN2QixJQUFJLENBQUMsV0FBVyxFQUFFO1FBQ2hCLE9BQU8sSUFBSSxDQUFDO0tBQ2I7SUFDRCxNQUFNLGVBQWUsR0FBRyxJQUFJLElBQUksRUFBRSxDQUFDO0lBQ25DLE1BQU0sV0FBVyxHQUFHLElBQUksSUFBSSxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBQzFDLE1BQU0sbUJBQW1CLEdBQ3ZCLG9CQUFvQixDQUFDLFdBQVcsRUFBRSxlQUFlLEVBQUU7UUFDakQsY0FBYyxFQUFFLE9BQU87S0FDeEIsQ0FBQyxHQUFHLE1BQU0sQ0FBQztJQUNkLE1BQU0sYUFBYSxHQUFHLG1CQUFtQixDQUFDLGVBQWUsRUFBRSxXQUFXLENBQUMsQ0FBQztJQUV4RSxNQUFNLGlCQUFpQixHQUFHLGFBQWEsR0FBRyxFQUFFLENBQUM7SUFDN0MsTUFBTSxpQkFBaUIsR0FBRyxhQUFhLEdBQUcsRUFBRSxHQUFHLEVBQUUsR0FBRyxFQUFFLENBQUM7SUFFdkQsT0FBTyxDQUNMLG9CQUFDLFNBQVMsUUFDUCxDQUFDLGlCQUFpQixJQUFJLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxDQUN6QyxvQkFBQyxlQUFlLG1CQUFhLHlCQUF5QixJQUNuRCxXQUFXLG1CQUFtQixFQUFFLENBQ2pCLENBQ25CLENBQUMsQ0FBQyxDQUFDLENBQUMsaUJBQWlCLENBQUMsQ0FBQyxDQUFDLENBQ3ZCLG9CQUFDLGVBQWUsbUJBQWEsaUJBQWlCO1FBQzNDLFVBQVU7UUFDVixNQUFNLENBQUMsV0FBVyxFQUFFLFVBQVUsQ0FBQztRQUMvQixNQUFNLENBQUMsV0FBVyxFQUFFLFNBQVMsQ0FBQyxDQUNmLENBQ25CLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FDRSxDQUNiLENBQUM7QUFDSixDQUFDLENBQUMifQ==
@@ -0,0 +1,13 @@
1
+ import React from 'react';
2
+ import { storiesOf } from '@storybook/react';
3
+ import { date } from '@storybook/addon-knobs';
4
+ import { UpdatedTimestamp } from './UpdatedTimestamp';
5
+ storiesOf('Typescript Component/Updated Timestamp', module).add('Updated Timestamp', () => {
6
+ const label = 'Updated Date/Time';
7
+ const defaultValue = new Date();
8
+ const groupId = 'Options';
9
+ const value = date(label, defaultValue, groupId);
10
+ const updated = new Date(value).toISOString();
11
+ return React.createElement(UpdatedTimestamp, { updatedTime: updated });
12
+ });
13
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVXBkYXRlZFRpbWVzdGFtcC5zdG9yaWVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdXBkYXRlZC10aW1lc3RhbXAvVXBkYXRlZFRpbWVzdGFtcC5zdG9yaWVzLnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEtBQUssTUFBTSxPQUFPLENBQUM7QUFDMUIsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGtCQUFrQixDQUFDO0FBQzdDLE9BQU8sRUFBRSxJQUFJLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUU5QyxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUV0RCxTQUFTLENBQUMsd0NBQXdDLEVBQUUsTUFBTSxDQUFDLENBQUMsR0FBRyxDQUM3RCxtQkFBbUIsRUFDbkIsR0FBRyxFQUFFO0lBQ0gsTUFBTSxLQUFLLEdBQUcsbUJBQW1CLENBQUM7SUFDbEMsTUFBTSxZQUFZLEdBQUcsSUFBSSxJQUFJLEVBQUUsQ0FBQztJQUNoQyxNQUFNLE9BQU8sR0FBRyxTQUFTLENBQUM7SUFDMUIsTUFBTSxLQUFLLEdBQUcsSUFBSSxDQUFDLEtBQUssRUFBRSxZQUFZLEVBQUUsT0FBTyxDQUFDLENBQUM7SUFDakQsTUFBTSxPQUFPLEdBQUcsSUFBSSxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsV0FBVyxFQUFFLENBQUM7SUFFOUMsT0FBTyxvQkFBQyxnQkFBZ0IsSUFBQyxXQUFXLEVBQUUsT0FBTyxHQUFJLENBQUM7QUFDcEQsQ0FBQyxDQUNGLENBQUMifQ==
@@ -0,0 +1 @@
1
+ import '@testing-library/jest-dom';
@@ -0,0 +1,34 @@
1
+ import React from 'react';
2
+ import { render } from '@testing-library/react';
3
+ import '@testing-library/jest-dom';
4
+ import { UpdatedTimestamp } from '../UpdatedTimestamp';
5
+ import MockDate from 'mockdate';
6
+ describe('UpdatedTimestamp', () => {
7
+ const updated = '2022-02-28T09:00:00Z';
8
+ afterEach(() => MockDate.reset());
9
+ it('does not show the timestamp within the first minute after the last update', () => {
10
+ MockDate.set('2022-02-28T09:00:00Z');
11
+ const { baseElement, queryByTestId } = render(React.createElement(UpdatedTimestamp, { updatedTime: updated }));
12
+ expect(baseElement).toMatchSnapshot();
13
+ expect(queryByTestId('MinutesHoursSinceUpdate')).toBeFalsy();
14
+ });
15
+ it('appears one minute after the last update', () => {
16
+ MockDate.set('2022-02-28T09:01:00Z');
17
+ const { queryByTestId } = render(React.createElement(UpdatedTimestamp, { updatedTime: updated }));
18
+ expect(queryByTestId('MinutesHoursSinceUpdate')).toBeTruthy();
19
+ expect(queryByTestId('MinutesHoursSinceUpdate').textContent).toBe('Updated 1 minute ago');
20
+ });
21
+ it('appears between 1 and 12 hours after the last update', () => {
22
+ MockDate.set('2022-02-28T11:30:00Z');
23
+ const { queryByTestId } = render(React.createElement(UpdatedTimestamp, { updatedTime: updated }));
24
+ expect(queryByTestId('MinutesHoursSinceUpdate')).toBeTruthy();
25
+ expect(queryByTestId('MinutesHoursSinceUpdate').textContent).toBe('Updated 2 hours ago');
26
+ });
27
+ it('shows the date and time of update 13 hours or more after the last update', () => {
28
+ MockDate.set('2022-02-28T23:30:00Z');
29
+ const { queryByTestId } = render(React.createElement(UpdatedTimestamp, { updatedTime: updated }));
30
+ expect(queryByTestId('DateTimeUpdated')).toBeTruthy();
31
+ expect(queryByTestId('DateTimeUpdated').textContent).toBe('Updated February 28, 9.00am');
32
+ });
33
+ });
34
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVXBkYXRlZFRpbWVzdGFtcC50ZXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdXBkYXRlZC10aW1lc3RhbXAvX190ZXN0c19fL1VwZGF0ZWRUaW1lc3RhbXAudGVzdC50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxNQUFNLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUNoRCxPQUFPLDJCQUEyQixDQUFDO0FBRW5DLE9BQU8sRUFBRSxnQkFBZ0IsRUFBRSxNQUFNLHFCQUFxQixDQUFDO0FBQ3ZELE9BQU8sUUFBUSxNQUFNLFVBQVUsQ0FBQztBQUVoQyxRQUFRLENBQUMsa0JBQWtCLEVBQUUsR0FBRyxFQUFFO0lBQ2hDLE1BQU0sT0FBTyxHQUFHLHNCQUFzQixDQUFDO0lBQ3ZDLFNBQVMsQ0FBQyxHQUFHLEVBQUUsQ0FBQyxRQUFRLENBQUMsS0FBSyxFQUFFLENBQUMsQ0FBQztJQUVsQyxFQUFFLENBQUMsMkVBQTJFLEVBQUUsR0FBRyxFQUFFO1FBQ25GLFFBQVEsQ0FBQyxHQUFHLENBQUMsc0JBQXNCLENBQUMsQ0FBQztRQUNyQyxNQUFNLEVBQUUsV0FBVyxFQUFFLGFBQWEsRUFBRSxHQUFHLE1BQU0sQ0FDM0Msb0JBQUMsZ0JBQWdCLElBQUMsV0FBVyxFQUFFLE9BQU8sR0FBSSxDQUMzQyxDQUFDO1FBQ0YsTUFBTSxDQUFDLFdBQVcsQ0FBQyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBQ3RDLE1BQU0sQ0FBQyxhQUFhLENBQUMseUJBQXlCLENBQUMsQ0FBQyxDQUFDLFNBQVMsRUFBRSxDQUFDO0lBQy9ELENBQUMsQ0FBQyxDQUFDO0lBQ0gsRUFBRSxDQUFDLDBDQUEwQyxFQUFFLEdBQUcsRUFBRTtRQUNsRCxRQUFRLENBQUMsR0FBRyxDQUFDLHNCQUFzQixDQUFDLENBQUM7UUFDckMsTUFBTSxFQUFFLGFBQWEsRUFBRSxHQUFHLE1BQU0sQ0FDOUIsb0JBQUMsZ0JBQWdCLElBQUMsV0FBVyxFQUFFLE9BQU8sR0FBSSxDQUMzQyxDQUFDO1FBQ0YsTUFBTSxDQUFDLGFBQWEsQ0FBQyx5QkFBeUIsQ0FBQyxDQUFDLENBQUMsVUFBVSxFQUFFLENBQUM7UUFDOUQsTUFBTSxDQUFDLGFBQWEsQ0FBQyx5QkFBeUIsQ0FBRSxDQUFDLFdBQVcsQ0FBQyxDQUFDLElBQUksQ0FDaEUsc0JBQXNCLENBQ3ZCLENBQUM7SUFDSixDQUFDLENBQUMsQ0FBQztJQUNILEVBQUUsQ0FBQyxzREFBc0QsRUFBRSxHQUFHLEVBQUU7UUFDOUQsUUFBUSxDQUFDLEdBQUcsQ0FBQyxzQkFBc0IsQ0FBQyxDQUFDO1FBQ3JDLE1BQU0sRUFBRSxhQUFhLEVBQUUsR0FBRyxNQUFNLENBQzlCLG9CQUFDLGdCQUFnQixJQUFDLFdBQVcsRUFBRSxPQUFPLEdBQUksQ0FDM0MsQ0FBQztRQUNGLE1BQU0sQ0FBQyxhQUFhLENBQUMseUJBQXlCLENBQUMsQ0FBQyxDQUFDLFVBQVUsRUFBRSxDQUFDO1FBQzlELE1BQU0sQ0FBQyxhQUFhLENBQUMseUJBQXlCLENBQUUsQ0FBQyxXQUFXLENBQUMsQ0FBQyxJQUFJLENBQ2hFLHFCQUFxQixDQUN0QixDQUFDO0lBQ0osQ0FBQyxDQUFDLENBQUM7SUFDSCxFQUFFLENBQUMsMEVBQTBFLEVBQUUsR0FBRyxFQUFFO1FBQ2xGLFFBQVEsQ0FBQyxHQUFHLENBQUMsc0JBQXNCLENBQUMsQ0FBQztRQUNyQyxNQUFNLEVBQUUsYUFBYSxFQUFFLEdBQUcsTUFBTSxDQUM5QixvQkFBQyxnQkFBZ0IsSUFBQyxXQUFXLEVBQUUsT0FBTyxHQUFJLENBQzNDLENBQUM7UUFDRixNQUFNLENBQUMsYUFBYSxDQUFDLGlCQUFpQixDQUFDLENBQUMsQ0FBQyxVQUFVLEVBQUUsQ0FBQztRQUN0RCxNQUFNLENBQUMsYUFBYSxDQUFDLGlCQUFpQixDQUFFLENBQUMsV0FBVyxDQUFDLENBQUMsSUFBSSxDQUN4RCw2QkFBNkIsQ0FDOUIsQ0FBQztJQUNKLENBQUMsQ0FBQyxDQUFDO0FBQ0wsQ0FBQyxDQUFDLENBQUMifQ==
@@ -0,0 +1,2 @@
1
+ export declare const Container: import("styled-components").StyledComponent<"div", any, {}, never>;
2
+ export declare const TimeSinceUpdate: import("styled-components").StyledComponent<"div", any, {}, never>;
@@ -0,0 +1,14 @@
1
+ import styled from 'styled-components';
2
+ import { colours, fonts } from '@times-components/styleguide';
3
+ export const Container = styled.div `
4
+ display: flex;
5
+ flex-direction: column;
6
+ padding: 3px 0 0 8px;
7
+ `;
8
+ export const TimeSinceUpdate = styled.div `
9
+ color: ${colours.functional.primary};
10
+ font-family: ${fonts.supporting};
11
+ font-size: 12px;
12
+ line-height: 16px;
13
+ `;
14
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic3R5bGVzLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vc3JjL2NvbXBvbmVudHMvdXBkYXRlZC10aW1lc3RhbXAvc3R5bGVzLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sTUFBTSxNQUFNLG1CQUFtQixDQUFDO0FBQ3ZDLE9BQU8sRUFBRSxPQUFPLEVBQUUsS0FBSyxFQUFFLE1BQU0sOEJBQThCLENBQUM7QUFFOUQsTUFBTSxDQUFDLE1BQU0sU0FBUyxHQUFHLE1BQU0sQ0FBQyxHQUFHLENBQUE7Ozs7Q0FJbEMsQ0FBQztBQUVGLE1BQU0sQ0FBQyxNQUFNLGVBQWUsR0FBRyxNQUFNLENBQUMsR0FBRyxDQUFBO1dBQzlCLE9BQU8sQ0FBQyxVQUFVLENBQUMsT0FBTztpQkFDcEIsS0FBSyxDQUFDLFVBQVU7OztDQUdoQyxDQUFDIn0=
@@ -0,0 +1,5 @@
1
+ import React from 'react';
2
+ export declare const UpdatedTimeProvider: React.FC<{
3
+ updatedTime: string;
4
+ }>;
5
+ export declare const useUpdatedTime: () => string | undefined;
@@ -0,0 +1,9 @@
1
+ import React, { createContext, useContext } from 'react';
2
+ const UpdatedTimeProviderContext = createContext(undefined);
3
+ export const UpdatedTimeProvider = ({ updatedTime, children }) => {
4
+ return (React.createElement(UpdatedTimeProviderContext.Provider, { value: updatedTime }, children));
5
+ };
6
+ export const useUpdatedTime = () => {
7
+ return useContext(UpdatedTimeProviderContext);
8
+ };
9
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVXBkYXRlZFRpbWVQcm92aWRlci5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9oZWxwZXJzL3RpbWUvVXBkYXRlZFRpbWVQcm92aWRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxLQUFLLEVBQUUsRUFBRSxhQUFhLEVBQUUsVUFBVSxFQUFFLE1BQU0sT0FBTyxDQUFDO0FBRXpELE1BQU0sMEJBQTBCLEdBQUcsYUFBYSxDQUFxQixTQUFTLENBQUMsQ0FBQztBQUVoRixNQUFNLENBQUMsTUFBTSxtQkFBbUIsR0FFM0IsQ0FBQyxFQUFFLFdBQVcsRUFBRSxRQUFRLEVBQUUsRUFBRSxFQUFFO0lBQ2pDLE9BQU8sQ0FDTCxvQkFBQywwQkFBMEIsQ0FBQyxRQUFRLElBQUMsS0FBSyxFQUFFLFdBQVcsSUFDcEQsUUFBUSxDQUMyQixDQUN2QyxDQUFDO0FBQ0osQ0FBQyxDQUFDO0FBRUYsTUFBTSxDQUFDLE1BQU0sY0FBYyxHQUFHLEdBQUcsRUFBRTtJQUNqQyxPQUFPLFVBQVUsQ0FBQywwQkFBMEIsQ0FBQyxDQUFDO0FBQ2hELENBQUMsQ0FBQyJ9
@@ -0,0 +1 @@
1
+ import 'regenerator-runtime';
@@ -0,0 +1,17 @@
1
+ import { render } from '@testing-library/react';
2
+ import React from 'react';
3
+ import { useUpdatedTime, UpdatedTimeProvider } from '../UpdatedTimeProvider';
4
+ import 'regenerator-runtime';
5
+ const TestComponent = () => {
6
+ const updatedTime = useUpdatedTime();
7
+ return React.createElement(React.Fragment, null, updatedTime);
8
+ };
9
+ describe('UpdatedTimeProvider', () => {
10
+ it('should pass the updated time to the context value', () => {
11
+ const updatedTime = '2022-03-01T09:00:00.000Z';
12
+ const { findByText } = render(React.createElement(UpdatedTimeProvider, { updatedTime: updatedTime },
13
+ React.createElement(TestComponent, null)));
14
+ findByText(updatedTime);
15
+ });
16
+ });
17
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiVXBkYXRlZFRpbWVQcm92aWRlci50ZXN0LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vc3JjL2hlbHBlcnMvdGltZS9fX3Rlc3RzX18vVXBkYXRlZFRpbWVQcm92aWRlci50ZXN0LnRzeCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsTUFBTSxFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDaEQsT0FBTyxLQUFLLE1BQU0sT0FBTyxDQUFDO0FBQzFCLE9BQU8sRUFBRSxjQUFjLEVBQUUsbUJBQW1CLEVBQUUsTUFBTSx3QkFBd0IsQ0FBQztBQUM3RSxPQUFPLHFCQUFxQixDQUFDO0FBRTdCLE1BQU0sYUFBYSxHQUFHLEdBQUcsRUFBRTtJQUN6QixNQUFNLFdBQVcsR0FBRyxjQUFjLEVBQUUsQ0FBQztJQUNyQyxPQUFPLDBDQUFHLFdBQVcsQ0FBSSxDQUFDO0FBQzVCLENBQUMsQ0FBQztBQUVGLFFBQVEsQ0FBQyxxQkFBcUIsRUFBRSxHQUFHLEVBQUU7SUFDbkMsRUFBRSxDQUFDLG1EQUFtRCxFQUFFLEdBQUcsRUFBRTtRQUMzRCxNQUFNLFdBQVcsR0FBRywwQkFBMEIsQ0FBQztRQUUvQyxNQUFNLEVBQUUsVUFBVSxFQUFFLEdBQUcsTUFBTSxDQUMzQixvQkFBQyxtQkFBbUIsSUFBQyxXQUFXLEVBQUUsV0FBVztZQUMzQyxvQkFBQyxhQUFhLE9BQUcsQ0FDRyxDQUN2QixDQUFDO1FBRUYsVUFBVSxDQUFDLFdBQVcsQ0FBQyxDQUFDO0lBQzFCLENBQUMsQ0FBQyxDQUFDO0FBQ0wsQ0FBQyxDQUFDLENBQUMifQ==
package/dist/index.d.ts CHANGED
@@ -26,4 +26,6 @@ export { HiddenDiv } from './components/common-styles';
26
26
  export { InlineMessage } from './components/inline-message/InlineMessage';
27
27
  export { InlineDialog } from './components/inline-dialog/InlineDialog';
28
28
  export { default as ArticleHeader } from './components/article-header/ArticleHeader';
29
+ export { UpdatedTimestamp } from './components/updated-timestamp/UpdatedTimestamp';
30
+ export { UpdatedTimeProvider } from './helpers/time/UpdatedTimeProvider';
29
31
  export { default as safeDecodeURIComponent } from './utils/safeDecodeURIComponent';
package/dist/index.js CHANGED
@@ -32,5 +32,7 @@ export { HiddenDiv } from './components/common-styles';
32
32
  export { InlineMessage } from './components/inline-message/InlineMessage';
33
33
  export { InlineDialog } from './components/inline-dialog/InlineDialog';
34
34
  export { default as ArticleHeader } from './components/article-header/ArticleHeader';
35
+ export { UpdatedTimestamp } from './components/updated-timestamp/UpdatedTimestamp';
36
+ export { UpdatedTimeProvider } from './helpers/time/UpdatedTimeProvider';
35
37
  export { default as safeDecodeURIComponent } from './utils/safeDecodeURIComponent';
36
- //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEscUJBQXFCO0FBQ3JCLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUMzRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDdEUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHVDQUF1QyxDQUFDO0FBQ3hFLE9BQU8sRUFDTCxvQkFBb0IsRUFDckIsTUFBTSxxRUFBcUUsQ0FBQztBQUM3RSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZ0RBQWdELENBQUM7QUFDNUUsT0FBTyxFQUNMLG1CQUFtQixFQUNuQixlQUFlLEVBQ2hCLE1BQU0sMkNBQTJDLENBQUM7QUFDbkQsT0FBTyxFQUNMLFdBQVcsRUFDWCxZQUFZLEVBQ1osY0FBYyxFQUNkLGtCQUFrQixFQUNsQixvQkFBb0IsRUFDcEIsb0JBQW9CLEVBQ3BCLG1CQUFtQixFQUNwQixNQUFNLHVDQUF1QyxDQUFDO0FBRS9DLHdCQUF3QjtBQUN4QixPQUFPLEVBQ0wsa0JBQWtCLEVBQ25CLE1BQU0saURBQWlELENBQUM7QUFDekQsT0FBTyxFQUNMLG9CQUFvQixFQUNyQixNQUFNLG1EQUFtRCxDQUFDO0FBQzNELE9BQU8sRUFDTCxxQkFBcUIsRUFDdEIsTUFBTSxvREFBb0QsQ0FBQztBQUU1RCxtQkFBbUI7QUFDbkIsT0FBTyxFQUNMLG9CQUFvQixFQUNyQixNQUFNLDBEQUEwRCxDQUFDO0FBQ2xFLE9BQU8sRUFDTCxxQkFBcUIsRUFDdEIsTUFBTSw0REFBNEQsQ0FBQztBQUNwRSxPQUFPLEVBQ0wsbUJBQW1CLEVBQ3BCLE1BQU0sd0RBQXdELENBQUM7QUFDaEUsT0FBTyxFQUNMLHNCQUFzQixFQUN2QixNQUFNLCtEQUErRCxDQUFDO0FBQ3ZFLE9BQU8sRUFDTCxrQkFBa0IsRUFDbkIsTUFBTSxzREFBc0QsQ0FBQztBQUM5RCxPQUFPLEVBQ0wsZ0JBQWdCLEVBQ2pCLE1BQU0saURBQWlELENBQUM7QUFFekQsNkJBQTZCO0FBQzdCLE9BQU8sRUFDTCxtQkFBbUIsRUFDcEIsTUFBTSx3REFBd0QsQ0FBQztBQUNoRSxPQUFPLEVBQ0wsaUJBQWlCLEVBQ2xCLE1BQU0sb0RBQW9ELENBQUM7QUFDNUQsT0FBTyxFQUNMLHdCQUF3QixFQUN6QixNQUFNLG1FQUFtRSxDQUFDO0FBQzNFLHlCQUF5QjtBQUN6QixPQUFPLEVBQ0wscUJBQXFCLEVBQ3RCLE1BQU0scURBQXFELENBQUM7QUFFN0QsVUFBVTtBQUNWLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUM5RCxPQUFPLEVBQ0wsZ0JBQWdCLEVBQ2pCLE1BQU0sK0NBQStDLENBQUM7QUFDdkQsT0FBTyxFQUNMLHVCQUF1QixFQUN4QixNQUFNLDRDQUE0QyxDQUFDO0FBQ3BELE9BQU8sRUFDTCxxQkFBcUIsRUFDckIsZ0JBQWdCLEVBQ2pCLE1BQU0seUNBQXlDLENBQUM7QUFDakQsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBRXZELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwyQ0FBMkMsQ0FBQztBQUUxRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0seUNBQXlDLENBQUM7QUFFdkUsT0FBTyxFQUNMLE9BQU8sSUFBSSxhQUFhLEVBQ3pCLE1BQU0sMkNBQTJDLENBQUM7QUFFbkQsT0FBTyxFQUNMLE9BQU8sSUFBSSxzQkFBc0IsRUFDbEMsTUFBTSxnQ0FBZ0MsQ0FBQyJ9
38
+ //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi9zcmMvaW5kZXgudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEscUJBQXFCO0FBQ3JCLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSw0Q0FBNEMsQ0FBQztBQUMzRSxPQUFPLEVBQUUsUUFBUSxFQUFFLE1BQU0sNENBQTRDLENBQUM7QUFDdEUsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLHVDQUF1QyxDQUFDO0FBQ3hFLE9BQU8sRUFDTCxvQkFBb0IsRUFDckIsTUFBTSxxRUFBcUUsQ0FBQztBQUM3RSxPQUFPLEVBQUUsVUFBVSxFQUFFLE1BQU0sZ0RBQWdELENBQUM7QUFDNUUsT0FBTyxFQUNMLG1CQUFtQixFQUNuQixlQUFlLEVBQ2hCLE1BQU0sMkNBQTJDLENBQUM7QUFDbkQsT0FBTyxFQUNMLFdBQVcsRUFDWCxZQUFZLEVBQ1osY0FBYyxFQUNkLGtCQUFrQixFQUNsQixvQkFBb0IsRUFDcEIsb0JBQW9CLEVBQ3BCLG1CQUFtQixFQUNwQixNQUFNLHVDQUF1QyxDQUFDO0FBRS9DLHdCQUF3QjtBQUN4QixPQUFPLEVBQ0wsa0JBQWtCLEVBQ25CLE1BQU0saURBQWlELENBQUM7QUFDekQsT0FBTyxFQUNMLG9CQUFvQixFQUNyQixNQUFNLG1EQUFtRCxDQUFDO0FBQzNELE9BQU8sRUFDTCxxQkFBcUIsRUFDdEIsTUFBTSxvREFBb0QsQ0FBQztBQUU1RCxtQkFBbUI7QUFDbkIsT0FBTyxFQUNMLG9CQUFvQixFQUNyQixNQUFNLDBEQUEwRCxDQUFDO0FBQ2xFLE9BQU8sRUFDTCxxQkFBcUIsRUFDdEIsTUFBTSw0REFBNEQsQ0FBQztBQUNwRSxPQUFPLEVBQ0wsbUJBQW1CLEVBQ3BCLE1BQU0sd0RBQXdELENBQUM7QUFDaEUsT0FBTyxFQUNMLHNCQUFzQixFQUN2QixNQUFNLCtEQUErRCxDQUFDO0FBQ3ZFLE9BQU8sRUFDTCxrQkFBa0IsRUFDbkIsTUFBTSxzREFBc0QsQ0FBQztBQUM5RCxPQUFPLEVBQ0wsZ0JBQWdCLEVBQ2pCLE1BQU0saURBQWlELENBQUM7QUFFekQsNkJBQTZCO0FBQzdCLE9BQU8sRUFDTCxtQkFBbUIsRUFDcEIsTUFBTSx3REFBd0QsQ0FBQztBQUNoRSxPQUFPLEVBQ0wsaUJBQWlCLEVBQ2xCLE1BQU0sb0RBQW9ELENBQUM7QUFDNUQsT0FBTyxFQUNMLHdCQUF3QixFQUN6QixNQUFNLG1FQUFtRSxDQUFDO0FBQzNFLHlCQUF5QjtBQUN6QixPQUFPLEVBQ0wscUJBQXFCLEVBQ3RCLE1BQU0scURBQXFELENBQUM7QUFFN0QsVUFBVTtBQUNWLE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwrQkFBK0IsQ0FBQztBQUM5RCxPQUFPLEVBQ0wsZ0JBQWdCLEVBQ2pCLE1BQU0sK0NBQStDLENBQUM7QUFDdkQsT0FBTyxFQUNMLHVCQUF1QixFQUN4QixNQUFNLDRDQUE0QyxDQUFDO0FBQ3BELE9BQU8sRUFDTCxxQkFBcUIsRUFDckIsZ0JBQWdCLEVBQ2pCLE1BQU0seUNBQXlDLENBQUM7QUFDakQsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLDRCQUE0QixDQUFDO0FBRXZELE9BQU8sRUFBRSxhQUFhLEVBQUUsTUFBTSwyQ0FBMkMsQ0FBQztBQUUxRSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0seUNBQXlDLENBQUM7QUFFdkUsT0FBTyxFQUNMLE9BQU8sSUFBSSxhQUFhLEVBQ3pCLE1BQU0sMkNBQTJDLENBQUM7QUFFbkQsT0FBTyxFQUNMLGdCQUFnQixFQUNqQixNQUFNLGlEQUFpRCxDQUFDO0FBRXpELE9BQU8sRUFBRSxtQkFBbUIsRUFBRSxNQUFNLG9DQUFvQyxDQUFDO0FBRXpFLE9BQU8sRUFDTCxPQUFPLElBQUksc0JBQXNCLEVBQ2xDLE1BQU0sZ0NBQWdDLENBQUMifQ==
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@times-components/ts-components",
3
- "version": "1.21.0",
3
+ "version": "1.22.0",
4
4
  "description": "Reuseable Typescript React Components",
5
5
  "main": "dist/index.js",
6
6
  "dev": "dist/index.js",
@@ -55,9 +55,9 @@
55
55
  "@times-components/icons": "2.16.10",
56
56
  "@times-components/image": "6.8.15",
57
57
  "@times-components/link": "3.6.51",
58
- "@times-components/provider": "1.29.4",
58
+ "@times-components/provider": "1.30.0",
59
59
  "@times-components/provider-queries": "2.15.3",
60
- "@times-components/related-articles": "6.6.38",
60
+ "@times-components/related-articles": "6.6.39",
61
61
  "@times-components/styleguide": "3.38.29",
62
62
  "@times-components/ts-slices": "1.3.0",
63
63
  "@times-components/utils": "6.5.13",
@@ -81,7 +81,7 @@
81
81
  "@storybook/react": "5.3.18",
82
82
  "@testing-library/jest-dom": "^5.12.0",
83
83
  "@testing-library/react": "^12.1.2",
84
- "@times-components/provider-test-tools": "1.22.3",
84
+ "@times-components/provider-test-tools": "1.23.0",
85
85
  "@times-components/storybook": "4.1.73",
86
86
  "@times-components/test-utils": "2.3.10",
87
87
  "@types/graphql": "14.0.3",
@@ -117,5 +117,5 @@
117
117
  "@testing-library/jest-dom/extend-expect"
118
118
  ]
119
119
  },
120
- "gitHead": "7c80cf2914a82f0a4d23f827f6947a4d208405d3"
120
+ "gitHead": "02df6419719c8e72b887ae8acd6d5c7a06d40a79"
121
121
  }