8000 feat(DirectionProvider): add direction to ConfigProvider by EldarMuhamethanov · Pull Request #8236 · VKCOM/VKUI · GitHub
[go: up one dir, main page]
More Web Proxy on the site http://driver.im/
Skip to content

feat(DirectionProvider): add direction to ConfigProvider #8236

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.

Sign up for GitHub

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

Jump to bottom
Merged
merged 24 commits into from
Feb 24, 2025
Merged

feat(DirectionProvider): add direction to ConfigProvider #8236

merged 24 commits into from
Feb 24, 2025

Conversation

EldarMuhamethanov
Copy link
Contributor
  • Unit-тесты
  • e2e-тесты
  • Документация фичи
  • Release notes

Описание

Текущий подход использует хук useDirection, который определяет direction через getComputedStyle при каждой первой отрисовке компонента. При большом количестве компонентов это влияет на производительность.

Предлагаемое решение

Добавить direction как параметр в ConfigProvider, который можно:

  • Задать вручную
  • Определить автоматически из стиля direction у body
Преимущества Недостатки
✅ Однократное определение direction при запуске страницы ❌ При использовании DirectionProvider обязательно указывать атрибут dir у children
✅ Получение direction через хук useConfigDirection из контекста ❌ Требуется больше кода по сравнению с текущим решением (прокидывание dir="rtl")
✅ Возможность переопределения направления для части страницы через DirectionProvider
✅ Поддержка изменения направления без перезагрузки страницы

Изменения

  1. Добавлено свойство direction в ConfigProvider
  2. Создан компонент DirectionProvider для переопределения direction
  3. Добавлены:
    • Документация
    • Тесты
    • Storybook stories
  4. Выполнен рефакторинг компонентов для использования useConfigDirection
  5. Доработал ComponentPlayground так чтобы поддерживался рендеринг компонентов в rtl
  6. Удалена функция mockRtlDirection

Release notes

Новые компоненты

  • DirectionProvider: добавлен компонент для переопределения direction

Улучшения

  • ConfigProvider: Добавлен параметр direction, который по умолчанию определяется исходя из атрибута dir в body страницы

@EldarMuhamethanov EldarMuhamethanov added this to the v7.2.0 milestone Feb 4, 2025
@EldarMuhamethanov EldarMuhamethanov self-assigned this Feb 4, 2025
@EldarMuhamethanov EldarMuhamethanov requested a review from a team as a code owner February 4, 2025 12:58
@EldarMuhamethanov EldarMuhamethanov marked this pull request as draft February 4, 2025 12:58
@github-actions GitHub Actions
Copy link
Contributor
github-actions bot commented Feb 4, 2025 •
edited
Loading

size-limit report 📦

Path Size
JS 396.37 KB (-0.18% 🔽)
JS (gzip) 120.36 KB (-0.2% 🔽)
JS (brotli) 98.96 KB (-0.18% 🔽)
JS import Div (tree shaking) 1.56 KB (0%)
CSS 348.36 KB (0%)
CSS (gzip) 43.13 KB (0%)
CSS (brotli) 34.45 KB (0%)

@codesandbox-ci CodeSandbox CI
Copy link
codesandbox-ci bot commented Feb 4, 2025 •
edited
Loading

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

@github-actions GitHub Actions
Copy link
Contributor
github-actions bot commented Feb 4, 2025 •
edited
Loading

e2e tests

Playwright Report

@github-actions GitHub Actions
Copy link
Contributor
github-actions bot commented Feb 4, 2025 •
edited
Loading

👀 Docs deployed

Commit 550b194

@codecov Codecov
Copy link
codecov bot commented Feb 4, 2025 •
edited
Loading

Codecov Report

Attention: Patch coverage is 98.66667% with 1 line in your changes missing coverage. Please review.

Project coverage is 95.46%. Comparing base (85f232e) to head (550b194).
Report is 30 commits behind head on master.

Files with missing lines Patch % Lines
packages/vkui/src/hooks/useAutoDetectDirection.ts 90.90% 1 Missing ⚠️
Additional details and impacted files 
@@            Coverage Diff             @@
##           master    #8236      +/-   ##
==========================================
- Coverage   95.54%   95.46%   -0.09%     
==========================================
  Files         404      406       +2     
  Lines       11641    11610      -31     
  Branches 
8000
    3859     3847      -12     
==========================================
- Hits        11122    11083      -39     
- Misses        519      527       +8
Flag Coverage Δ
unittests 95.46% <98.66%> (-0.09%) ⬇️

Flags with carried forward coverage won't be shown. Click here to find out more.

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@EldarMuhamethanov EldarMuhamethanov marked this pull request as ready for review February 4, 2025 13:58
@EldarMuhamethanov
Merge branch 'master' into e.muhamethanov/rtl/direction-provider
c46a80a 
# Conflicts:
#	packages/vkui/src/components/Pagination/Pagination.tsx
#	packages/vkui/src/testing/e2e/ComponentPlayground.tsx
andrey-medvedev-vk
andrey-medvedev-vk reviewed Feb 11, 2025
View reviewed changes
Copy link
Contributor
@andrey-medvedev-vk andrey-medvedev-vk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Отличная работа 🎉

andrey-medvedev-vk
andrey-medvedev-vk previously approved these changes Feb 11, 2025
View reviewed changes
Copy link
Contributor
@andrey-medvedev-vk andrey-medvedev-vk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🔥

inomdzhon
inomdzhon reviewed Feb 11, 2025
View reviewed changes
Copy link
Contributor
@inomdzhon inomdzhon left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🚀

@EldarMuhamethanov @inomdzhon
doc: add @SInCE to doc
b5db80c 
Co-authored-by: Inomdzhon Mirdzhamolov <i.mirdzhamolov@vk.team>
andrey-medvedev-vk
andrey-medvedev-vk approved these changes Feb 24, 2025
View reviewed changes
Copy link
Contributor
@andrey-medvedev-vk andrey-medvedev-vk left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💅

@inomdzhon inomdzhon merged commit 5631bfb into master Feb 24, 2025
28 of 29 checks passed
@inomdzhon inomdzhon deleted the e.muhamethanov/rtl/direction-provider branch February 24, 2025 16:30
@vkcom-publisher
Copy link
Contributor
✅ v7.2.0 🎉

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@inomdzhon inomdzhon inomdzhon approved these changes

@andrey-medvedev-vk andrey-medvedev-vk andrey-medvedev-vk approved these changes

Assignees

@EldarMuhamethanov EldarMuhamethanov

Labels
cmp:config-provider technical task
Projects
VKUI
Archived in project
Milestone
v7.2.0
Development

Successfully merging this pull request may close these issues.
4 participants
@EldarMuhamethanov @vkcom-publisher @inomdzhon @andrey-medvedev-vk
0