@gravity-ui/blog-constructor 4.0.0-alpha.1 → 4.1.0
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +44 -0
- package/build/cjs/blocks/Feed/Feed.js +47 -37
- package/build/cjs/blocks/Feed/reducer.d.ts +0 -5
- package/build/cjs/blocks/Feed/reducer.js +1 -4
- package/build/cjs/blocks/Header/schema.d.ts +81 -0
- package/build/cjs/blocks/Media/schema.d.ts +81 -0
- package/build/cjs/blocks/YFM/YFM.js +1 -1
- package/build/cjs/components/FeedHeader/FeedHeader.js +2 -2
- package/build/cjs/components/FeedHeader/components/Controls/Controls.d.ts +2 -3
- package/build/cjs/components/FeedHeader/components/Controls/Controls.js +24 -16
- package/build/cjs/components/Paginator/Paginator.d.ts +1 -1
- package/build/cjs/components/Paginator/Paginator.js +2 -2
- package/build/cjs/components/Paginator/types.d.ts +0 -1
- package/build/cjs/components/PostInfo/components/Save.js +6 -1
- package/build/cjs/components/Posts/Posts.css +25 -0
- package/build/cjs/components/Posts/Posts.d.ts +0 -1
- package/build/cjs/components/Posts/Posts.js +5 -4
- package/build/cjs/components/Prompt/Prompt.css +61 -0
- package/build/cjs/components/Prompt/Prompt.d.ts +17 -0
- package/build/cjs/components/Prompt/Prompt.js +41 -0
- package/build/cjs/components/PromptSignIn/PromptSignIn.d.ts +10 -0
- package/build/cjs/components/PromptSignIn/PromptSignIn.js +35 -0
- package/build/cjs/components/PromptSignIn/hooks/usePromptSignInProps.d.ts +6 -0
- package/build/cjs/components/PromptSignIn/hooks/usePromptSignInProps.js +16 -0
- package/build/cjs/components/Search/Search.js +1 -1
- package/build/cjs/containers/BlogPage/BlogPage.d.ts +4 -1
- package/build/cjs/containers/BlogPage/BlogPage.js +56 -18
- package/build/cjs/contexts/LikesContext.d.ts +2 -0
- package/build/cjs/hooks/useOpenCloseTimer.d.ts +9 -0
- package/build/cjs/hooks/useOpenCloseTimer.js +30 -0
- package/build/cjs/i18n/index.d.ts +3 -1
- package/build/cjs/i18n/index.js +6 -0
- package/build/cjs/models/common.d.ts +5 -1
- package/build/cjs/schema/index.d.ts +162 -0
- package/build/cjs/utils/common.js +1 -1
- package/build/esm/blocks/Feed/Feed.js +47 -37
- package/build/esm/blocks/Feed/reducer.d.ts +0 -5
- package/build/esm/blocks/Feed/reducer.js +1 -4
- package/build/esm/blocks/Header/schema.d.ts +81 -0
- package/build/esm/blocks/Media/schema.d.ts +81 -0
- package/build/esm/blocks/YFM/YFM.js +1 -1
- package/build/esm/components/FeedHeader/FeedHeader.js +2 -2
- package/build/esm/components/FeedHeader/components/Controls/Controls.d.ts +2 -3
- package/build/esm/components/FeedHeader/components/Controls/Controls.js +25 -17
- package/build/esm/components/Paginator/Paginator.d.ts +1 -1
- package/build/esm/components/Paginator/Paginator.js +2 -2
- package/build/esm/components/Paginator/types.d.ts +0 -1
- package/build/esm/components/PostInfo/components/Save.js +6 -1
- package/build/esm/components/Posts/Posts.css +25 -0
- package/build/esm/components/Posts/Posts.d.ts +0 -1
- package/build/esm/components/Posts/Posts.js +5 -4
- package/build/esm/components/Prompt/Prompt.css +61 -0
- package/build/esm/components/Prompt/Prompt.d.ts +18 -0
- package/build/esm/components/Prompt/Prompt.js +35 -0
- package/build/esm/components/PromptSignIn/PromptSignIn.d.ts +10 -0
- package/build/esm/components/PromptSignIn/PromptSignIn.js +28 -0
- package/build/esm/components/PromptSignIn/hooks/usePromptSignInProps.d.ts +6 -0
- package/build/esm/components/PromptSignIn/hooks/usePromptSignInProps.js +12 -0
- package/build/esm/components/Search/Search.js +1 -1
- package/build/esm/containers/BlogPage/BlogPage.d.ts +4 -1
- package/build/esm/containers/BlogPage/BlogPage.js +33 -18
- package/build/esm/contexts/LikesContext.d.ts +2 -0
- package/build/esm/hooks/useOpenCloseTimer.d.ts +9 -0
- package/build/esm/hooks/useOpenCloseTimer.js +26 -0
- package/build/esm/i18n/index.d.ts +3 -1
- package/build/esm/i18n/index.js +6 -0
- package/build/esm/models/common.d.ts +5 -1
- package/build/esm/schema/index.d.ts +162 -0
- package/build/esm/utils/common.js +1 -1
- package/package.json +3 -6
- package/server/data/sanitizeMeta.d.ts +2 -0
- package/server/data/sanitizeMeta.js +2 -0
- package/server/data/transformPageContent.js +1 -1
- package/server/models/common.d.ts +5 -1
- package/build/cjs/blocks/YFM/__tests__/YFM.test.d.ts +0 -1
- package/build/cjs/blocks/YFM/__tests__/YFM.test.js +0 -16
- package/build/esm/blocks/YFM/__tests__/YFM.test.d.ts +0 -1
- package/build/esm/blocks/YFM/__tests__/YFM.test.js +0 -11
package/CHANGELOG.md
CHANGED
@@ -1,5 +1,49 @@
|
|
1
1
|
# Changelog
|
2
2
|
|
3
|
+
## [4.1.0](https://github.com/gravity-ui/blog-constructor/compare/v4.0.0...v4.1.0) (2023-06-08)
|
4
|
+
|
5
|
+
|
6
|
+
### Features
|
7
|
+
|
8
|
+
* Prompt Sign In on Post Like ([#57](https://github.com/gravity-ui/blog-constructor/issues/57)) ([216cd9b](https://github.com/gravity-ui/blog-constructor/commit/216cd9b1accab047a46d7404f007623f56f1590e))
|
9
|
+
|
10
|
+
|
11
|
+
### Bug Fixes
|
12
|
+
|
13
|
+
* update peer ([#67](https://github.com/gravity-ui/blog-constructor/issues/67)) ([da2cbac](https://github.com/gravity-ui/blog-constructor/commit/da2cbac4d02017c4d3f9ff49108ba163b9a7867b))
|
14
|
+
|
15
|
+
## [4.0.0](https://github.com/gravity-ui/blog-constructor/compare/v3.5.0...v4.0.0) (2023-06-07)
|
16
|
+
|
17
|
+
|
18
|
+
### ⚠ BREAKING CHANGES
|
19
|
+
|
20
|
+
* install page-constructor@3 and refactor transform content ([#54](https://github.com/gravity-ui/blog-constructor/issues/54)) (#60)
|
21
|
+
|
22
|
+
### Features
|
23
|
+
|
24
|
+
* install page-constructor@3 and refactor transform content ([#54](https://github.com/gravity-ui/blog-constructor/issues/54)) ([#60](https://github.com/gravity-ui/blog-constructor/issues/60)) ([26bf452](https://github.com/gravity-ui/blog-constructor/commit/26bf452419f9c01bd0e550fa857715665fe38cd2))
|
25
|
+
|
26
|
+
## [3.5.0](https://github.com/gravity-ui/blog-constructor/compare/v3.4.1...v3.5.0) (2023-06-07)
|
27
|
+
|
28
|
+
|
29
|
+
### Features
|
30
|
+
|
31
|
+
* update page-constructor in second major ([#63](https://github.com/gravity-ui/blog-constructor/issues/63)) ([95d2fb8](https://github.com/gravity-ui/blog-constructor/commit/95d2fb88a13e4371bc4d6e603a3835790f1ffb4f))
|
32
|
+
|
33
|
+
## [3.4.1](https://github.com/gravity-ui/blog-constructor/compare/v3.4.0...v3.4.1) (2023-05-30)
|
34
|
+
|
35
|
+
|
36
|
+
### Bug Fixes
|
37
|
+
|
38
|
+
* return js, jsx files to gulpfile.js ([#58](https://github.com/gravity-ui/blog-constructor/issues/58)) ([d5e4c42](https://github.com/gravity-ui/blog-constructor/commit/d5e4c428e8eae56fd7ab381c2969c04955adc45b))
|
39
|
+
|
40
|
+
## [3.4.0](https://github.com/gravity-ui/blog-constructor/compare/v3.3.0...v3.4.0) (2023-05-24)
|
41
|
+
|
42
|
+
|
43
|
+
### Features
|
44
|
+
|
45
|
+
* new loading UI (shimmer) ([#50](https://github.com/gravity-ui/blog-constructor/issues/50)) ([ccdf08c](https://github.com/gravity-ui/blog-constructor/commit/ccdf08ccc62dd9930ab8c994601c787b03897f05))
|
46
|
+
|
3
47
|
## [3.3.0](https://github.com/gravity-ui/blog-constructor/compare/v3.2.1...v3.3.0) (2023-05-16)
|
4
48
|
|
5
49
|
|
@@ -56,11 +56,10 @@ const Feed = ({ image }) => {
|
|
56
56
|
const { posts, totalCount, tags, services, pinnedPost, getPosts, pageCountForShowSupportButtons, } = (0, react_1.useContext)(FeedContext_1.FeedContext);
|
57
57
|
const router = (0, react_1.useContext)(RouterContext_1.RouterContext);
|
58
58
|
const handleAnalytics = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.ShowMore);
|
59
|
-
const [{ errorLoad, errorShowMore, isFetching,
|
59
|
+
const [{ errorLoad, errorShowMore, isFetching, isShowMoreVisible, lastLoadedCount, postCountOnPage, postsOnPage, pinnedPostOnPage, currentPage, queryParams, }, dispatch,] = (0, react_1.useReducer)(reducer_1.reducer, {
|
60
60
|
errorLoad: false,
|
61
61
|
errorShowMore: false,
|
62
62
|
isFetching: false,
|
63
|
-
isShowMoreFetching: false,
|
64
63
|
isShowMoreVisible: true,
|
65
64
|
lastLoadedCount: (posts === null || posts === void 0 ? void 0 : posts.length) || 0,
|
66
65
|
postCountOnPage: totalCount || 0,
|
@@ -75,36 +74,36 @@ const Feed = ({ image }) => {
|
|
75
74
|
const pageChange = (value) => {
|
76
75
|
dispatch({ type: reducer_1.ActionTypes.PageChange, payload: value });
|
77
76
|
};
|
78
|
-
const
|
79
|
-
dispatch({ type: reducer_1.ActionTypes.
|
80
|
-
const hasFirstPageQuery = Object.keys(value).some((queryKey) => queryKey === PAGE_QUERY && value[queryKey] === FIRST_PAGE);
|
81
|
-
if (hasFirstPageQuery) {
|
82
|
-
// eslint-disable-next-line no-not-accumulator-reassign/no-not-accumulator-reassign
|
83
|
-
value[PAGE_QUERY] = null;
|
84
|
-
}
|
85
|
-
router.updateQueryCallback(value);
|
77
|
+
const setIsFetching = (value) => {
|
78
|
+
dispatch({ type: reducer_1.ActionTypes.SetIsFetching, payload: value });
|
86
79
|
};
|
87
|
-
const
|
88
|
-
|
89
|
-
handleChangeQueryParams({ page: value });
|
80
|
+
const setErrorLoad = (value) => {
|
81
|
+
dispatch({ type: reducer_1.ActionTypes.SetErrorLoad, payload: value });
|
90
82
|
};
|
91
|
-
const
|
92
|
-
|
93
|
-
|
94
|
-
|
83
|
+
const handleChangeQueryParams = (0, react_1.useCallback)((value) => {
|
84
|
+
dispatch({ type: reducer_1.ActionTypes.QueryParamsChange, payload: value });
|
85
|
+
const hasFirstPageQuery = Object.keys(value).some((queryKey) => queryKey === PAGE_QUERY && value[queryKey] === FIRST_PAGE);
|
86
|
+
const result = hasFirstPageQuery
|
87
|
+
? Object.assign(Object.assign({}, value), { [PAGE_QUERY]: null }) : Object.assign({}, value);
|
88
|
+
router.updateQueryCallback(result);
|
89
|
+
}, [router]);
|
90
|
+
const fetchData = (0, react_1.useCallback)(async ({ page, query }) => {
|
91
|
+
if (query && getPosts) {
|
92
|
+
const queryParamsForRequest = (0, common_2.getFeedQueryParams)(Object.assign(Object.assign({}, queryParams), query), page);
|
93
|
+
const data = await getPosts(queryParamsForRequest);
|
95
94
|
return data;
|
96
95
|
}
|
97
96
|
else {
|
98
97
|
throw new Error('cant get request');
|
99
98
|
}
|
100
99
|
}, [getPosts, queryParams]);
|
101
|
-
const
|
102
|
-
|
103
|
-
|
104
|
-
const fetchAndReplaceData = (0, react_1.useCallback)(async (pageNumber) => {
|
100
|
+
const handleLoad = (0, react_1.useCallback)(async ({ page, query }) => {
|
101
|
+
const pageNumber = Number(page || queryParams.page || constants_2.DEFAULT_PAGE);
|
102
|
+
handleChangeQueryParams(query);
|
105
103
|
try {
|
106
|
-
|
107
|
-
|
104
|
+
setErrorLoad(false);
|
105
|
+
setIsFetching(true);
|
106
|
+
const fetchedData = await fetchData({ page: pageNumber, query });
|
108
107
|
if (fetchedData) {
|
109
108
|
dispatch({
|
110
109
|
type: reducer_1.ActionTypes.SetPosts,
|
@@ -118,22 +117,35 @@ const Feed = ({ image }) => {
|
|
118
117
|
}
|
119
118
|
}
|
120
119
|
catch (err) {
|
121
|
-
|
120
|
+
setErrorLoad(true);
|
122
121
|
}
|
123
122
|
(0, common_2.scrollOnPageChange)(CONTAINER_ID);
|
124
123
|
setIsFetching(false);
|
125
|
-
}, [fetchData]);
|
124
|
+
}, [fetchData, handleChangeQueryParams, queryParams]);
|
125
|
+
const handlePageChange = async (value) => {
|
126
|
+
pageChange(value);
|
127
|
+
handleLoad({
|
128
|
+
page: value,
|
129
|
+
query: Object.assign(Object.assign({}, queryParams), { page: value }),
|
130
|
+
});
|
131
|
+
};
|
126
132
|
const handleShowMore = async () => {
|
127
|
-
dispatch({ type: reducer_1.ActionTypes.SetIsShowMoreFetching, payload: true });
|
128
133
|
/**
|
129
134
|
* @deprecated Metrika will be deleted after launch of analyticsEvents
|
130
135
|
*/
|
131
136
|
metrika_js_1.default.reachGoal(utils_1.MetrikaCounter.CrossSite, constants_1.BlogMetrikaGoalIds.showMore);
|
132
137
|
handleAnalytics();
|
138
|
+
const nextPage = currentPage + 1;
|
133
139
|
try {
|
134
|
-
|
140
|
+
setIsFetching(true);
|
141
|
+
const fetchedData = await fetchData({
|
142
|
+
page: nextPage,
|
143
|
+
query: {
|
144
|
+
page: nextPage,
|
145
|
+
},
|
146
|
+
});
|
135
147
|
handleChangeQueryParams({
|
136
|
-
page:
|
148
|
+
page: nextPage,
|
137
149
|
});
|
138
150
|
if (fetchedData) {
|
139
151
|
dispatch({
|
@@ -141,7 +153,7 @@ const Feed = ({ image }) => {
|
|
141
153
|
payload: {
|
142
154
|
posts: (postsOnPage !== null && postsOnPage !== void 0 ? postsOnPage : []).concat(fetchedData.posts),
|
143
155
|
count: fetchedData.count,
|
144
|
-
currentPage:
|
156
|
+
currentPage: nextPage,
|
145
157
|
lastLoadedCount: fetchedData.posts.length,
|
146
158
|
},
|
147
159
|
});
|
@@ -150,13 +162,11 @@ const Feed = ({ image }) => {
|
|
150
162
|
catch (err) {
|
151
163
|
dispatch({ type: reducer_1.ActionTypes.SetErrorShowMore, payload: true });
|
152
164
|
}
|
153
|
-
|
165
|
+
setIsFetching(false);
|
154
166
|
};
|
155
|
-
(0, react_1.
|
156
|
-
|
157
|
-
|
158
|
-
}
|
159
|
-
}, [fetchAndReplaceData, isFetching, queryParams.page]);
|
167
|
+
const handleOnErrorReload = (0, react_1.useCallback)(() => {
|
168
|
+
handleLoad({ page: currentPage, query: queryParams });
|
169
|
+
}, [currentPage, handleLoad, queryParams]);
|
160
170
|
(0, react_1.useEffect)(() => {
|
161
171
|
const loadedPostsCount = currentPage * perPageInQuery;
|
162
172
|
dispatch({
|
@@ -174,11 +184,11 @@ const Feed = ({ image }) => {
|
|
174
184
|
icon: tag.icon && react_1.default.createElement(uikit_1.Icon, { data: tag.icon }),
|
175
185
|
})), [tags]);
|
176
186
|
return (react_1.default.createElement("div", null,
|
177
|
-
react_1.default.createElement(FeedHeader_1.FeedHeader, { verticalOffset: "s", tags: tagItems, services: serviceItems,
|
187
|
+
react_1.default.createElement(FeedHeader_1.FeedHeader, { verticalOffset: "s", tags: tagItems, services: serviceItems, handleLoadData: handleLoad, queryParams: queryParams, background: {
|
178
188
|
fullWidth: true,
|
179
189
|
url: image,
|
180
190
|
disableCompress: true,
|
181
191
|
} }),
|
182
|
-
errorLoad ? (react_1.default.createElement(PostsError_1.PostsError, { onButtonClick:
|
192
|
+
errorLoad ? (react_1.default.createElement(PostsError_1.PostsError, { onButtonClick: handleOnErrorReload })) : (react_1.default.createElement(Posts_1.Posts, { containerId: CONTAINER_ID, currentPage: currentPage, isShowMoreVisible: isShowMoreVisible, errorShowMore: errorShowMore, postCountOnPage: postCountOnPage, perPageInQuery: perPageInQuery, handleShowMore: handleShowMore, handlePageChange: handlePageChange, postsOnPage: postsOnPage, pinnedPostOnPage: pinnedPostOnPage, isFetching: isFetching, pageCountForShowSupportButtons: pageCountForShowSupportButtons }))));
|
183
193
|
};
|
184
194
|
exports.Feed = Feed;
|
@@ -6,7 +6,6 @@ export declare enum ActionTypes {
|
|
6
6
|
SetPosts = "setPosts",
|
7
7
|
SetShowMore = "setShowMore",
|
8
8
|
SetIsFetching = "setIsFetching",
|
9
|
-
SetIsShowMoreFetching = "setIsShowMoreFetching",
|
10
9
|
PageChange = "pageChange",
|
11
10
|
QueryParamsChange = "queryParamsChange"
|
12
11
|
}
|
@@ -15,7 +14,6 @@ export type State = {
|
|
15
14
|
errorLoad: boolean;
|
16
15
|
errorShowMore: boolean;
|
17
16
|
isFetching: boolean;
|
18
|
-
isShowMoreFetching: boolean;
|
19
17
|
isShowMoreVisible: boolean;
|
20
18
|
lastLoadedCount: number;
|
21
19
|
pinnedPostOnPage?: PostData;
|
@@ -29,9 +27,6 @@ type Action = {
|
|
29
27
|
} | {
|
30
28
|
type: ActionTypes.SetIsFetching;
|
31
29
|
payload: boolean;
|
32
|
-
} | {
|
33
|
-
type: ActionTypes.SetIsShowMoreFetching;
|
34
|
-
payload: boolean;
|
35
30
|
} | {
|
36
31
|
type: ActionTypes.SetPosts;
|
37
32
|
payload: {
|
@@ -9,7 +9,6 @@ var ActionTypes;
|
|
9
9
|
ActionTypes["SetPosts"] = "setPosts";
|
10
10
|
ActionTypes["SetShowMore"] = "setShowMore";
|
11
11
|
ActionTypes["SetIsFetching"] = "setIsFetching";
|
12
|
-
ActionTypes["SetIsShowMoreFetching"] = "setIsShowMoreFetching";
|
13
12
|
ActionTypes["PageChange"] = "pageChange";
|
14
13
|
ActionTypes["QueryParamsChange"] = "queryParamsChange";
|
15
14
|
})(ActionTypes = exports.ActionTypes || (exports.ActionTypes = {}));
|
@@ -20,11 +19,9 @@ const reducer = (state, { type, payload }) => {
|
|
20
19
|
case ActionTypes.SetPosts:
|
21
20
|
return Object.assign(Object.assign({}, state), { lastLoadedCount: payload.count, postCountOnPage: payload.count, pinnedPostOnPage: payload.pinnedPost, postsOnPage: payload.posts, currentPage: payload.page });
|
22
21
|
case ActionTypes.SetShowMore:
|
23
|
-
return Object.assign(Object.assign({}, state), { lastLoadedCount: payload.lastLoadedCount, postCountOnPage: payload.count, currentPage: payload.currentPage, postsOnPage: payload.posts, errorShowMore: false
|
22
|
+
return Object.assign(Object.assign({}, state), { lastLoadedCount: payload.lastLoadedCount, postCountOnPage: payload.count, currentPage: payload.currentPage, postsOnPage: payload.posts, errorShowMore: false });
|
24
23
|
case ActionTypes.SetIsFetching:
|
25
24
|
return Object.assign(Object.assign({}, state), { isFetching: payload });
|
26
|
-
case ActionTypes.SetIsShowMoreFetching:
|
27
|
-
return Object.assign(Object.assign({}, state), { isShowMoreFetching: payload });
|
28
25
|
case ActionTypes.PageChange:
|
29
26
|
return Object.assign(Object.assign({}, state), { currentPage: payload, isFetching: true });
|
30
27
|
case ActionTypes.SetErrorLoad:
|
@@ -287,6 +287,87 @@ export declare const Header: {
|
|
287
287
|
type: string;
|
288
288
|
})[];
|
289
289
|
};
|
290
|
+
fullscreen: {
|
291
|
+
type: string;
|
292
|
+
};
|
293
|
+
analyticsEvents: {
|
294
|
+
anyOf: ({
|
295
|
+
type: string;
|
296
|
+
additionalProperties: {
|
297
|
+
type: string;
|
298
|
+
};
|
299
|
+
required: string[];
|
300
|
+
properties: {
|
301
|
+
name: {
|
302
|
+
type: string;
|
303
|
+
};
|
304
|
+
type: {
|
305
|
+
type: string;
|
306
|
+
};
|
307
|
+
counters: {
|
308
|
+
type: string;
|
309
|
+
additionalProperties: boolean;
|
310
|
+
required: never[];
|
311
|
+
properties: {
|
312
|
+
include: {
|
313
|
+
type: string;
|
314
|
+
items: {
|
315
|
+
type: string;
|
316
|
+
};
|
317
|
+
};
|
318
|
+
exclude: {
|
319
|
+
type: string;
|
320
|
+
items: {
|
321
|
+
type: string;
|
322
|
+
};
|
323
|
+
};
|
324
|
+
};
|
325
|
+
};
|
326
|
+
context: {
|
327
|
+
type: string;
|
328
|
+
};
|
329
|
+
};
|
330
|
+
} | {
|
331
|
+
type: string;
|
332
|
+
items: {
|
333
|
+
type: string;
|
334
|
+
additionalProperties: {
|
335
|
+
type: string;
|
336
|
+
};
|
337
|
+
required: string[];
|
338
|
+
properties: {
|
339
|
+
name: {
|
340
|
+
type: string;
|
341
|
+
};
|
342
|
+
type: {
|
343
|
+
type: string;
|
344
|
+
};
|
345
|
+
counters: {
|
346
|
+
type: string;
|
347
|
+
additionalProperties: boolean;
|
348
|
+
required: never[];
|
349
|
+
properties: {
|
350
|
+
include: {
|
351
|
+
type: string;
|
352
|
+
items: {
|
353
|
+
type: string;
|
354
|
+
};
|
355
|
+
};
|
356
|
+
exclude: {
|
357
|
+
type: string;
|
358
|
+
items: {
|
359
|
+
type: string;
|
360
|
+
};
|
361
|
+
};
|
362
|
+
};
|
363
|
+
};
|
364
|
+
context: {
|
365
|
+
type: string;
|
366
|
+
};
|
367
|
+
};
|
368
|
+
};
|
369
|
+
})[];
|
370
|
+
};
|
290
371
|
};
|
291
372
|
} | {
|
292
373
|
type: string;
|
@@ -135,6 +135,87 @@ export declare const Media: {
|
|
135
135
|
type: string;
|
136
136
|
})[];
|
137
137
|
};
|
138
|
+
fullscreen: {
|
139
|
+
type: string;
|
140
|
+
};
|
141
|
+
analyticsEvents: {
|
142
|
+
anyOf: ({
|
143
|
+
type: string;
|
144
|
+
additionalProperties: {
|
145
|
+
type: string;
|
146
|
+
};
|
147
|
+
required: string[];
|
148
|
+
properties: {
|
149
|
+
name: {
|
150
|
+
type: string;
|
151
|
+
};
|
152
|
+
type: {
|
153
|
+
type: string;
|
154
|
+
};
|
155
|
+
counters: {
|
156
|
+
type: string;
|
157
|
+
additionalProperties: boolean;
|
158
|
+
required: never[];
|
159
|
+
properties: {
|
160
|
+
include: {
|
161
|
+
type: string;
|
162
|
+
items: {
|
163
|
+
type: string;
|
164
|
+
};
|
165
|
+
};
|
166
|
+
exclude: {
|
167
|
+
type: string;
|
168
|
+
items: {
|
169
|
+
type: string;
|
170
|
+
};
|
171
|
+
};
|
172
|
+
};
|
173
|
+
};
|
174
|
+
context: {
|
175
|
+
type: string;
|
176
|
+
};
|
177
|
+
};
|
178
|
+
} | {
|
179
|
+
type: string;
|
180
|
+
items: {
|
181
|
+
type: string;
|
182
|
+
additionalProperties: {
|
183
|
+
type: string;
|
184
|
+
};
|
185
|
+
required: string[];
|
186
|
+
properties: {
|
187
|
+
name: {
|
188
|
+
type: string;
|
189
|
+
};
|
190
|
+
type: {
|
191
|
+
type: string;
|
192
|
+
};
|
193
|
+
counters: {
|
194
|
+
type: string;
|
195
|
+
additionalProperties: boolean;
|
196
|
+
required: never[];
|
197
|
+
properties: {
|
198
|
+
include: {
|
199
|
+
type: string;
|
200
|
+
items: {
|
201
|
+
type: string;
|
202
|
+
};
|
203
|
+
};
|
204
|
+
exclude: {
|
205
|
+
type: string;
|
206
|
+
items: {
|
207
|
+
type: string;
|
208
|
+
};
|
209
|
+
};
|
210
|
+
};
|
211
|
+
};
|
212
|
+
context: {
|
213
|
+
type: string;
|
214
|
+
};
|
215
|
+
};
|
216
|
+
};
|
217
|
+
})[];
|
218
|
+
};
|
138
219
|
paddingTop: {
|
139
220
|
type: string;
|
140
221
|
enum: string[];
|
@@ -5,8 +5,8 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
5
5
|
Object.defineProperty(exports, "__esModule", { value: true });
|
6
6
|
exports.YFM = void 0;
|
7
7
|
const react_1 = __importDefault(require("react"));
|
8
|
-
const bem_cn_lite_1 = __importDefault(require("bem-cn-lite"));
|
9
8
|
const page_constructor_1 = require("@gravity-ui/page-constructor");
|
9
|
+
const bem_cn_lite_1 = __importDefault(require("bem-cn-lite"));
|
10
10
|
const Wrapper_1 = require("../../components/Wrapper/Wrapper");
|
11
11
|
const paddings_1 = require("../../models/paddings");
|
12
12
|
const b = (0, bem_cn_lite_1.default)('yfm');
|
@@ -9,7 +9,7 @@ const page_constructor_1 = require("@gravity-ui/page-constructor");
|
|
9
9
|
const cn_1 = require("../../utils/cn");
|
10
10
|
const Controls_1 = require("./components/Controls/Controls");
|
11
11
|
const b = (0, cn_1.block)('feed-header');
|
12
|
-
const FeedHeader = ({ tags, services,
|
12
|
+
const FeedHeader = ({ tags, services, handleLoadData, offset = 'default', background, theme = 'default', verticalOffset = 'l', className, queryParams, }) => {
|
13
13
|
const backgroundThemed = background && (0, page_constructor_1.getThemedValue)(background, theme);
|
14
14
|
return (react_1.default.createElement("header", { className: b('header', { ['has-background']: Boolean(background) }, className) },
|
15
15
|
(backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color) ? (react_1.default.createElement(page_constructor_1.FullWidthBackground, { style: { backgroundColor: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color }, theme: "rounded" })) : null,
|
@@ -19,6 +19,6 @@ const FeedHeader = ({ tags, services, setIsFetching, offset = 'default', backgro
|
|
19
19
|
? ''
|
20
20
|
: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.color,
|
21
21
|
}, disableCompress: backgroundThemed === null || backgroundThemed === void 0 ? void 0 : backgroundThemed.disableCompress })) : null,
|
22
|
-
react_1.default.createElement(Controls_1.Controls, { tags: tags, services: services,
|
22
|
+
react_1.default.createElement(Controls_1.Controls, { tags: tags, services: services, handleLoadData: handleLoadData, queryParams: queryParams }))));
|
23
23
|
};
|
24
24
|
exports.FeedHeader = FeedHeader;
|
@@ -1,15 +1,14 @@
|
|
1
1
|
import React, { ReactNode } from 'react';
|
2
|
-
import {
|
2
|
+
import { FetchArgs, Query, SetQueryType } from '../../../../models/common';
|
3
3
|
export type SelectItem = {
|
4
4
|
content: string;
|
5
5
|
value: string;
|
6
6
|
icon?: ReactNode;
|
7
7
|
};
|
8
8
|
export type ControlsProps = {
|
9
|
-
|
9
|
+
handleLoadData: (props: FetchArgs) => void;
|
10
10
|
tags?: SelectItem[];
|
11
11
|
services?: SelectItem[];
|
12
|
-
handleChangeQuery: HandleChangeQueryParams;
|
13
12
|
queryParams: Query;
|
14
13
|
setQuery?: SetQueryType;
|
15
14
|
};
|
@@ -47,7 +47,7 @@ const b = (0, cn_1.block)('feed-controls');
|
|
47
47
|
const ICON_SIZE = 16;
|
48
48
|
const DEFAULT_PAGE = 1;
|
49
49
|
const VIRTUALIZATION_THRESHOLD = 1000;
|
50
|
-
const Controls = ({
|
50
|
+
const Controls = ({ handleLoadData, tags = [], services = [], queryParams, }) => {
|
51
51
|
const { hasLikes } = (0, react_1.useContext)(LikesContext_1.LikesContext);
|
52
52
|
const handleAnalyticsTag = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.Tag);
|
53
53
|
const handleAnalyticsService = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.Service);
|
@@ -56,21 +56,25 @@ const Controls = ({ setIsFetching, tags = [], services = [], handleChangeQuery,
|
|
56
56
|
const [savedOnly, setSavedOnly] = (0, react_1.useState)(savedOnlyInitial === 'true');
|
57
57
|
const [search, setSearch] = (0, react_1.useState)(searchInitial);
|
58
58
|
const handleSavedOnly = () => {
|
59
|
-
handleChangeQuery({
|
60
|
-
savedOnly: savedOnly ? '' : 'true',
|
61
|
-
search: '',
|
62
|
-
tags: '',
|
63
|
-
page: DEFAULT_PAGE,
|
64
|
-
services: '',
|
65
|
-
});
|
66
59
|
handleAnalyticsSaveOnly();
|
67
60
|
setSavedOnly(!savedOnly);
|
68
|
-
|
61
|
+
handleLoadData({
|
62
|
+
page: DEFAULT_PAGE,
|
63
|
+
query: {
|
64
|
+
savedOnly: savedOnly ? '' : 'true',
|
65
|
+
search: '',
|
66
|
+
tags: '',
|
67
|
+
page: DEFAULT_PAGE,
|
68
|
+
services: '',
|
69
|
+
},
|
70
|
+
});
|
69
71
|
};
|
70
72
|
const handleSearch = (searchValue) => {
|
71
|
-
handleChangeQuery({ search: searchValue, page: DEFAULT_PAGE });
|
72
73
|
setSearch(searchValue);
|
73
|
-
|
74
|
+
handleLoadData({
|
75
|
+
page: DEFAULT_PAGE,
|
76
|
+
query: { search: searchValue, page: DEFAULT_PAGE },
|
77
|
+
});
|
74
78
|
};
|
75
79
|
const handleTagSelect = (selectedTags) => {
|
76
80
|
/**
|
@@ -83,11 +87,13 @@ const Controls = ({ setIsFetching, tags = [], services = [], handleChangeQuery,
|
|
83
87
|
theme: selectedTags[0],
|
84
88
|
});
|
85
89
|
const isEmptyTag = selectedTags.some((tag) => tag === 'empty');
|
86
|
-
|
87
|
-
tags: isEmptyTag ? '' : selectedTags[0],
|
90
|
+
handleLoadData({
|
88
91
|
page: DEFAULT_PAGE,
|
92
|
+
query: {
|
93
|
+
tags: isEmptyTag ? '' : selectedTags[0],
|
94
|
+
page: DEFAULT_PAGE,
|
95
|
+
},
|
89
96
|
});
|
90
|
-
setIsFetching(true);
|
91
97
|
};
|
92
98
|
const handleServicesSelect = (selectedServices) => {
|
93
99
|
const forMetrikaServices = services.filter((service) => {
|
@@ -104,8 +110,10 @@ const Controls = ({ setIsFetching, tags = [], services = [], handleChangeQuery,
|
|
104
110
|
service: metrikaAsString,
|
105
111
|
});
|
106
112
|
const servicesAsString = selectedServices.join(',');
|
107
|
-
|
108
|
-
|
113
|
+
handleLoadData({
|
114
|
+
page: DEFAULT_PAGE,
|
115
|
+
query: { services: servicesAsString, page: DEFAULT_PAGE },
|
116
|
+
});
|
109
117
|
};
|
110
118
|
const tagsItems = (0, react_1.useMemo)(() => [{ value: 'empty', content: (0, i18n_1.i18)(i18n_1.Keyset.AllTags) }, ...tags], [tags]);
|
111
119
|
const servicesItems = (0, react_1.useMemo)(() => (servicesInitial ? [...servicesInitial.split(',')] : []), [servicesInitial]);
|
@@ -1,2 +1,2 @@
|
|
1
1
|
import { PaginatorProps } from './types';
|
2
|
-
export declare const Paginator: ({ itemsPerPage, totalItems, maxPages, page, className,
|
2
|
+
export declare const Paginator: ({ itemsPerPage, totalItems, maxPages, page, className, onPageChange, pageCountForShowSupportButtons, }: PaginatorProps) => JSX.Element | null;
|
@@ -54,7 +54,7 @@ const types_1 = require("./types");
|
|
54
54
|
const utils_2 = require("./utils");
|
55
55
|
const b = (0, cn_1.block)('paginator');
|
56
56
|
const DEFAULT_PAGE_COUNT_FOR_SHOW_SUPPORT_BUTTONS = 6;
|
57
|
-
const Paginator = ({ itemsPerPage, totalItems, maxPages, page, className,
|
57
|
+
const Paginator = ({ itemsPerPage, totalItems, maxPages, page, className, onPageChange, pageCountForShowSupportButtons = DEFAULT_PAGE_COUNT_FOR_SHOW_SUPPORT_BUTTONS, }) => {
|
58
58
|
const [pagesCount, setPagesCount] = (0, react_1.useState)((0, utils_2.getPagesCount)({ itemsPerPage, totalItems, maxPages }));
|
59
59
|
(0, react_1.useEffect)(() => {
|
60
60
|
const count = (0, utils_2.getPagesCount)({ itemsPerPage, totalItems, maxPages });
|
@@ -123,7 +123,7 @@ const Paginator = ({ itemsPerPage, totalItems, maxPages, page, className, loadin
|
|
123
123
|
}
|
124
124
|
const renderPaginatorItem = (item) => {
|
125
125
|
const { key } = item, rest = __rest(item, ["key"]);
|
126
|
-
return react_1.default.createElement(PaginatorItem_1.PaginatorItem, Object.assign({ key: `page_${key}` }, rest
|
126
|
+
return react_1.default.createElement(PaginatorItem_1.PaginatorItem, Object.assign({ key: `page_${key}` }, rest));
|
127
127
|
};
|
128
128
|
return (react_1.default.createElement("div", { className: b('pagination') },
|
129
129
|
page > 1 && (react_1.default.createElement("div", { className: b('pagination-block') },
|
@@ -53,7 +53,7 @@ const b = (0, cn_1.block)('post-info');
|
|
53
53
|
* @returns jsx
|
54
54
|
*/
|
55
55
|
const Save = ({ title, postId, hasUserLike, handleUserLike, metrikaGoal, size, theme, dataQa, }) => {
|
56
|
-
const { toggleLike } = (0, react_1.useContext)(LikesContext_1.LikesContext);
|
56
|
+
const { toggleLike, isSignedInUser, requireSignIn } = (0, react_1.useContext)(LikesContext_1.LikesContext);
|
57
57
|
const handleAnalytics = (0, page_constructor_1.useAnalytics)(common_1.DefaultEventNames.SaveButton);
|
58
58
|
const isLikeable = Boolean(toggleLike);
|
59
59
|
return (react_1.default.createElement("div", { className: b('item', { size }), onClick: (event) => {
|
@@ -64,6 +64,11 @@ const Save = ({ title, postId, hasUserLike, handleUserLike, metrikaGoal, size, t
|
|
64
64
|
if (!isLikeable) {
|
65
65
|
return;
|
66
66
|
}
|
67
|
+
// Open Popup to ask the User to sign in first
|
68
|
+
if (!isSignedInUser && requireSignIn) {
|
69
|
+
requireSignIn(event);
|
70
|
+
return;
|
71
|
+
}
|
67
72
|
(0, common_2.postLikeStatus)(postId, Boolean(hasUserLike));
|
68
73
|
handleUserLike();
|
69
74
|
metrika_js_1.default.reachGoal(utils_1.MetrikaCounter.CrossSite, metrikaGoal);
|
@@ -1,9 +1,15 @@
|
|
1
1
|
/* use this for style redefinitions to awoid problems with
|
2
2
|
unpredictable css rules order in build */
|
3
|
+
.bc-posts {
|
4
|
+
position: relative;
|
5
|
+
}
|
3
6
|
.bc-posts__cards-container, .bc-posts__pinned-container {
|
4
7
|
padding-top: 24px;
|
5
8
|
scroll-margin: 48px;
|
6
9
|
}
|
10
|
+
.bc-posts__cards-container_isLoading {
|
11
|
+
opacity: 0.7;
|
12
|
+
}
|
7
13
|
.bc-posts__pagination {
|
8
14
|
display: flex;
|
9
15
|
flex-direction: column;
|
@@ -25,4 +31,23 @@ unpredictable css rules order in build */
|
|
25
31
|
}
|
26
32
|
.bc-posts__paginator {
|
27
33
|
padding-top: 12px;
|
34
|
+
}
|
35
|
+
.bc-posts__loaderContainer {
|
36
|
+
z-index: 6;
|
37
|
+
position: absolute;
|
38
|
+
top: 0;
|
39
|
+
left: 0;
|
40
|
+
width: 70%;
|
41
|
+
height: 100%;
|
42
|
+
background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0.3), rgba(255, 255, 255, 0));
|
43
|
+
animation: shimmer 2s infinite linear;
|
44
|
+
}
|
45
|
+
|
46
|
+
@keyframes shimmer {
|
47
|
+
from {
|
48
|
+
transform: translateX(-200%);
|
49
|
+
}
|
50
|
+
to {
|
51
|
+
transform: translateX(300%);
|
52
|
+
}
|
28
53
|
}
|
@@ -8,7 +8,6 @@ type PostCardProps = {
|
|
8
8
|
postCountOnPage: number;
|
9
9
|
perPageInQuery: number;
|
10
10
|
isFetching: boolean;
|
11
|
-
isShowMoreFetching: boolean;
|
12
11
|
handleShowMore: (value?: MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => Promise<void> | void;
|
13
12
|
handlePageChange: (value: number) => Promise<void> | void;
|
14
13
|
postsOnPage?: PostData[];
|