Rewrite Examples to TS #1273

jakub-gonet · 2020-12-12T11:34:18Z

Description

Session 1: Example Blues

This is the first part of moving into Typescript. Using TS types in Examples will allow us to test breaking changes to TS types API in the future PRs.

Note

During the rewrite, we spotted that RNGH TouchableNativeFeedback type in react-native-gesture-handler.d.ts does not expose static fields of RN's implementation. This is something that should be fixed in follow-up PRs.

Changes

Removed unused bits in examples
Regenerated Example app with latest RN
Added Eslint & Prettier config file in the root directory
Removed stray files from examples/
Updated Travis config to include newer Android build tools & iOS scheme name change
Moved Example code into src/
Removed Example tests

Test plan

I ran a diff on two npm packed version of the library and only changes that were present were related to reformatting.

Manually investigating TS errors & running example app.

TODO

Rewrite every example to TS
Make sure this change won't break packaging the library
Test every example on Android
Test every example on iOS
~~Test every example on Web~~ We don't have setup ready, this can be verified in the follow-up PRs.

It was copied entirely to Example

jakub-gonet

Reviewed most of the configuration.

~~IMO examples/App.tsx should be removed~~ Resolved in dcd454e
~~ExampleTests.m should be commented out (or wrapped in ifdef) – those tests won't work but they may be convenient for future reference.~~ Resolved in 830ee3c
~~We should re-add MBFingerTipWindow lib, it's used for creating GIFs of RNGH and presentations.~~ Resolved in 392a5ea
~~We should add the new logo of SWM instead of only removing the old one~~ Already done, didn't notice.

examples/Example/android/gradle.properties

examples/Example/app.json

examples/Example/config.tsx

package.json

tsconfig.json

Seems like it's not present in scripts

examples/Example/src/bottomSheet/index.tsx

jkadamczyk

If that's not too much of work we can think of getting rid of some of these _underscore prefixed class fields

examples/Example/src/swipeable/GmailStyleSwipeableRow.tsx

examples/Example/src/bottomSheet/index.tsx

This was causing problems with packaging relase version of Example

## 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.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 #1273 & #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 <[email protected]> Co-authored-by: Jakub <[email protected]>

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 <[email protected]> Co-authored-by: Jakub <[email protected]>

## 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 <[email protected]> Co-authored-by: Jakub <[email protected]>

WoLewicki and others added 18 commits December 8, 2020 16:46

feat: move Example to Example.old

94368a5

feat: add ts Example project

717d75c

feat: add first look on RNGH resolving

8e35731

feat: add working Android and iOS

4bc169e

feat: rewrite all files to TS

59898c1

fix: remove some TODOs

6e2cd18

fix: ref types and comment

2c3dd38

fix: remove some more TODOs

20d6807

fix: rest of issues

1dfb2e9

Add resolver module for eslint

97f3b05

Remove Example.old

e4c22cf

It was copied entirely to Example

Remove unncessary config files

0783a15

Remove @Format directive in tests

d4c5b38

Add types for react-test-renderer

44a2c3e

Remove buck

64ae488

Register RNGH root view

af97c69

Merge branch 'master' into @wolewicki/example-to-ts

f059a61

Add missing eslint resolver configuration

df1ba1a

jakub-gonet changed the base branch from master to ts-rewrite December 12, 2020 11:41

jakub-gonet commented Dec 12, 2020

View reviewed changes

jakub-gonet added 10 commits December 12, 2020 17:38

Update iOS project data

d018a00

Update travis config

0358b50

Use xcpretty and remove sdkmanager --licences

3906c79

Seems like it's not present in scripts

Add build tools 28.0.3 to android build

7071d51

Re-add MBFingerTipWindow library

392a5ea

Comment out iOS test

830ee3c

Move jestSetup & webpack config to Example

ec13c51

Add @types/jest

f62da06

Remove jest test for Example

dcd91e1

Move files into src/ dir

cac9ebd

WoLewicki and others added 5 commits December 14, 2020 15:47

fix: unused vars in swipeable

24d8693

fix: change name to Example

0b0911b

fix: change android app display name

d60704b

fix: remove unused import

700ad53

Don't generate declarations and include only ts files

159323f

jakub-gonet marked this pull request as ready for review December 14, 2020 21:37

jkadamczyk reviewed Dec 15, 2020

View reviewed changes

examples/Example/src/bottomSheet/index.tsx Outdated Show resolved Hide resolved

jkadamczyk reviewed Dec 15, 2020

View reviewed changes

examples/Example/src/bottomSheet/index.tsx Outdated Show resolved Hide resolved

jkadamczyk reviewed Dec 15, 2020

View reviewed changes

Remove _ prefix from orivate variables

4a246de

WoLewicki reviewed Dec 15, 2020

View reviewed changes

examples/Example/src/swipeable/GmailStyleSwipeableRow.tsx Outdated Show resolved Hide resolved

WoLewicki reviewed Dec 15, 2020

View reviewed changes

examples/Example/src/bottomSheet/index.tsx Outdated Show resolved Hide resolved

Fix some Component<{}> type errors

ebc0d58

jakub-gonet mentioned this pull request Dec 15, 2020

Fix typo in example alert output #1276

Closed

jakub-gonet added 8 commits December 16, 2020 17:43

Add typescript eslint packages

11314d3

Update lint config

30d103e

Use escape codes

1c97274

Fix eslint warnings

5cde8f2

Merge branch 'master' into @wolewicki/example-to-ts

fd3a541

Update Podfile.lock

5d18902

Remove Reanimated from Example

8f6ca4d

Rename index.tsx to index.js

00cbf5d

This was causing problems with packaging relase version of Example

jakub-gonet merged commit 8ad2f16 into ts-rewrite Dec 17, 2020

jakub-gonet deleted the @wolewicki/example-to-ts branch December 17, 2020 12:58

jakub-gonet restored the @wolewicki/example-to-ts branch December 17, 2020 12:58

jakub-gonet mentioned this pull request Feb 2, 2021

Rewrite to TS #1327

Merged

jakub-gonet deleted the @wolewicki/example-to-ts branch July 28, 2021 13:04

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Rewrite Examples to TS #1273

Rewrite Examples to TS #1273

jakub-gonet commented Dec 12, 2020 •

edited

Loading

jakub-gonet left a comment •

edited

Loading

jkadamczyk left a comment

Rewrite Examples to TS #1273

Rewrite Examples to TS #1273

Conversation

jakub-gonet commented Dec 12, 2020 • edited Loading

Description

Session 1: Example Blues

Note

Changes

Test plan

TODO

jakub-gonet left a comment • edited Loading

Choose a reason for hiding this comment

jkadamczyk left a comment

Choose a reason for hiding this comment

jakub-gonet commented Dec 12, 2020 •

edited

Loading

jakub-gonet left a comment •

edited

Loading