feat(Root/View): Add a hook to know animation transition direction

[mendrew]

resolves: #4981

Описание

Требуется предоставить хук, чтобы дать возможность определять панель была отрисована с анимацией перехода вперёд или назад. Удобно для загрузки данных при переходе вперёд и выгрузке данных из кэша при переходе назад.
useNavDirection().

Переход можно осуществить как с одного View на другой внутри одного Root, так и с одного Panel на другой внутри одного View.

Компоненты Root и View хранят в себе состояние (isBack) с помощью которого можно определить анимацию перехода.

Для решения задачи был создан отдельный контекст NavTransitionDirectionContext в провайдер которого передается значение isBack. В провайдер обернут каждый View внутри Root и каждый Panel внутри View.

Одним из требований было исключить ненужный ре-рендеринг компонента, использующего этот хук. Значение direction, возвращаемое хуком useNavDirection(), должно быть известно при маунте компонента в панели и не меняться после этого.
Для этого значение isBack запоминается один раз при инициализации стейта при маунте провайдера Panel/View и передается дальше уже без изменений. Хук берёт ближайшее значение из контекста NavTransitionDirectionContext
и анализирует.

Изменения

• обернул каждый View и Panel в контекст провайдер NavTransitionDirectionProvider и передаю isBack.
• внутри NavTransitionDirectionProvider для передачи isBack анализирую значение из родительского контекста, если есть, и дочернего. Родительский контекст чаще всего это значение из Root, а дочерний это значение из View.
  Наиболее приоритетно значение из View, но если оно undefined, то это значит, что переход был осуществлён между View внутри Root, а не Panel внутри View.
• внутри NavTransitionDirectionProvider значение isBack запоминается один раз при маунте и уже не меняется, специально чтобы исключить ре-рендеринг без надобности в компонентах использующик хук и контекст.
• перестал сбрасывать isBack в undefined после окончания перехода, потому что это не имеет смысла, мы никак этот факт не используем, а также мешает предоставлению значения через контекст (можно было бы это и обойти, но код бы усложнился без надобности).
• Дублирую тесты из View.test.tsx в ViewInfinite. Потому что из-за пары изменений в файле компонета codecov стал падать, потому что покрытие тестами уменьшелось. Альтернативный вариант, чтобы не дублировать код э то исключить из code coverage ViewInfinite, так как он влияет на покрыте тестами, а сам компонент тестируется внутри View.test.tsx.
  Такой вариант мне больше нравится, но также так можно упустить и не применить во ViewInfinite те же изменения, что могут быть сделаны и покрыты тестами во View. Так себе аргумент, правда.
  

  VKUI/packages/vkui/src/components/View/ViewInfinite.tsx

  Lines 1 to 2 in 60c686f

  	/* istanbul ignore file */
  	// ignore test coverage for this file because we test it inside the View.test.tsx

• обновил документацию, чтобы рассказать про useNavDirection()
• проверил что хук работает как с анимациями, так и без. А также при свайпе в iOS.

[codesandbox-ci]

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.

Latest deployment of this branch, based on commit 676cd7b:

Sandbox	Source
VKUI TypeScript	Configuration

[github-actions]

👀 Docs deployed

• Styleguide
• Storybook

Commit 676cd7b

[github-actions]

size-limit report 📦

Path	Size
JS	314.24 KB (+0.14% 🔺)
JS (gzip)	91.98 KB (+0.14% 🔺)
JS (brotli)	76.22 KB (+0.12% 🔺)
JS import Div (tree shaking)	2.97 KB (0%)
CSS	276.34 KB (0%)
CSS (gzip)	36.06 KB (0%)
CSS (brotli)	28.61 KB (0%)

[codecov]

Codecov Report

Patch coverage: 100.00% and project coverage change: +0.09% 🎉

Comparison is base (250b33f) 81.83% compared to head (676cd7b) 81.93%.
Report is 12 commits behind head on master.

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #5567      +/-   ##
==========================================
+ Coverage   81.83%   81.93%   +0.09%     
==========================================
  Files         289      290       +1     
  Lines        9655     9686      +31     
  Branches     3073     3080       +7     
==========================================
+ Hits         7901     7936      +35     
+ Misses       1754     1750       -4     

Flag	Coverage Δ
unittests	81.93% <100.00%> (+0.09%)	⬆️

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

Files Changed	Coverage Δ
...DirectionContext/NavTransitionDirectionContext.tsx	100.00% <100.00%> (ø)
packages/vkui/src/components/Root/Root.tsx	97.29% <100.00%> (+0.03%)	⬆️
packages/vkui/src/components/View/View.tsx	92.98% <100.00%> (+0.45%)	⬆️
packages/vkui/src/components/View/ViewInfinite.tsx	91.27% <100.00%> (+0.06%)	⬆️

... and 2 files with indirect coverage changes

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

[github-actions]

e2e tests

Playwright Report

[inomdzhon]

Класс 🔥 🚀

одну опечаточку увидел :)