Skip to content

Commit

Permalink
chore: update Dimensions API Flow types (facebook#31898)
Browse files Browse the repository at this point in the history
Summary:
This small PR updates the Flow types used in Dimensions. The following changes has been made:
* generic types has been replaced with types from `NativeDeviceInfo` (which already were used in event subscription update)
* ~simplification of `DisplayMetricsAndroid` by spreading via intersection with `DisplayMetrics` type and removing shared properties~
  > I have tried both notations, but according to the lint, it looks like a Native Modules typing limitation which requires redundancy / code duplication in cases like this.

## Changelog

<!-- Help reviewers and the release process by writing your own changelog entry. For an example, see:
https://github.com/facebook/react-native/wiki/Changelog
-->

[Internal] [Changed] - update Dimensions API Flow types

Pull Request resolved: facebook#31898

Test Plan: Running `yarn flow` in the workspace yields no errors.

Reviewed By: yungsters

Differential Revision: D29932940

Pulled By: GijsWeterings

fbshipit-source-id: bf97bb972964c585207e2450ccf71d932555e291
  • Loading branch information
Simek authored and facebook-github-bot committed Aug 3, 2021
1 parent 4fcf468 commit 0b4f4ee
Show file tree
Hide file tree
Showing 3 changed files with 16 additions and 16 deletions.
21 changes: 8 additions & 13 deletions Libraries/Utilities/Dimensions.js
Original file line number Diff line number Diff line change
Expand Up @@ -14,21 +14,16 @@ import EventEmitter, {
import RCTDeviceEventEmitter from '../EventEmitter/RCTDeviceEventEmitter';
import NativeDeviceInfo, {
type DisplayMetrics,
type DisplayMetricsAndroid,
type DimensionsPayload,
} from './NativeDeviceInfo';
import invariant from 'invariant';

type DimensionsValue = {
window?: DisplayMetrics,
screen?: DisplayMetrics,
...
};

const eventEmitter = new EventEmitter<{
change: [DimensionsValue],
change: [DimensionsPayload],
}>();
let dimensionsInitialized = false;
let dimensions: DimensionsValue;
let dimensions: DimensionsPayload;

class Dimensions {
/**
Expand All @@ -46,9 +41,9 @@ class Dimensions {
* Example: `const {height, width} = Dimensions.get('window');`
*
* @param {string} dim Name of dimension as defined when calling `set`.
* @returns {Object?} Value for the dimension.
* @returns {DisplayMetrics? | DisplayMetricsAndroid?} Value for the dimension.
*/
static get(dim: string): Object {
static get(dim: string): DisplayMetrics | DisplayMetricsAndroid {
invariant(dimensions[dim], 'No dimension set for key ' + dim);
return dimensions[dim];
}
Expand All @@ -57,9 +52,9 @@ class Dimensions {
* This should only be called from native code by sending the
* didUpdateDimensions event.
*
* @param {object} dims Simple string-keyed object of dimensions to set
* @param {DimensionsPayload} dims Simple string-keyed object of dimensions to set
*/
static set(dims: $ReadOnly<{[key: string]: any, ...}>): void {
static set(dims: $ReadOnly<DimensionsPayload>): void {
// We calculate the window dimensions in JS so that we don't encounter loss of
// precision in transferring the dimensions (which could be non-integers) over
// the bridge.
Expand Down Expand Up @@ -128,7 +123,7 @@ class Dimensions {
}
}

let initialDims: ?$ReadOnly<{[key: string]: any, ...}> =
let initialDims: ?$ReadOnly<DimensionsPayload> =
global.nativeExtensions &&
global.nativeExtensions.DeviceInfo &&
global.nativeExtensions.DeviceInfo.Dimensions;
Expand Down
2 changes: 1 addition & 1 deletion Libraries/Utilities/NativeDeviceInfo.js
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@
import type {TurboModule} from '../TurboModule/RCTExport';
import * as TurboModuleRegistry from '../TurboModule/TurboModuleRegistry';

type DisplayMetricsAndroid = {|
export type DisplayMetricsAndroid = {|
width: number,
height: number,
scale: number,
Expand Down
9 changes: 7 additions & 2 deletions Libraries/Utilities/useWindowDimensions.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,15 @@
*/

import Dimensions from './Dimensions';
import {type DisplayMetrics} from './NativeDeviceInfo';
import {
type DisplayMetrics,
type DisplayMetricsAndroid,
} from './NativeDeviceInfo';
import {useEffect, useState} from 'react';

export default function useWindowDimensions(): DisplayMetrics {
export default function useWindowDimensions():
| DisplayMetrics
| DisplayMetricsAndroid {
const [dimensions, setDimensions] = useState(() => Dimensions.get('window'));
useEffect(() => {
function handleChange({window}) {
Expand Down

0 comments on commit 0b4f4ee

Please sign in to comment.