From ea8cbea24f8609a6f439501720798f25fe814915 Mon Sep 17 00:00:00 2001 From: Robin Cussol Date: Tue, 5 Feb 2019 14:38:49 +0100 Subject: [PATCH] Chore: Upgrading react-native-web Chore: Upgrading snapshot-diff Chore: Upgrading release-it Chore: Upgrading Jest and regenerator-runtime Chore: Upgrading flow Summary: Had to put many react-native Libraries under [untyped] in .flowconfig, will need to comment them out when new release of flow or react-native to see if these types were fixed. --- .flowconfig | 20 +- package.json | 14 +- src/Button/ButtonInner.js | 3 +- .../__snapshots__/index.test.js.snap | 39 +- .../__snapshots__/index.test.js.snap | 53 +- .../__snapshots__/index.test.js.snap | 2 +- .../__snapshots__/index.test.js.snap | 7 +- src/Hoverable/Hoverable.js | 2 +- src/Icon/Icon.js | 7 +- src/Icon/IconsList.js | 1 + src/Notification/NotificationExample.js | 2 +- src/OptionPicker/OptionPicker.js | 6 +- src/RadioButton/RadioButton.js | 12 +- src/RowOption/RowOption.js | 2 +- src/RowOption/RowOptionContent.js | 12 +- src/Stepper/Stepper.js | 4 +- src/Stepper/Stepper.stories.js | 1 - src/TagsInput/TagsInput.js | 6 +- src/TextInput/TextInput.js | 5 - yarn.lock | 850 ++++++++---------- 20 files changed, 487 insertions(+), 561 deletions(-) diff --git a/.flowconfig b/.flowconfig index b4b56d9..cbd221a 100644 --- a/.flowconfig +++ b/.flowconfig @@ -85,5 +85,23 @@ suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError [lints] unnecessary-optional-chain=error +; https://github.com/facebook/react-native/issues/19812#issuecomment-431893188 +[untyped] +.*/node_modules/react-native/Libraries/Components/View/ViewPropTypes.js +.*/node_modules/react-native/Libraries/Text/TextAncestor.js +.*/node_modules/react-native/Libraries/Text/Text.js +.*/node_modules/react-native/Libraries/YellowBox/UI/YellowBoxList.js +.*/node_modules/react-native/Libraries/Image/Image.ios.js +.*/node_modules/react-native/Libraries/StyleSheet/processTransform.js +.*/node_modules/react-native/Libraries/StyleSheet/StyleSheetValidation.js +.*/node_modules/react-native/Libraries/LayoutAnimation/LayoutAnimation.js +.*/node_modules/react-native/Libraries/LayoutAnimation/LayoutAnimation.js +.*/node_modules/react-native/Libraries/Components/Touchable/TouchableOpacity.js +.*/node_modules/react-native/Libraries/Components/Touchable/TouchableHighlight.js +.*/node_modules/react-native/Libraries/Components/Slider/Slider.js +.*/node_modules/react-native/Libraries/Components/Navigation/NavigatorIOS.ios.js +.*/node_modules/react-native/Libraries/Components/ActivityIndicator/ActivityIndicator.js +.*/node_modules/react-native/Libraries/Lists/VirtualizedSectionList.js + [version] -^0.78.0 +^0.92.1 diff --git a/package.json b/package.json index b0dbdaf..b5fb5cd 100644 --- a/package.json +++ b/package.json @@ -60,7 +60,7 @@ "@storybook/react-native": "^4.0.6", "babel-core": "^7.0.0-bridge.0", "babel-eslint": "^10.0.1", - "babel-jest": "^24.0.0", + "babel-jest": "^24.1.0", "babel-loader": "^8.0.5", "babel-runtime": "^6.26.0", "eslint": "^5.13.0", @@ -68,8 +68,8 @@ "eslint-plugin-prettier": "^3.0.1", "eslint-plugin-react-native": "^3.6.0", "file-loader": "^3.0.1", - "flow-bin": "0.78.0", - "jest": "^24.0.0", + "flow-bin": "0.92.1", + "jest": "^24.1.0", "loki": "^0.14.2", "metro-react-native-babel-preset": "^0.49.1", "prettier": "^1.16.4", @@ -80,13 +80,13 @@ "react-native": "^0.57.5", "react-native-storybook-loader": "^1.8.0", "react-native-testing-library": "^1.5.0", - "react-native-web": "^0.9.9", + "react-native-web": "^0.10.0", "react-native-web-image-loader": "^0.0.6", "react-test-renderer": "16.7.0", - "regenerator-runtime": "^0.12.1", - "release-it": "^8.4.2", + "regenerator-runtime": "^0.13.1", + "release-it": "^10.0.7", "rimraf": "^2.6.3", - "snapshot-diff": "^0.4.0", + "snapshot-diff": "^0.5.0", "webpack": "^4.29.1" }, "config": { diff --git a/src/Button/ButtonInner.js b/src/Button/ButtonInner.js index dd9320b..f017d07 100644 --- a/src/Button/ButtonInner.js +++ b/src/Button/ButtonInner.js @@ -62,7 +62,8 @@ export default function ButtonInner({ > {leftIcon != null && {leftIcon}} - {children || } + {children || + (label != null && )} {sublabel != null && ( diff --git a/src/Button/__tests__/__snapshots__/index.test.js.snap b/src/Button/__tests__/__snapshots__/index.test.js.snap index fde7332..a47ed28 100644 --- a/src/Button/__tests__/__snapshots__/index.test.js.snap +++ b/src/Button/__tests__/__snapshots__/index.test.js.snap @@ -18,7 +18,7 @@ exports[`Button - native should match snapshot diff 1`] = ` > ++ > + + } + > + f + + @@ -113,7 +114,7 @@ exports[`Button - native should match snapshot diff 1`] = ` + > + Button sublabel + - ++ + +  + - - -+ -+ -+ " ++ ++ + + + " `; exports[`Button - native should match the snapshot 1`] = ` @@ -285,16 +286,16 @@ exports[`Button - web should match snapshot diff 1`] = ` Object { \\"alignItems\\": \\"center\\", \\"flexDirection\\": \\"row\\", - } - } -- /> ++ } ++ } + > + + > + +  + - ++ + - -+ + + " `; diff --git a/src/CarrierLogo/__tests__/__snapshots__/index.test.js.snap b/src/CarrierLogo/__tests__/__snapshots__/index.test.js.snap index aa6302c..223997d 100644 --- a/src/CarrierLogo/__tests__/__snapshots__/index.test.js.snap +++ b/src/CarrierLogo/__tests__/__snapshots__/index.test.js.snap @@ -7,7 +7,7 @@ exports[`CarrierLogo should match snapshot diff 1`] = ` - + -@@ -17,23 +17,83 @@ +@@ -17,22 +17,82 @@ } > ++ -+ - " + }, + false, + ] + } + />" `; diff --git a/src/Checkbox/__tests__/__snapshots__/index.test.js.snap b/src/Checkbox/__tests__/__snapshots__/index.test.js.snap index 1395854..fc0247c 100644 --- a/src/Checkbox/__tests__/__snapshots__/index.test.js.snap +++ b/src/Checkbox/__tests__/__snapshots__/index.test.js.snap @@ -140,10 +140,10 @@ exports[`CheckBox - web should match snapshot diff 1`] = ` \\"width\\": 20, }, - undefined, ++ false, false, false, false, -+ false, ] } - /> diff --git a/src/FilterButton/__tests__/__snapshots__/index.test.js.snap b/src/FilterButton/__tests__/__snapshots__/index.test.js.snap index 1850373..869df1c 100644 --- a/src/FilterButton/__tests__/__snapshots__/index.test.js.snap +++ b/src/FilterButton/__tests__/__snapshots__/index.test.js.snap @@ -12,11 +12,12 @@ exports[`FilterButton should match snapshot diff between active and inactive inp - }, + false, ] -@@ -57,5 +55,3 @@ - }, +@@ -56,6 +54,4 @@ + \\"paddingVertical\\": 4, +- }, - Object { - \\"color\\": \\"#e8edf1\\", -- }, + }, + false, ]," `; diff --git a/src/Hoverable/Hoverable.js b/src/Hoverable/Hoverable.js index 154370f..7ee96ce 100644 --- a/src/Hoverable/Hoverable.js +++ b/src/Hoverable/Hoverable.js @@ -7,7 +7,7 @@ import HoverMonitor from './HoverMonitor'; type Props = {| +disabled?: boolean, - +children: React.Element, + +children: React.Node, +onMouseEnter?: () => void, +onMouseLeave?: () => void, |}; diff --git a/src/Icon/Icon.js b/src/Icon/Icon.js index c24909b..929bcbd 100644 --- a/src/Icon/Icon.js +++ b/src/Icon/Icon.js @@ -4,7 +4,10 @@ import * as React from 'react'; import { Text as RNText } from 'react-native'; import { defaultTokens } from '@kiwicom/orbit-design-tokens'; -import { StyleSheet } from '../PlatformStyleSheet'; +import { + StyleSheet, + type PlatformStyleObjectType, +} from '../PlatformStyleSheet'; import iconsMap from './icons.json'; import type { Props } from './IconTypes'; @@ -33,7 +36,7 @@ export default function Icon({ ); } -const getSizeStyle = (size: number): Object => ({ +const getSizeStyle = (size: number): $Values => ({ fontSize: size, width: size, height: size, diff --git a/src/Icon/IconsList.js b/src/Icon/IconsList.js index f67dc5e..45e57c7 100644 --- a/src/Icon/IconsList.js +++ b/src/Icon/IconsList.js @@ -13,6 +13,7 @@ const keyExtractor = item => item; const renderItem = ({ item }) => ( {item} + {/* $FlowFixMe item is of type string, when enum is expected */} ); diff --git a/src/Notification/NotificationExample.js b/src/Notification/NotificationExample.js index 07b5a7d..c8692d1 100644 --- a/src/Notification/NotificationExample.js +++ b/src/Notification/NotificationExample.js @@ -11,7 +11,7 @@ import type { NotificationType } from '../types'; type Props = {| +notificationStyle: 'error' | 'warning' | 'success', +notificationType: NotificationType, - +title?: React.Node | string, + +title: React.Node | string, +message: React.Node | string, +onDismiss?: () => void, |}; diff --git a/src/OptionPicker/OptionPicker.js b/src/OptionPicker/OptionPicker.js index 99624f9..67e9af4 100644 --- a/src/OptionPicker/OptionPicker.js +++ b/src/OptionPicker/OptionPicker.js @@ -27,13 +27,15 @@ type State = {| type Event = { nativeEvent: { key: string } }; -const filterSubOptionsByIds = (option, ids) => { +const filterSubOptionsByIds = (option: OptionType, ids) => { const { subOptions } = option; // check if the subOptions exists if (!subOptions) return option; // filter out selected options - const filteredOptions = subOptions.filter(({ id }) => !ids.includes(id)); + const filteredOptions: Array = subOptions.filter( + ({ id }) => !ids.includes(id), + ); return { ...option, ...{ subOptions: filteredOptions } }; }; diff --git a/src/RadioButton/RadioButton.js b/src/RadioButton/RadioButton.js index c8291bc..826171f 100644 --- a/src/RadioButton/RadioButton.js +++ b/src/RadioButton/RadioButton.js @@ -20,11 +20,13 @@ export default function RadioButton({ label, }: Props) { const isCheckType = type === 'check'; - const renderLabel = children || ( - - {label} - - ); + const renderLabel = + children || + (label != null && label !== '' && ( + + {label} + + )); return ( diff --git a/src/RowOption/RowOption.js b/src/RowOption/RowOption.js index 623501f..a3d4ec8 100644 --- a/src/RowOption/RowOption.js +++ b/src/RowOption/RowOption.js @@ -14,7 +14,7 @@ type Props = {| +border?: 'long' | 'short' | 'shaped', +type: 'localization' | 'destination' | 'airplane' | 'bus' | 'train', +header: string | React.Node, - +subheader: string | React.Node, + +subheader: ?(string | React.Node), +info?: string | React.Node, +onItemPress: () => void, +onAddPress: () => void, diff --git a/src/RowOption/RowOptionContent.js b/src/RowOption/RowOptionContent.js index b83a1f6..1706722 100644 --- a/src/RowOption/RowOptionContent.js +++ b/src/RowOption/RowOptionContent.js @@ -10,7 +10,7 @@ import { StyleSheet } from '../PlatformStyleSheet'; type Props = {| +type: 'localization' | 'destination' | 'airplane' | 'bus' | 'train', +header: string | React.Node, - +subheader: string | React.Node, + +subheader: ?(string | React.Node), +info?: string | React.Node, |}; @@ -33,10 +33,12 @@ export default function RowOptionContent({ {header} - - {subheader} - - {info && ( + {subheader != null && subheader !== '' && ( + + {subheader} + + )} + {info != null && info !== '' && ( diff --git a/src/Stepper/Stepper.js b/src/Stepper/Stepper.js index f0a2a70..4a43182 100644 --- a/src/Stepper/Stepper.js +++ b/src/Stepper/Stepper.js @@ -58,7 +58,9 @@ export default function Stepper({ touchable={!disableDecrement} onPress={onDecrement} /> - {showNumber && {numberDisplayed}} + {showNumber && numberDisplayed != null && ( + {numberDisplayed} + )} } touchable={!disableIncrement} diff --git a/src/Stepper/Stepper.stories.js b/src/Stepper/Stepper.stories.js index dbbcad5..079b626 100644 --- a/src/Stepper/Stepper.stories.js +++ b/src/Stepper/Stepper.stories.js @@ -46,7 +46,6 @@ class Wrapper extends React.Component< const { children: childrenProps } = this.props; const { number: numberState } = this.state; - /* $FlowFixMe: overwriting props to make it easier here */ const children = React.cloneElement(childrenProps, { number: numberState, onIncrement: () => { diff --git a/src/TagsInput/TagsInput.js b/src/TagsInput/TagsInput.js index b9e9a1b..dc1be75 100644 --- a/src/TagsInput/TagsInput.js +++ b/src/TagsInput/TagsInput.js @@ -140,15 +140,11 @@ export default class TagsInput extends React.Component { return ( - {Boolean(label) && ( + {label != null && label !== '' && ( {label} )} - {/* $FlowFixMe - * Prop `contentContainerStyle`: - * The ReducedDangerouslyImpreciseStyle is incompatible with exact $ReadOnly. - */} { )} - {/* $FlowFixMe - * Prop `minLength` is not supported in rn-web - * and doesn't exist in TextInput props, - * but it's catched by web and works with input field. - */}