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.

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

Rewrite to TS #1327

Merged
merged 20 commits into from
Feb 8, 2021
Merged

Rewrite to TS #1327

merged 20 commits into from
Feb 8, 2021

Conversation

jakub-gonet
Copy link
Member

@jakub-gonet jakub-gonet commented Feb 2, 2021 •
edited
Loading

Description

This PR combines three others (#1273, #1280, #1291) and rewrites Gesture Handler and examples to TS.
We tried to make non-breaking changes but this should be tested.

Most types were overhauled, although they should remain compatible with old ones thanks to the type aliases in the src/handlers/gestureHandlerTypesCompat.ts file.

CI for iOS was disabled due to strange fails. It should be reenabled when we add unit/e2e tests to RNGH.

Fixes #1076 - removed Flow from DrawerLayout
Fixes #1261 - added TS types
Fixes #998 - regenerated example app
Fixes #887 - removed prop types

Changes

Package packing, configs & source code

  • Swipeable and DrawerLayout are now resolved by their own package.jsons
  • React Native uses source code directly, browser and TS use files from dist/
  • Removed prop types

Internal

  • Removed unused babel config in the root dir, adjust Eslint config
  • Removed unused functions
  • Changed private names from _name to private name
  • Replaced x && x() syntax with x.?()

Types

  • Added types compatibility layer for the new types (gestureHandlerTypesCompat.ts)
  • Added generation of declarations and declarations map when TS is transpiled
  • Moved types from declaration files to files with implementation
  • Added types to Android / iOS / shared JS code
  • Added basic types to the web version

Example app

  • Removed unused bits in examples
  • Regenerated Example app with latest RN
  • Removed stray files from examples/
  • Updated Travis config to include newer Android build tools & iOS scheme name change
  • Organized Example code structure
  • Removed Example tests (they weren't testing anything)
  • Reconfigured web version of examples

Testing

PRs that were merged into ts-rewrite branch were tested by using npm pack and adding it to the new app. In the case of #1273 & #1280, we additionally checked bundled diff for changes.

We diffed master to generated dist/ directory using diff --color -wryN -W 200 src/ dist/srcwith imports removed by find src -name "*.js" -type f -exec sed -i '' '/import/d' {} \;

jakub-gonet and others added 5 commits December 17, 2020 13:58
@jakub-gonet @WoLewicki
Rewrite Examples to TS (#1273)
8ad2f16 
Co-authored-by: WoLewicki <wojciech.lewicki@swmansion.com>
@jakub-gonet
Merge branch 'master' into ts-rewrite
4b6f9e2
@jakub-gonet
Migrate source files to Typescript (#1280)
04080a9
@jakub-gonet @WoLewicki
Add TS types to the files (#1291)
a3a6c0a 
## Description

### Session 3: Honky Tonk Rewrite

Last part of the TS rewrite process, in this PR we transfer types from declaration files to their implementations and add missing types for other functions and components.

Change lists are probably not exhaustive but we tried to write most of the changes.

## Changes

### TS

- Removed declaration files for Swipeable and DrawerLayout components.
- Added types compatibility layer for the new types (`gestureHandlerTypesCompat.ts`).
- Added generation of declarations and declarations map when TS is transpiled.

#### Internal

- Added types for all files used in RN.
- Added basic types for the web version.
- Mark web base classes as abstract (DiscreteGH, DraggingGH, etc).

### Source code

- Added `"browser"` target and updated targets for source and types for Swipeable and DrawerLayout components `package.json`s.
- Removed babel config for the main module, moved to examples.
- Changed `"react-native"` entry point to `index.ts` (this ensures that clients using RN will load source instead of TS transpiled files).
- Changed `"types"` to `"dist/index.d.ts"`.

#### Internal

- Changed most underscore prefixed function to non-prefixed, private functions.
- Removed not used functions and arguments.
- Replaced `x && x()` with `x.?()` in various places.
- Removed prop types and replace them with lists of strings when necessary.

### Misc

#### Internal

- [Changed some TS-specific Eslint rules to "warn" mode.](https://github.com/software-mansion/react-native-gesture-handler/pull/1291/files#diff-6884918dc8291219be508e05e28965b958c734def85324f3b53858ea4702090fR22-R26)
- Removed `no-use-before-define` rule.
- Example's Eslint config extends root config.
- Added support for the web version of Examples.
- `State` and `NativeViewGestureHandler` are now named export internally.
- Renamed `Gestures` to `gestureHandlers `.
- Added `lint` npm script.


## TODO

- [ ] Fill diff between master / ts-rewrite and this PR
- [x] Update links referencing files in the docs
- [ ] List all deprecations and breaking changes
- [x] List all notable changes
- [ ] Review TODOs, `eslint-ignore`s, `@ts-ignore`s, and `@ts-nocheck`s

## Missing types

- [x] `src/components/GestureComponents.web.tsx`
- [x] `src/web/DiscreteGestureHandler.ts`
- [x] `src/web/DraggingGestureHandler.ts`
- [x] `src/web/FlingGestureHandler.ts`
- [x] `src/web/GestureHandler.ts`
- [x] `src/web/IndiscreteGestureHandler.ts`
- [x] `src/web/LongPressGestureHandler.ts`
- [x] `src/web/NativeViewGestureHandler.ts`
- [x] `src/web/PanGestureHandler.ts`
- [x] `src/web/PinchGestureHandler.ts`
- [x] `src/web/PressGestureHandler.ts`
- [x] `src/web/RotationGestureHandler.ts`
- [x] `src/web/TapGestureHandler.ts`

## Further improvements mentioned in review comments

- #1291 (comment)

## Test plan

This will be tested by manually checking examples.

Future PRs can be checked by comparing bundle output (create two packages from master and this branch using `npm pack`, install one and then second later, create two bundles via `yarn react-native bundle --entry-file=index.js --bundle-output=rngh.bundle --reset-cache --minify=false`, and compare results with `diff rngh.bundle rngh.ts.bundle`). This PR is too big (18k diff) so we didn't do that.

Co-authored-by: Jakub <jakub.gonet@swmansion.com>
Co-authored-by: WoLewicki <wojciech.lewicki@swmansion.com>
@jakub-gonet
Merge branch 'master' into ts-rewrite
23724df
@jakub-gonet jakub-gonet self-assigned this Feb 2, 2021
WoLewicki
WoLewicki reviewed Feb 3, 2021
View reviewed changes
Copy link
Member

@WoLewicki WoLewicki left a comment

Choose a reason for hiding this comment

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

Looks good! Left some comments.

.eslintrc.json Outdated Show resolved Hide resolved
.travis.yml Show resolved Hide resolved
examples/Example/android/app/build.gradle Show resolved Hide resolved
examples/Example/android/app/build.gradle Show resolved Hide resolved
examples/Example/src/bottomSheet/index.tsx Outdated Show resolved Hide resolved
examples/Example/tsconfig.json Show resolved Hide resolved
package.json Outdated Show resolved Hide resolved
package.json Show resolved Hide resolved
src/components/Swipeable.tsx Outdated Show resolved Hide resolved
tsconfig.json Outdated Show resolved Hide resolved
@jakub-gonet jakub-gonet marked this pull request as ready for review February 8, 2021 13:37
@jakub-gonet
Copy link
Member Author

Thanks @WoLewicki for huge help with that.

@jakub-gonet jakub-gonet merged commit 8d67924 into master Feb 8, 2021
@jakub-gonet jakub-gonet deleted the ts-rewrite branch February 8, 2021 14:20
mrousavy pushed a commit to mrousavy/react-native-gesture-handler that referenced this pull request Feb 11, 2021
@jakub-gonet @WoLewicki @mrousavy
Rewrite to TS (software-mansion#1327)
6720da5 
This PR combines three others (software-mansion#1273, software-mansion#1280, software-mansion#1291) and rewrites Gesture Handler and examples to TS.
We tried to make non-breaking changes but this should be tested.

Most types were overhauled, although they should remain compatible with old ones thanks to the type aliases in the `src/handlers/gestureHandlerTypesCompat.ts` file.

CI for iOS was disabled due to strange fails. It should be reenabled when we add unit/e2e tests to RNGH.

Fixes software-mansion#1076 - removed Flow from DrawerLayout
Fixes software-mansion#1261 - added TS types
Fixes software-mansion#998 - regenerated example app
Fixes software-mansion#887 - removed prop types

- Swipeable and DrawerLayout are now resolved by their own `package.json`s
- React Native uses source code directly, browser and TS use files from `dist/`
- Removed prop types

- Removed unused babel config in the root dir, adjust Eslint config
- Removed unused functions
- Changed private names from `_name` to `private name`
- Replaced `x && x()` syntax with `x.?()`

- Added types compatibility layer for the new types (`gestureHandlerTypesCompat.ts`)
- Added generation of declarations and declarations map when TS is transpiled
- Moved types from declaration files to files with implementation
- Added types to Android / iOS / shared JS code
- Added basic types to the web version

- Removed unused bits in examples
- Regenerated Example app with latest RN
- Removed stray files from examples/
- Updated Travis config to include newer Android build tools & iOS scheme name change
- Organized Example code structure
- Removed Example tests (they weren't testing anything)
- Reconfigured web version of examples

PRs that were merged into `ts-rewrite` branch were tested by using `npm pack` and adding it to the new app. In the case of software-mansion#1273 & software-mansion#1280, we additionally checked bundled diff for changes.

We diffed master to generated dist/ directory using `diff --color -wryN -W 200 src/ dist/src`with imports removed by `find src -name "*.js" -type f -exec sed -i '' '/import/d' {} \;`

Co-authored-by: WoLewicki <wojciech.lewicki@swmansion.com>
Co-authored-by: Jakub <jakub.gonet@swmansion.com>
braincore pushed a commit to braincore/react-native-gesture-handler that referenced this pull request Mar 4, 2021
@jakub-gonet @WoLewicki @braincore
Rewrite to TS (software-mansion#1327)
fb4e121 
## Description

This PR combines three others (software-mansion#1273, software-mansion#1280, software-mansion#1291) and rewrites Gesture Handler and examples to TS.
We tried to make non-breaking changes but this should be tested.

Most types were overhauled, although they should remain compatible with old ones thanks to the type aliases in the `src/handlers/gestureHandlerTypesCompat.ts` file.

CI for iOS was disabled due to strange fails. It should be reenabled when we add unit/e2e tests to RNGH.

Fixes software-mansion#1076 - removed Flow from DrawerLayout
Fixes software-mansion#1261 - added TS types
Fixes software-mansion#998 - regenerated example app
Fixes software-mansion#887 - removed prop types

## Changes

### Package packing, configs & source code

- Swipeable and DrawerLayout are now resolved by their own `package.json`s
- React Native uses source code directly, browser and TS use files from `dist/`
- Removed prop types

#### Internal

- Removed unused babel config in the root dir, adjust Eslint config
- Removed unused functions
- Changed private names from `_name` to `private name`
- Replaced `x && x()` syntax with `x.?()`

### Types

- Added types compatibility layer for the new types (`gestureHandlerTypesCompat.ts`)
- Added generation of declarations and declarations map when TS is transpiled
- Moved types from declaration files to files with implementation
- Added types to Android / iOS / shared JS code
- Added basic types to the web version

### Example app

- Removed unused bits in examples
- Regenerated Example app with latest RN
- Removed stray files from examples/
- Updated Travis config to include newer Android build tools & iOS scheme name change
- Organized Example code structure
- Removed Example tests (they weren't testing anything)
- Reconfigured web version of examples

## Testing

PRs that were merged into `ts-rewrite` branch were tested by using `npm pack` and adding it to the new app. In the case of software-mansion#1273 & software-mansion#1280, we additionally checked bundled diff for changes.

We diffed master to generated dist/ directory using `diff --color -wryN -W 200 src/ dist/src`with imports removed by `find src -name "*.js" -type f -exec sed -i '' '/import/d' {} \;`

Co-authored-by: WoLewicki <wojciech.lewicki@swmansion.com>
Co-authored-by: Jakub <jakub.gonet@swmansion.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@WoLewicki WoLewicki WoLewicki left review comments

Assignees

@jakub-gonet jakub-gonet

Labels
None yet
Projects
None yet
Milestone
No milestone
2 participants
@jakub-gonet @WoLewicki