@financial-times/cp-content-pipeline-ui 7.8.2 → 7.9.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 +14 -0
- package/lib/components/LiveBlogPost/ShareLinkButton.d.ts +7 -0
- package/lib/components/LiveBlogPost/ShareLinkButton.js +29 -0
- package/lib/components/LiveBlogPost/ShareLinkButton.js.map +1 -0
- package/lib/components/LiveBlogPost/index.d.ts +1 -0
- package/lib/components/LiveBlogPost/index.js +4 -2
- package/lib/components/LiveBlogPost/index.js.map +1 -1
- package/lib/components/LiveBlogPost/test/index.spec.d.ts +1 -0
- package/lib/components/LiveBlogPost/test/index.spec.js +69 -0
- package/lib/components/LiveBlogPost/test/index.spec.js.map +1 -0
- package/lib/components/LiveBlogWrapper/index.js +2 -2
- package/lib/components/LiveBlogWrapper/index.js.map +1 -1
- package/lib/components/LiveBlogWrapper/test/index.spec.js +2 -0
- package/lib/components/LiveBlogWrapper/test/index.spec.js.map +1 -1
- package/lib/components/body-components/LiveBlogBody/index.js +2 -2
- package/lib/components/body-components/LiveBlogBody/index.js.map +1 -1
- package/lib/stories/LiveBlogPost.stories.js +1 -0
- package/lib/stories/LiveBlogPost.stories.js.map +1 -1
- package/package.json +1 -1
- package/src/components/LiveBlogPost/ShareLinkButton.tsx +46 -0
- package/src/components/LiveBlogPost/index.tsx +7 -0
- package/src/components/LiveBlogPost/test/index.spec.tsx +89 -0
- package/src/components/LiveBlogWrapper/index.tsx +3 -0
- package/src/components/LiveBlogWrapper/test/index.spec.tsx +2 -0
- package/src/components/body-components/LiveBlogBody/index.tsx +2 -0
- package/src/components/content-tree/Clip/client/main.scss +3 -3
- package/src/stories/LiveBlogPost.stories.tsx +1 -0
- package/tsconfig.tsbuildinfo +1 -1
package/CHANGELOG.md
CHANGED
|
@@ -574,6 +574,20 @@
|
|
|
574
574
|
* @financial-times/cp-content-pipeline-client bumped from ^3.7.2 to ^3.7.3
|
|
575
575
|
* @financial-times/cp-content-pipeline-schema bumped from ^2.10.1 to ^2.10.2
|
|
576
576
|
|
|
577
|
+
## [7.9.0](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v7.8.3...cp-content-pipeline-ui-v7.9.0) (2024-12-19)
|
|
578
|
+
|
|
579
|
+
|
|
580
|
+
### Features
|
|
581
|
+
|
|
582
|
+
* add simplified sharing to live blog posts ([8b4f23b](https://github.com/Financial-Times/cp-content-pipeline/commit/8b4f23b98fcc5fe63de660098a277c17bf626f70))
|
|
583
|
+
|
|
584
|
+
## [7.8.3](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v7.8.2...cp-content-pipeline-ui-v7.8.3) (2024-12-09)
|
|
585
|
+
|
|
586
|
+
|
|
587
|
+
### Bug Fixes
|
|
588
|
+
|
|
589
|
+
* clip play icon position with latest icons ([096e93c](https://github.com/Financial-Times/cp-content-pipeline/commit/096e93cf10ca8b04bf8f370c542bbdc1fbac6468))
|
|
590
|
+
|
|
577
591
|
## [7.8.2](https://github.com/Financial-Times/cp-content-pipeline/compare/cp-content-pipeline-ui-v7.8.1...cp-content-pipeline-ui-v7.8.2) (2024-12-09)
|
|
578
592
|
|
|
579
593
|
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = __importDefault(require("react"));
|
|
7
|
+
const ShareLinkButton = ({ postId, articleUrl, }) => {
|
|
8
|
+
const copyUrl = async (e) => {
|
|
9
|
+
const wrapper = e.currentTarget.closest('.x-live-blog-post__link-container');
|
|
10
|
+
wrapper?.setAttribute('data-tooltip', 'show');
|
|
11
|
+
if (typeof window !== 'undefined' && navigator.clipboard) {
|
|
12
|
+
const postUrl = articleUrl ? new URL(articleUrl) : null;
|
|
13
|
+
if (postUrl) {
|
|
14
|
+
postUrl.searchParams.append('feature', 'blog-post-sharing');
|
|
15
|
+
postUrl.hash = `post-${postId}`;
|
|
16
|
+
}
|
|
17
|
+
await navigator.clipboard.writeText(postUrl?.toString() ?? '');
|
|
18
|
+
}
|
|
19
|
+
setTimeout(() => {
|
|
20
|
+
wrapper?.setAttribute('data-tooltip', 'hide');
|
|
21
|
+
}, 8000);
|
|
22
|
+
};
|
|
23
|
+
return (react_1.default.createElement("div", { className: "x-live-blog-post__link-container", "data-tooltip": "hide" },
|
|
24
|
+
react_1.default.createElement("span", { className: "x-live-blog-post__link-copied-message" }, "Link copied"),
|
|
25
|
+
react_1.default.createElement("button", { className: "x-live-blog-post__link-icon", "data-component": "share-link-button", "aria-label": "Share link", "data-trackable": "share-link", title: "Link", onClick: copyUrl }),
|
|
26
|
+
react_1.default.createElement("span", null, "Link")));
|
|
27
|
+
};
|
|
28
|
+
exports.default = ShareLinkButton;
|
|
29
|
+
//# sourceMappingURL=ShareLinkButton.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ShareLinkButton.js","sourceRoot":"","sources":["../../../src/components/LiveBlogPost/ShareLinkButton.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AAOzB,MAAM,eAAe,GAAmC,CAAC,EACvD,MAAM,EACN,UAAU,GACX,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,KAAK,EAAE,CAAsC,EAAE,EAAE;QAC/D,MAAM,OAAO,GAAG,CAAC,CAAC,aAAa,CAAC,OAAO,CAAC,mCAAmC,CAAC,CAAA;QAE5E,OAAO,EAAE,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAA;QAE7C,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,SAAS,CAAC,SAAS,EAAE,CAAC;YACzD,MAAM,OAAO,GAAG,UAAU,CAAC,CAAC,CAAC,IAAI,GAAG,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;YACvD,IAAI,OAAO,EAAE,CAAC;gBACZ,OAAO,CAAC,YAAY,CAAC,MAAM,CAAC,SAAS,EAAE,mBAAmB,CAAC,CAAA;gBAC3D,OAAO,CAAC,IAAI,GAAG,QAAQ,MAAM,EAAE,CAAA;YACjC,CAAC;YACD,MAAM,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,OAAO,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAA;QAChE,CAAC;QACD,UAAU,CAAC,GAAG,EAAE;YACd,OAAO,EAAE,YAAY,CAAC,cAAc,EAAE,MAAM,CAAC,CAAA;QAC/C,CAAC,EAAE,IAAI,CAAC,CAAA;IACV,CAAC,CAAA;IAED,OAAO,CACL,uCAAK,SAAS,EAAC,kCAAkC,kBAAc,MAAM;QACnE,wCAAM,SAAS,EAAC,uCAAuC,kBAAmB;QAC1E,0CACE,SAAS,EAAC,6BAA6B,oBACxB,mBAAmB,gBACvB,YAAY,oBACR,YAAY,EAC3B,KAAK,EAAC,MAAM,EACZ,OAAO,EAAE,OAAO,GAChB;QACF,mDAAiB,CACb,CACP,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,eAAe,CAAA"}
|
|
@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
exports.LiveBlogPost = void 0;
|
|
7
7
|
const react_1 = __importDefault(require("react"));
|
|
8
8
|
const ShareButtons_1 = __importDefault(require("./ShareButtons"));
|
|
9
|
+
const ShareLinkButton_1 = __importDefault(require("./ShareLinkButton"));
|
|
9
10
|
const Timestamp_1 = __importDefault(require("./Timestamp"));
|
|
10
11
|
const RichText_1 = __importDefault(require("../RichText"));
|
|
11
12
|
const Expander_1 = __importDefault(require("../Expander"));
|
|
@@ -38,7 +39,7 @@ bodyHTML, //ElasticSearch
|
|
|
38
39
|
body, // cp-content-pipeline
|
|
39
40
|
publishedTimestamp, // Remove once wordpress is no longer in use
|
|
40
41
|
publishedDate, isBreakingNews, // Remove once wordpress is no longer in use
|
|
41
|
-
standout = {}, articleUrl, showShareButtons = false, byline, ad, isPinned, indicators = {}, authors, }) => {
|
|
42
|
+
standout = {}, articleUrl, showShareButtons = false, showShareLinkButton = false, byline, ad, isPinned, indicators = {}, authors, }) => {
|
|
42
43
|
const showBreakingNewsLabel = standout.breakingNews || isBreakingNews;
|
|
43
44
|
let postBody;
|
|
44
45
|
if (body && 'structured' in body) {
|
|
@@ -72,7 +73,8 @@ standout = {}, articleUrl, showShareButtons = false, byline, ad, isPinned, indic
|
|
|
72
73
|
react_1.default.createElement("span", null,
|
|
73
74
|
react_1.default.createElement(Timestamp_1.default, { publishedTimestamp: publishedDate || publishedTimestamp, textCase: "sentence" }))),
|
|
74
75
|
react_1.default.createElement("div", { className: "x-live-blog-post__byline" },
|
|
75
|
-
react_1.default.createElement(Byline_1.default, { structuredContent: byline, showEditedBy: false })))
|
|
76
|
+
react_1.default.createElement(Byline_1.default, { structuredContent: byline, showEditedBy: false }))),
|
|
77
|
+
showShareLinkButton && (react_1.default.createElement(ShareLinkButton_1.default, { postId: id || postId, articleUrl: articleUrl }))),
|
|
76
78
|
showBreakingNewsLabel && (react_1.default.createElement("div", { className: "x-live-blog-post__breaking-news" }, "Breaking news")),
|
|
77
79
|
title && react_1.default.createElement("h2", { className: "x-live-blog-post__title" }, title),
|
|
78
80
|
postBody,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LiveBlogPost/index.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAAyB;AACzB,kEAAyC;AACzC,4DAAmC;AACnC,2DAAkC;AAClC,2DAAkC;AAClC,4DAAmC;AACnC,2DAAkC;AAClC,uDAA8B;AAW9B,MAAM,aAAa,GAAsD,CAAC,EACxE,EAAE,EACF,QAAQ,GACT,EAAE,EAAE;IACH,OAAO,CACL,yDACiB,gBAAgB,iCACF,EAAE,6BACP,WAAW,EACnC,SAAS,EAAC,qDAAqD;QAE/D,8BAAC,kBAAQ,IACP,WAAW,EAAC,aAAa,EACzB,aAAa,EAAC,eAAe,EAC7B,UAAU,EAAE,IAAI,EAChB,EAAE,EAAE,aAAa,EAAE,EAAE,IAEpB,QAAQ,CACA,CACP,CACP,CAAA;AACH,CAAC,CAAA;AAED,MAAM,iBAAiB,GAAG,GAAG,EAAE;IAC7B,MAAM,MAAM,GAAG,2BAA2B,CAAA;IAC1C,MAAM,SAAS,GAAG;QAChB,GAAG;QACH,YAAY;QACZ,IAAI;QACJ,oBAAoB;QACpB,sCAAsC;QACtC,2BAA2B;QAC3B,uBAAuB;QACvB,IAAI;QACJ,kBAAkB;QAClB,+BAA+B;KAChC,CAAA;IACD,OAAO,SAAS,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,GAAG,MAAM,IAAI,IAAI,EAAE,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAA;AAC/D,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LiveBlogPost/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export {};
|
|
@@ -0,0 +1,69 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
+
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
+
};
|
|
5
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
+
const react_1 = __importDefault(require("react"));
|
|
7
|
+
const react_2 = require("@testing-library/react");
|
|
8
|
+
const ShareLinkButton_1 = __importDefault(require("../ShareLinkButton"));
|
|
9
|
+
const mockClipboardWrite = jest.fn(() => Promise.resolve());
|
|
10
|
+
Object.defineProperty(navigator, 'clipboard', {
|
|
11
|
+
value: { writeText: mockClipboardWrite },
|
|
12
|
+
configurable: true,
|
|
13
|
+
});
|
|
14
|
+
describe('Share Link button', () => {
|
|
15
|
+
const defaultProps = {
|
|
16
|
+
postId: '0cb263ac-3843-4a22-976a-fcee9b8ba7de',
|
|
17
|
+
articleUrl: 'https://ft.com/content/e46f26ed-27d1-4291-9709-e1031ba7e781',
|
|
18
|
+
};
|
|
19
|
+
beforeEach(() => {
|
|
20
|
+
mockClipboardWrite.mockClear();
|
|
21
|
+
jest.useFakeTimers();
|
|
22
|
+
});
|
|
23
|
+
afterEach(() => {
|
|
24
|
+
jest.runOnlyPendingTimers();
|
|
25
|
+
jest.useRealTimers();
|
|
26
|
+
});
|
|
27
|
+
it('should render share link button', () => {
|
|
28
|
+
const { container } = (0, react_2.render)(react_1.default.createElement(ShareLinkButton_1.default, { ...defaultProps }));
|
|
29
|
+
expect(container.querySelector('button[data-component="share-link-button"]')).toBeTruthy();
|
|
30
|
+
});
|
|
31
|
+
it('should construct the correct URL with query parameter and post hash', async () => {
|
|
32
|
+
const { container } = (0, react_2.render)(react_1.default.createElement(ShareLinkButton_1.default, { ...defaultProps }));
|
|
33
|
+
const button = container.querySelector('button[data-component="share-link-button"]');
|
|
34
|
+
await (0, react_2.act)(async () => {
|
|
35
|
+
button && react_2.fireEvent.click(button);
|
|
36
|
+
});
|
|
37
|
+
expect(mockClipboardWrite).toHaveBeenCalledWith('https://ft.com/content/e46f26ed-27d1-4291-9709-e1031ba7e781?feature=blog-post-sharing#post-0cb263ac-3843-4a22-976a-fcee9b8ba7de');
|
|
38
|
+
});
|
|
39
|
+
// it('should prevent default link behavior', () => {
|
|
40
|
+
// const { container } = render(<ShareLinkButton {...defaultProps} />)
|
|
41
|
+
// const button = container.querySelector(
|
|
42
|
+
// 'button[data-component="share-link-button"]'
|
|
43
|
+
// )
|
|
44
|
+
// const event = new MouseEvent('click', { bubbles: true, cancelable: true })
|
|
45
|
+
// const preventDefaultSpy = jest.spyOn(event, 'preventDefault')
|
|
46
|
+
// button?.dispatchEvent(event)
|
|
47
|
+
// expect(preventDefaultSpy).toHaveBeenCalled()
|
|
48
|
+
// })
|
|
49
|
+
it('should show "Link copied" after clicking', async () => {
|
|
50
|
+
const { container } = (0, react_2.render)(react_1.default.createElement(ShareLinkButton_1.default, { ...defaultProps }));
|
|
51
|
+
const button = container.querySelector('button[data-component="share-link-button"]');
|
|
52
|
+
await (0, react_2.act)(async () => {
|
|
53
|
+
button && react_2.fireEvent.click(button);
|
|
54
|
+
});
|
|
55
|
+
expect(container.querySelector('[data-tooltip="show"]')).toBeTruthy();
|
|
56
|
+
});
|
|
57
|
+
it('should hide "Link copied" message after 8 seconds', async () => {
|
|
58
|
+
const { container } = (0, react_2.render)(react_1.default.createElement(ShareLinkButton_1.default, { ...defaultProps }));
|
|
59
|
+
const button = container.querySelector('button[data-component="share-link-button"]');
|
|
60
|
+
await (0, react_2.act)(async () => {
|
|
61
|
+
button && react_2.fireEvent.click(button);
|
|
62
|
+
});
|
|
63
|
+
(0, react_2.act)(() => {
|
|
64
|
+
jest.advanceTimersByTime(8000);
|
|
65
|
+
});
|
|
66
|
+
expect(container.querySelector('[data-tooltip="hide"]')).toBeTruthy();
|
|
67
|
+
});
|
|
68
|
+
});
|
|
69
|
+
//# sourceMappingURL=index.spec.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/LiveBlogPost/test/index.spec.tsx"],"names":[],"mappings":"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"}
|
|
@@ -116,7 +116,7 @@ class BaseLiveBlogWrapper extends react_1.Component {
|
|
|
116
116
|
return new post_tracker_1.PostTracker(config);
|
|
117
117
|
}
|
|
118
118
|
render() {
|
|
119
|
-
const { posts = [], ads = {}, articleUrl, showShareButtons, id, liveBlogWrapperElementRef, } = this.props;
|
|
119
|
+
const { posts = [], ads = {}, articleUrl, showShareButtons, showShareLinkButton, id, liveBlogWrapperElementRef, } = this.props;
|
|
120
120
|
//TODO: CI-1975 these types can move out when we have a posts type properly defined and shared
|
|
121
121
|
posts.sort((a, b) => {
|
|
122
122
|
if (a.isPinned && !b.isPinned) {
|
|
@@ -137,7 +137,7 @@ class BaseLiveBlogWrapper extends react_1.Component {
|
|
|
137
137
|
}
|
|
138
138
|
return 0;
|
|
139
139
|
});
|
|
140
|
-
const postElements = posts.map((post, index) => (react_1.default.createElement(LiveBlogPost_1.LiveBlogPost, { key: `live-blog-post-${post.id}`, ...post, articleUrl: articleUrl, showShareButtons: showShareButtons, ad: ads[index] })));
|
|
140
|
+
const postElements = posts.map((post, index) => (react_1.default.createElement(LiveBlogPost_1.LiveBlogPost, { key: `live-blog-post-${post.id}`, ...post, articleUrl: articleUrl, showShareButtons: showShareButtons, showShareLinkButton: showShareLinkButton, ad: ads[index] })));
|
|
141
141
|
return (react_1.default.createElement("div", { className: "x-live-blog-wrapper", "data-live-blog-wrapper-id": id, ref: liveBlogWrapperElementRef, "data-component": "live-blog-wrapper" }, postElements));
|
|
142
142
|
}
|
|
143
143
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LiveBlogWrapper/index.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAwC;AACxC,kEAA+E;AAC/E,mDAA+C;AAC/C,mDAA+C;AAC/C,iDAA4C;AAC5C,kDAA8C;AAE9C,uDAAuD;AACvD,kCAAkC;AAClC,kHAAkH;AAElH,4FAA4F;AAC5F,MAAM,0BAA0B,GAAG,IAAA,2BAAW,EAAC;IAC7C,UAAU,CAAC,OAAY,EAAE,OAAY;QACnC,OAAO,CAAC,KAAU,EAAE,EAAE;YACpB,MAAM,iBAAiB,GAAG,IAAA,6BAAa,EAAC,OAAO,CAAC,CAAA;YAChD,MAAM,oBAAoB,GAAG,KAAK,CAAC,KAAK,CAAC,IAAI,CAC3C,CAAC,IAAS,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE,KAAK,iBAAiB,CAAC,EAAE,CAChD,CAAA;YACD,IAAI,CAAC,oBAAoB,EAAE,CAAC;gBAC1B,KAAK,CAAC,KAAK,CAAC,OAAO,CAAC,iBAAiB,CAAC,CAAA;gBACtC,IAAA,6BAAa,EAAC,OAAO,EAAE,6BAA6B,EAAE;oBACpD,IAAI,EAAE,iBAAiB;iBACxB,CAAC,CAAA;YACJ,CAAC;YAED,OAAO,KAAK,CAAA;QACd,CAAC,CAAA;IACH,CAAC;CACF,CAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/LiveBlogWrapper/index.tsx"],"names":[],"mappings":"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"}
|
|
@@ -13,6 +13,7 @@ const post1 = {
|
|
|
13
13
|
isBreakingNews: true,
|
|
14
14
|
articleUrl: 'https://www.ft.com',
|
|
15
15
|
showShareButtons: true,
|
|
16
|
+
showShareLinkButton: true,
|
|
16
17
|
};
|
|
17
18
|
const post2 = {
|
|
18
19
|
id: '2',
|
|
@@ -22,6 +23,7 @@ const post2 = {
|
|
|
22
23
|
isBreakingNews: false,
|
|
23
24
|
articleUrl: 'https://www.ft.com',
|
|
24
25
|
showShareButtons: true,
|
|
26
|
+
showShareLinkButton: true,
|
|
25
27
|
};
|
|
26
28
|
describe('x-live-blog-wrapper', () => {
|
|
27
29
|
it('has a displayName', () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/LiveBlogWrapper/test/index.spec.tsx"],"names":[],"mappings":";;AAAA,6DAA6D;AAC7D,cAAc;AACd,oCAA0C;AAE1C,oDAAgD;AAChD,IAAI,CAAC,IAAI,CAAC,kBAAkB,CAAC,CAAA;AAE7B,MAAM,KAAK,GAAG;IACZ,EAAE,EAAE,GAAG;IACP,KAAK,EAAE,cAAc;IACrB,QAAQ,EAAE,oBAAoB;IAC9B,aAAa,EAAE,0BAA0B;IACzC,cAAc,EAAE,IAAI;IACpB,UAAU,EAAE,oBAAoB;IAChC,gBAAgB,EAAE,IAAI;
|
|
1
|
+
{"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/LiveBlogWrapper/test/index.spec.tsx"],"names":[],"mappings":"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"}
|
|
@@ -6,13 +6,13 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
6
6
|
const react_1 = __importDefault(require("react"));
|
|
7
7
|
const RichText_1 = require("../../RichText");
|
|
8
8
|
const LiveBlogWrapper_1 = require("../../LiveBlogWrapper");
|
|
9
|
-
const LiveBlogBody = ({ content, richTextComponents, xInteractionSerialiser, showShareButtons, postTrackerConfig, ads, }) => {
|
|
9
|
+
const LiveBlogBody = ({ content, richTextComponents, xInteractionSerialiser, showShareButtons, showShareLinkButton, postTrackerConfig, ads, }) => {
|
|
10
10
|
if (content.__typename !== 'LiveBlogPackage')
|
|
11
11
|
return null;
|
|
12
12
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
13
13
|
const posts = content.liveBlogPosts || [];
|
|
14
14
|
return (react_1.default.createElement(RichText_1.ComponentsContext.Provider, { value: richTextComponents },
|
|
15
|
-
react_1.default.createElement(LiveBlogWrapper_1.LiveBlogWrapper, { articleUrl: `https://www.ft.com/content/${content.id}`, id: "live-blog-wrapper", posts: posts, serialiser: xInteractionSerialiser, showShareButtons: showShareButtons ?? true, postTrackerConfig: postTrackerConfig, ads: ads })));
|
|
15
|
+
react_1.default.createElement(LiveBlogWrapper_1.LiveBlogWrapper, { articleUrl: `https://www.ft.com/content/${content.id}`, id: "live-blog-wrapper", posts: posts, serialiser: xInteractionSerialiser, showShareButtons: showShareButtons ?? true, showShareLinkButton: showShareLinkButton ?? false, postTrackerConfig: postTrackerConfig, ads: ads })));
|
|
16
16
|
};
|
|
17
17
|
exports.default = LiveBlogBody;
|
|
18
18
|
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/body-components/LiveBlogBody/index.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AAEzB,6CAAkD;AAClD,2DAAuD;AASvD,MAAM,YAAY,GAAgC,CAAC,EACjD,OAAO,EACP,kBAAkB,EAClB,sBAAsB,EACtB,gBAAgB,EAChB,iBAAiB,EACjB,GAAG,GACJ,EAAE,EAAE;IACH,IAAI,OAAO,CAAC,UAAU,KAAK,iBAAiB;QAAE,OAAO,IAAI,CAAA;IAEzD,8DAA8D;IAC9D,MAAM,KAAK,GAAG,OAAO,CAAC,aAAa,IAAI,EAAE,CAAA;IAEzC,OAAO,CACL,8BAAC,4BAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,kBAAkB;QACnD,8BAAC,iCAAe,IACd,UAAU,EAAE,8BAA8B,OAAO,CAAC,EAAE,EAAE,EACtD,EAAE,EAAC,mBAAmB,EACtB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,sBAAsB,EAClC,gBAAgB,EAAE,gBAAgB,IAAI,IAAI,EAC1C,iBAAiB,EAAE,iBAAiB,EACpC,GAAG,EAAE,GAAG,GACR,CACyB,CAC9B,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,YAAY,CAAA"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/body-components/LiveBlogBody/index.tsx"],"names":[],"mappings":";;;;;AAAA,kDAAyB;AAEzB,6CAAkD;AAClD,2DAAuD;AASvD,MAAM,YAAY,GAAgC,CAAC,EACjD,OAAO,EACP,kBAAkB,EAClB,sBAAsB,EACtB,gBAAgB,EAChB,mBAAmB,EACnB,iBAAiB,EACjB,GAAG,GACJ,EAAE,EAAE;IACH,IAAI,OAAO,CAAC,UAAU,KAAK,iBAAiB;QAAE,OAAO,IAAI,CAAA;IAEzD,8DAA8D;IAC9D,MAAM,KAAK,GAAG,OAAO,CAAC,aAAa,IAAI,EAAE,CAAA;IAEzC,OAAO,CACL,8BAAC,4BAAiB,CAAC,QAAQ,IAAC,KAAK,EAAE,kBAAkB;QACnD,8BAAC,iCAAe,IACd,UAAU,EAAE,8BAA8B,OAAO,CAAC,EAAE,EAAE,EACtD,EAAE,EAAC,mBAAmB,EACtB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,sBAAsB,EAClC,gBAAgB,EAAE,gBAAgB,IAAI,IAAI,EAC1C,mBAAmB,EAAE,mBAAmB,IAAI,KAAK,EACjD,iBAAiB,EAAE,iBAAiB,EACpC,GAAG,EAAE,GAAG,GACR,CACyB,CAC9B,CAAA;AACH,CAAC,CAAA;AAED,kBAAe,YAAY,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"LiveBlogPost.stories.js","sourceRoot":"","sources":["../../src/stories/LiveBlogPost.stories.tsx"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"LiveBlogPost.stories.js","sourceRoot":"","sources":["../../src/stories/LiveBlogPost.stories.tsx"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
|
|
3
|
+
type ShareLinkButtonProps = {
|
|
4
|
+
postId: string
|
|
5
|
+
articleUrl: string
|
|
6
|
+
}
|
|
7
|
+
|
|
8
|
+
const ShareLinkButton: React.FC<ShareLinkButtonProps> = ({
|
|
9
|
+
postId,
|
|
10
|
+
articleUrl,
|
|
11
|
+
}) => {
|
|
12
|
+
const copyUrl = async (e: React.MouseEvent<HTMLButtonElement>) => {
|
|
13
|
+
const wrapper = e.currentTarget.closest('.x-live-blog-post__link-container')
|
|
14
|
+
|
|
15
|
+
wrapper?.setAttribute('data-tooltip', 'show')
|
|
16
|
+
|
|
17
|
+
if (typeof window !== 'undefined' && navigator.clipboard) {
|
|
18
|
+
const postUrl = articleUrl ? new URL(articleUrl) : null
|
|
19
|
+
if (postUrl) {
|
|
20
|
+
postUrl.searchParams.append('feature', 'blog-post-sharing')
|
|
21
|
+
postUrl.hash = `post-${postId}`
|
|
22
|
+
}
|
|
23
|
+
await navigator.clipboard.writeText(postUrl?.toString() ?? '')
|
|
24
|
+
}
|
|
25
|
+
setTimeout(() => {
|
|
26
|
+
wrapper?.setAttribute('data-tooltip', 'hide')
|
|
27
|
+
}, 8000)
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
return (
|
|
31
|
+
<div className="x-live-blog-post__link-container" data-tooltip="hide">
|
|
32
|
+
<span className="x-live-blog-post__link-copied-message">Link copied</span>
|
|
33
|
+
<button
|
|
34
|
+
className="x-live-blog-post__link-icon"
|
|
35
|
+
data-component="share-link-button"
|
|
36
|
+
aria-label="Share link"
|
|
37
|
+
data-trackable="share-link"
|
|
38
|
+
title="Link"
|
|
39
|
+
onClick={copyUrl}
|
|
40
|
+
/>
|
|
41
|
+
<span>Link</span>
|
|
42
|
+
</div>
|
|
43
|
+
)
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
export default ShareLinkButton
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import React from 'react'
|
|
2
2
|
import ShareButtons from './ShareButtons'
|
|
3
|
+
import ShareLinkButton from './ShareLinkButton'
|
|
3
4
|
import Timestamp from './Timestamp'
|
|
4
5
|
import RichText from '../RichText'
|
|
5
6
|
import Expander from '../Expander'
|
|
@@ -75,6 +76,7 @@ export type LiveBlogPostProps = {
|
|
|
75
76
|
}
|
|
76
77
|
articleUrl: string
|
|
77
78
|
showShareButtons: boolean
|
|
79
|
+
showShareLinkButton: boolean
|
|
78
80
|
byline: StructuredTreeFragment
|
|
79
81
|
ad: unknown
|
|
80
82
|
indicators?: indicators
|
|
@@ -93,6 +95,7 @@ const LiveBlogPost: React.FC<LiveBlogPostProps> = ({
|
|
|
93
95
|
standout = {},
|
|
94
96
|
articleUrl,
|
|
95
97
|
showShareButtons = false,
|
|
98
|
+
showShareLinkButton = false,
|
|
96
99
|
byline,
|
|
97
100
|
ad,
|
|
98
101
|
isPinned,
|
|
@@ -191,7 +194,11 @@ const LiveBlogPost: React.FC<LiveBlogPostProps> = ({
|
|
|
191
194
|
<Byline structuredContent={byline} showEditedBy={false} />
|
|
192
195
|
</div>
|
|
193
196
|
</div>
|
|
197
|
+
{showShareLinkButton && (
|
|
198
|
+
<ShareLinkButton postId={id || postId} articleUrl={articleUrl} />
|
|
199
|
+
)}
|
|
194
200
|
</div>
|
|
201
|
+
|
|
195
202
|
{showBreakingNewsLabel && (
|
|
196
203
|
<div className="x-live-blog-post__breaking-news">Breaking news</div>
|
|
197
204
|
)}
|
|
@@ -0,0 +1,89 @@
|
|
|
1
|
+
import React from 'react'
|
|
2
|
+
import { render, fireEvent, act } from '@testing-library/react'
|
|
3
|
+
import ShareLinkButton from '../ShareLinkButton'
|
|
4
|
+
|
|
5
|
+
const mockClipboardWrite = jest.fn(() => Promise.resolve())
|
|
6
|
+
Object.defineProperty(navigator, 'clipboard', {
|
|
7
|
+
value: { writeText: mockClipboardWrite },
|
|
8
|
+
configurable: true,
|
|
9
|
+
})
|
|
10
|
+
|
|
11
|
+
describe('Share Link button', () => {
|
|
12
|
+
const defaultProps = {
|
|
13
|
+
postId: '0cb263ac-3843-4a22-976a-fcee9b8ba7de',
|
|
14
|
+
articleUrl: 'https://ft.com/content/e46f26ed-27d1-4291-9709-e1031ba7e781',
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
beforeEach(() => {
|
|
18
|
+
mockClipboardWrite.mockClear()
|
|
19
|
+
jest.useFakeTimers()
|
|
20
|
+
})
|
|
21
|
+
|
|
22
|
+
afterEach(() => {
|
|
23
|
+
jest.runOnlyPendingTimers()
|
|
24
|
+
jest.useRealTimers()
|
|
25
|
+
})
|
|
26
|
+
|
|
27
|
+
it('should render share link button', () => {
|
|
28
|
+
const { container } = render(<ShareLinkButton {...defaultProps} />)
|
|
29
|
+
expect(
|
|
30
|
+
container.querySelector('button[data-component="share-link-button"]')
|
|
31
|
+
).toBeTruthy()
|
|
32
|
+
})
|
|
33
|
+
|
|
34
|
+
it('should construct the correct URL with query parameter and post hash', async () => {
|
|
35
|
+
const { container } = render(<ShareLinkButton {...defaultProps} />)
|
|
36
|
+
const button = container.querySelector(
|
|
37
|
+
'button[data-component="share-link-button"]'
|
|
38
|
+
)
|
|
39
|
+
|
|
40
|
+
await act(async () => {
|
|
41
|
+
button && fireEvent.click(button)
|
|
42
|
+
})
|
|
43
|
+
|
|
44
|
+
expect(mockClipboardWrite).toHaveBeenCalledWith(
|
|
45
|
+
'https://ft.com/content/e46f26ed-27d1-4291-9709-e1031ba7e781?feature=blog-post-sharing#post-0cb263ac-3843-4a22-976a-fcee9b8ba7de'
|
|
46
|
+
)
|
|
47
|
+
})
|
|
48
|
+
|
|
49
|
+
// it('should prevent default link behavior', () => {
|
|
50
|
+
// const { container } = render(<ShareLinkButton {...defaultProps} />)
|
|
51
|
+
// const button = container.querySelector(
|
|
52
|
+
// 'button[data-component="share-link-button"]'
|
|
53
|
+
// )
|
|
54
|
+
// const event = new MouseEvent('click', { bubbles: true, cancelable: true })
|
|
55
|
+
// const preventDefaultSpy = jest.spyOn(event, 'preventDefault')
|
|
56
|
+
// button?.dispatchEvent(event)
|
|
57
|
+
// expect(preventDefaultSpy).toHaveBeenCalled()
|
|
58
|
+
// })
|
|
59
|
+
|
|
60
|
+
it('should show "Link copied" after clicking', async () => {
|
|
61
|
+
const { container } = render(<ShareLinkButton {...defaultProps} />)
|
|
62
|
+
const button = container.querySelector(
|
|
63
|
+
'button[data-component="share-link-button"]'
|
|
64
|
+
)
|
|
65
|
+
|
|
66
|
+
await act(async () => {
|
|
67
|
+
button && fireEvent.click(button)
|
|
68
|
+
})
|
|
69
|
+
|
|
70
|
+
expect(container.querySelector('[data-tooltip="show"]')).toBeTruthy()
|
|
71
|
+
})
|
|
72
|
+
|
|
73
|
+
it('should hide "Link copied" message after 8 seconds', async () => {
|
|
74
|
+
const { container } = render(<ShareLinkButton {...defaultProps} />)
|
|
75
|
+
const button = container.querySelector(
|
|
76
|
+
'button[data-component="share-link-button"]'
|
|
77
|
+
)
|
|
78
|
+
|
|
79
|
+
await act(async () => {
|
|
80
|
+
button && fireEvent.click(button)
|
|
81
|
+
})
|
|
82
|
+
|
|
83
|
+
act(() => {
|
|
84
|
+
jest.advanceTimersByTime(8000)
|
|
85
|
+
})
|
|
86
|
+
|
|
87
|
+
expect(container.querySelector('[data-tooltip="hide"]')).toBeTruthy()
|
|
88
|
+
})
|
|
89
|
+
})
|
|
@@ -34,6 +34,7 @@ type LiveBlogWrapperTypes = {
|
|
|
34
34
|
posts: Array<any> // a list of liveblog posts //TODO: prob useful extracted into a posts type and use instead of any
|
|
35
35
|
ads?: any
|
|
36
36
|
showShareButtons: boolean // condition to show shareButtons
|
|
37
|
+
showShareLinkButton: boolean // condition to show shareLinkButton
|
|
37
38
|
id: string //id of the liveblog package
|
|
38
39
|
liveBlogWrapperElementRef?: React.RefObject<any> | undefined // react ref, used by FT App
|
|
39
40
|
postTrackerConfig: any //optional config for tracking post //TODO: Body has postTrackerConfig type which could be useful
|
|
@@ -138,6 +139,7 @@ class BaseLiveBlogWrapper extends Component<
|
|
|
138
139
|
ads = {},
|
|
139
140
|
articleUrl,
|
|
140
141
|
showShareButtons,
|
|
142
|
+
showShareLinkButton,
|
|
141
143
|
id,
|
|
142
144
|
liveBlogWrapperElementRef,
|
|
143
145
|
} = this.props
|
|
@@ -187,6 +189,7 @@ class BaseLiveBlogWrapper extends Component<
|
|
|
187
189
|
{...post}
|
|
188
190
|
articleUrl={articleUrl}
|
|
189
191
|
showShareButtons={showShareButtons}
|
|
192
|
+
showShareLinkButton={showShareLinkButton}
|
|
190
193
|
ad={ads[index]}
|
|
191
194
|
/>
|
|
192
195
|
))
|
|
@@ -13,6 +13,7 @@ const post1 = {
|
|
|
13
13
|
isBreakingNews: true,
|
|
14
14
|
articleUrl: 'https://www.ft.com',
|
|
15
15
|
showShareButtons: true,
|
|
16
|
+
showShareLinkButton: true,
|
|
16
17
|
}
|
|
17
18
|
|
|
18
19
|
const post2 = {
|
|
@@ -23,6 +24,7 @@ const post2 = {
|
|
|
23
24
|
isBreakingNews: false,
|
|
24
25
|
articleUrl: 'https://www.ft.com',
|
|
25
26
|
showShareButtons: true,
|
|
27
|
+
showShareLinkButton: true,
|
|
26
28
|
}
|
|
27
29
|
|
|
28
30
|
describe('x-live-blog-wrapper', () => {
|
|
@@ -15,6 +15,7 @@ const LiveBlogBody: React.FC<LiveBlogBodyProps> = ({
|
|
|
15
15
|
richTextComponents,
|
|
16
16
|
xInteractionSerialiser,
|
|
17
17
|
showShareButtons,
|
|
18
|
+
showShareLinkButton,
|
|
18
19
|
postTrackerConfig,
|
|
19
20
|
ads,
|
|
20
21
|
}) => {
|
|
@@ -31,6 +32,7 @@ const LiveBlogBody: React.FC<LiveBlogBodyProps> = ({
|
|
|
31
32
|
posts={posts}
|
|
32
33
|
serialiser={xInteractionSerialiser}
|
|
33
34
|
showShareButtons={showShareButtons ?? true}
|
|
35
|
+
showShareLinkButton={showShareLinkButton ?? false}
|
|
34
36
|
postTrackerConfig={postTrackerConfig}
|
|
35
37
|
ads={ads}
|
|
36
38
|
/>
|
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
@import "../components/video-info-box";
|
|
13
13
|
@import "../components/video-description";
|
|
14
14
|
@import "../components/credit";
|
|
15
|
-
|
|
15
|
+
|
|
16
16
|
@include oLoading($opts: (
|
|
17
17
|
'themes': ('light'),
|
|
18
18
|
'sizes': ('large')
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
animation: fade-out 0.5s 1;
|
|
34
34
|
animation-fill-mode: forwards;
|
|
35
35
|
}
|
|
36
|
-
|
|
36
|
+
|
|
37
37
|
.cp-clip__video-controls {
|
|
38
38
|
width: 100%;
|
|
39
39
|
height: 100%;
|
|
@@ -105,7 +105,7 @@
|
|
|
105
105
|
&:hover, &:focus {
|
|
106
106
|
border-color: white;
|
|
107
107
|
}
|
|
108
|
-
background-position:
|
|
108
|
+
background-position: 55%;
|
|
109
109
|
}
|
|
110
110
|
|
|
111
111
|
.cp-clip__loading-text,
|