Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(ActionSheet): rename header to title, text to description #7785

Merged
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
import { ActionSheet, ActionSheetItem } from '@vkontakte/vkui';
import React from 'react';

const App = () => {
return (
<React.Fragment>
<ActionSheet
onClose={() => {}}
header="Вы действительно хотите удалить это видео из Ваших видео?"
text="Данное действие реально удалит видео, подумайте!"
>
<ActionSheetItem mode="destructive">Удалить видео</ActionSheetItem>
</ActionSheet>
</React.Fragment>
);
};
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`action-sheet transforms correctly 1`] = `
"import { ActionSheet, ActionSheetItem } from '@vkontakte/vkui';
import React from 'react';

const App = () => {
return (
(<React.Fragment>
<ActionSheet
onClose={() => {}}
title="Вы действительно хотите удалить это видео из Ваших видео?"
description="Данное действие реально удалит видео, подумайте!"
>
<ActionSheetItem mode="destructive">Удалить видео</ActionSheetItem>
</ActionSheet>
</React.Fragment>)
);
};"
`;
12 changes: 12 additions & 0 deletions packages/codemods/src/transforms/v7/__tests__/action-sheet.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
jest.autoMockOff();

import { defineSnapshotTestFromFixture } from '../../../testHelpers/testHelper';

const name = 'action-sheet';
const fixtures = ['basic'] as const;

describe(name, () => {
fixtures.forEach((test) =>
defineSnapshotTestFromFixture(__dirname, name, global.TRANSFORM_OPTIONS, `${name}/${test}`),
);
});
18 changes: 18 additions & 0 deletions packages/codemods/src/transforms/v7/action-sheet.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,18 @@
import { API, FileInfo } from 'jscodeshift';
import { getImportInfo, renameProp } from '../../codemod-helpers';
import { JSCodeShiftOptions } from '../../types';

export const parser = 'tsx';

export default function transformer(file: FileInfo, api: API, options: JSCodeShiftOptions) {
const { alias } = options;
const j = api.jscodeshift;
const source = j(file.source);
const { localName } = getImportInfo(j, file, 'ActionSheet', alias);

if (localName) {
renameProp(j, source, localName, { header: 'title', text: 'description' });
}

return source.toSource();
}
Original file line number Diff line number Diff line change
Expand Up @@ -84,7 +84,7 @@ const propSets = [
</ActionSheetItem>,
],
],
header: ['Заголовок'],
title: ['Заголовок'],
},
];

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -41,7 +41,7 @@
animation: animation-actionsheet-slide-down var(--vkui--animation_duration_m) var(--vkui--animation_easing_platform);
}

.title + .text {
.title + .description {
margin-block-start: 8px;
}

Expand Down Expand Up @@ -79,7 +79,7 @@
position: relative;
}

.ios .text {
.ios .description {
position: relative;
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -23,8 +23,8 @@ const story: Meta<ActionSheetProps> = {
component: ActionSheet,
parameters: { ...CanvasFullLayout, ...DisableCartesianParam },
argTypes: {
header: StringArg,
text: StringArg,
title: StringArg,
description: StringArg,
},
};

Expand Down Expand Up @@ -109,7 +109,7 @@ export const WithSubtitle: Story = {
export const WithTitle: Story = {
...Base,
args: {
header: 'Вы действительно хотите удалить это видео из Ваших видео?',
title: 'Вы действительно хотите удалить это видео из Ваших видео?',
items: [{ mode: 'destructive', children: 'Удалить видео' }],
},
};
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -206,7 +206,7 @@ describe(ActionSheet, () => {
});

it('renders header and text', () => {
render(<ActionSheetMobile header="The header title" text="Text footnote" />);
render(<ActionSheetMobile title="The header title" description="Text footnote" />);
act(jest.runAllTimers);
expect(screen.queryByText('The header title')).toBeTruthy();
expect(screen.queryByText('Text footnote')).toBeTruthy();
Expand Down
18 changes: 9 additions & 9 deletions packages/vkui/src/components/ActionSheet/ActionSheet.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -26,9 +26,9 @@ export interface ActionSheetProps
SharedDropdownProps,
'toggleRef' | 'popupOffsetDistance' | 'placement' | 'autoFocus'
>,
Omit<React.HTMLAttributes<HTMLDivElement>, 'autoFocus'> {
header?: React.ReactNode;
text?: React.ReactNode;
Omit<React.HTMLAttributes<HTMLDivElement>, 'autoFocus' | 'title'> {
title?: React.ReactNode;
description?: React.ReactNode;
/**
* Закрыть попап по клику снаружи.
*/
Expand All @@ -46,8 +46,8 @@ export interface ActionSheetProps
export const ActionSheet = ({
children,
className,
header,
text,
title,
description,
style,
iosCloseItem,
popupOffsetDistance,
Expand Down Expand Up @@ -114,14 +114,14 @@ export const ActionSheet = ({
style={mode === 'menu' ? style : undefined}
>
<div className={styles.contentWrapper}>
{(header || text) && (
{(title || description) && (
<div className={styles.header}>
{header && (
{title && (
<Footnote weight="2" className={styles.title}>
{header}
{title}
</Footnote>
)}
{text && <Footnote className={styles.text}>{text}</Footnote>}
{description && <Footnote className={styles.description}>{description}</Footnote>}
</div>
)}
{children}
Expand Down
4 changes: 2 additions & 2 deletions packages/vkui/src/components/ActionSheet/Readme.md
Original file line number Diff line number Diff line change
Expand Up @@ -147,7 +147,7 @@ const SelectableActionSheet = () => {
const speeds = ['0.25x', '0.5x', '0.75x', 'Нормальная', '1.25x', '1.5x', '2x', '3x'];

return (
<ActionSheet header="Изменить скорость видео" onClose={onClose} toggleRef={selectableTargetRef}>
<ActionSheet title="Изменить скорость видео" onClose={onClose} toggleRef={selectableTargetRef}>
{speeds.map((speed) => (
<ActionSheetItem
onChange={onChange}
Expand All @@ -170,7 +170,7 @@ const openTitle = () =>
'title',
<ActionSheet
onClose={onClose}
header="Вы действительно хотите удалить это видео из Ваших видео?"
title="Вы действительно хотите удалить это видео из Ваших видео?"
toggleRef={titleTargetRef}
>
<ActionSheetItem mode="destructive">Удалить видео</ActionSheetItem>
Expand Down
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading