Skip to content

Commit b682e0f

Browse files
committed
feat(HorizontalCellShowMore): change size values
feat(ScrollArrow): change size values
1 parent 5ebbcab commit b682e0f

File tree

45 files changed

+200
-84
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

45 files changed

+200
-84
lines changed
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import { Gallery, HorizontalScroll, ScrollArrow } from '@vkontakte/vkui';
2+
import React from 'react';
3+
4+
const App = () => {
5+
return (
6+
<React.Fragment>
7+
<ScrollArrow direction='down' size='m' />
8+
<ScrollArrow direction='left' size='l' />
9+
<HorizontalScroll arrowSize='m' />
10+
<HorizontalScroll arrowSize='l' />
11+
<Gallery arrowSize='m' />
12+
<Gallery arrowSize='l' />
13+
</React.Fragment>
14+
);
15+
};

packages/codemods/src/transforms/v7/__tests__/__snapshots__/horizontal-cell-show-more.ts.snap

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ import '@vkontakte/vkui/dist/vkui.css';
88
const App = () => {
99
return (
1010
(<React.Fragment>
11-
<HorizontalCellShowMore size="l" height={88} />
12-
<HorizontalCellShowMore size="l" height={88} />
11+
<HorizontalCellShowMore size="m" height={88} />
12+
<HorizontalCellShowMore size="m" height={88} />
1313
<HorizontalCellShowMore size="s" height={88} />
1414
</React.Fragment>)
1515
);
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
// Jest Snapshot v1, https://goo.gl/fbAQLP
2+
3+
exports[`scroll-arrow transforms correctly 1`] = `
4+
"import { Gallery, HorizontalScroll, ScrollArrow } from '@vkontakte/vkui';
5+
import React from 'react';
6+
7+
const App = () => {
8+
return (
9+
(<React.Fragment>
10+
<ScrollArrow direction='down' size="s" />
11+
<ScrollArrow direction='left' size="m" />
12+
<HorizontalScroll arrowSize="s" />
13+
<HorizontalScroll arrowSize="m" />
14+
<Gallery arrowSize="s" />
15+
<Gallery arrowSize="m" />
16+
</React.Fragment>)
17+
);
18+
};"
19+
`;
Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
jest.autoMockOff();
2+
3+
import { defineSnapshotTestFromFixture } from '../../../testHelpers/testHelper';
4+
5+
const name = 'scroll-arrow';
6+
const fixtures = ['basic'] as const;
7+
8+
describe(name, () => {
9+
fixtures.forEach((test) =>
10+
defineSnapshotTestFromFixture(__dirname, name, global.TRANSFORM_OPTIONS, `${name}/${test}`),
11+
);
12+
});

packages/codemods/src/transforms/v7/horizontal-cell-show-more.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -30,12 +30,12 @@ function sizeManipulator(api: API, attribute: ASTPath<JSXAttribute>) {
3030

3131
if (node.value?.type === 'StringLiteral') {
3232
if (node.value.value !== 's') {
33-
node.value = api.jscodeshift.stringLiteral('l');
33+
node.value = api.jscodeshift.stringLiteral('m');
3434
}
3535
} else {
3636
report(
3737
api,
38-
`Manual changes required for ${componentName}'s "size" prop. Use "s" or "l" value only.`,
38+
`Manual changes required for ${componentName}'s "size" prop. Use "s" or "m" value only.`,
3939
);
4040
}
4141
}
Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
import { API, ASTPath, FileInfo, JSXAttribute } from 'jscodeshift';
2+
import { getImportInfo } from '../../codemod-helpers';
3+
import { report } from '../../report';
4+
import { JSCodeShiftOptions } from '../../types';
5+
6+
export const parser = 'tsx';
7+
8+
const componentName = 'ScrollArrow';
9+
const affectedComponents = ['HorizontalScroll', 'Gallery'];
10+
11+
function arrowSizeManipulator(api: API, attribute: ASTPath<JSXAttribute>) {
12+
const node = attribute.node;
13+
14+
if (node.value?.type === 'StringLiteral') {
15+
const oldValue = node.value.value;
16+
const newValue = oldValue === 'm' ? 's' : oldValue === 'l' ? 'm' : undefined;
17+
if (newValue) {
18+
node.value = api.jscodeshift.stringLiteral(newValue);
19+
}
20+
} else {
21+
report(
22+
api,
23+
`Manual changes required for ${componentName}'s "size" prop. Use "s" or "m" value only.`,
24+
);
25+
}
26+
}
27+
28+
export default function transformer(file: FileInfo, api: API, options: JSCodeShiftOptions) {
29+
const { alias } = options;
30+
const j = api.jscodeshift;
31+
const source = j(file.source);
32+
const { localName } = getImportInfo(j, file, componentName, alias);
33+
const { localName: horizontalScrollLocalName } = getImportInfo(
34+
j,
35+
file,
36+
affectedComponents[0],
37+
alias,
38+
);
39+
const { localName: galleryLocalName } = getImportInfo(j, file, affectedComponents[1], alias);
40+
41+
if (!localName) {
42+
return source.toSource();
43+
}
44+
45+
source
46+
.find(j.JSXOpeningElement)
47+
.filter(
48+
(path) => path.value.name.type === 'JSXIdentifier' && path.value.name.name === localName,
49+
)
50+
.find(j.JSXAttribute, { name: { name: 'size' } })
51+
.forEach((attribute) => {
52+
arrowSizeManipulator(api, attribute);
53+
});
54+
55+
source
56+
.find(j.JSXOpeningElement)
57+
.filter(
58+
(path) =>
59+
path.value.name.type === 'JSXIdentifier' &&
60+
[horizontalScrollLocalName, galleryLocalName].includes(path.value.name.name),
61+
)
62+
.find(j.JSXAttribute, { name: { name: 'arrowSize' } })
63+
.forEach((attribute) => {
64+
arrowSizeManipulator(api, attribute);
65+
});
66+
67+
return source.toSource();
68+
}

packages/vkui/src/components/BaseGallery/BaseGallery.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@ export const BaseGallery = ({
5353
align = 'left',
5454
showArrows,
5555
getRef,
56-
arrowSize = 'l',
56+
arrowSize = 'm',
5757
...restProps
5858
}: BaseGalleryProps): React.ReactNode => {
5959
const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});

packages/vkui/src/components/BaseGallery/CarouselBase/CarouselBase.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export const CarouselBase = ({
4646
align = 'left',
4747
showArrows,
4848
getRef,
49-
arrowSize = 'l',
49+
arrowSize = 'm',
5050
...restProps
5151
}: BaseGalleryProps): React.ReactNode => {
5252
const slidesStore = React.useRef<Record<string, HTMLDivElement | null>>({});

packages/vkui/src/components/Gallery/Gallery.e2e-playground.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -59,7 +59,7 @@ export const GalleryWithArrowsPlayground = (props: ComponentPlaygroundProps) =>
5959
return (
6060
<ComponentPlayground {...props}>
6161
{(props: GalleryProps) => (
62-
<Gallery initialSlideIndex={1} data-testid="gallery" arrowSize="m" showArrows {...props}>
62+
<Gallery initialSlideIndex={1} data-testid="gallery" arrowSize="s" showArrows {...props}>
6363
{getItems()}
6464
</Gallery>
6565
)}

packages/vkui/src/components/HorizontalCell/Readme.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -152,12 +152,12 @@ const Example = () => {
152152
<Panel id="horizontalCell">
153153
<PanelHeader>HorizontalCell</PanelHeader>
154154
<Group header={<Header>Возможные друзья</Header>}>
155-
<HorizontalScroll>
155+
<HorizontalScroll arrowSize="s">
156156
<UserItems />
157157
</HorizontalScroll>
158158
</Group>
159159
<Group header={<Header after={<Link>Показать все</Link>}>Мини-приложения</Header>}>
160-
<HorizontalScroll>
160+
<HorizontalScroll arrowSize="s">
161161
<MiniAppItems />
162162
</HorizontalScroll>
163163
</Group>

0 commit comments

Comments
 (0)