Commit Graph

16 Commits

Author SHA1 Message Date
Rick Hanlon 94c45af136 Add dark mode to loading progress
Summary:
This diff updates the loading banner to respect the RCTAppearance dev mode setting.

Changelog: [General] [iOS] Add dark mode support to loading banner

Reviewed By: fkgozali

Differential Revision: D21429148

fbshipit-source-id: d7d9e778245112a19accf813dcff693f0d187a38
2020-05-12 20:56:06 -07:00
Rick Hanlon f0dfd35108 Smaller loading bar based on feedback
Summary:
This diff removes the hostname from the loading bar and shrinks it down so it's inside the margins of the safe area view, never blocking app content inside the safe area.

Changelog: [General] [iOS] Shrink loading bar down to not cover safe area.

Reviewed By: shergin

Differential Revision: D21339480

fbshipit-source-id: e8416af63b7e06bcc21c7b6277d5d01d61eb3f73
2020-04-30 19:40:17 -07:00
Rick Hanlon 3fb37b4326 Speed up loading banner animations
Summary:
This diff reduces the minimum loading banner time and animation time to make the locating banner faster.

Changelog: [General] [iOS] Speed up loading banner animations

Reviewed By: PeteTheHeat

Differential Revision: D21290517

fbshipit-source-id: 111dff41df53b0246548e1da1db80c2188498a9c
2020-04-28 23:20:18 -07:00
Rick Hanlon 2b771b0129 Delay loading banner inital message by 200ms to prevent flashing
Summary:
This diff fixes an issue where the initial "Loading from Metro..." message is flashed for a few milliseconds before the download progress kicks in. It's just jarring enough to be noticed and is ~600ms too fast to be read.

This diff adds a delay so that if the loading progress starts within 200ms we go straight to the progress.

Changelog: [Fixed] [iOS] Delay loading banner message to prevent flashing messages

Reviewed By: PeteTheHeat

Differential Revision: D21281870

fbshipit-source-id: d28c1eae01c2ac9d79f356f1870f17dbb22a9d84
2020-04-28 23:20:17 -07:00
Rick Hanlon 131c497aa2 Do not update loading banner message while hiding
Summary:
This diff fixes an issue where the loading banner message could update while the banner hide animation is going, catching your eye for no reason.

Changelog: [Fixed] [iOS] Do not update loading banner message while hiding

Reviewed By: PeteTheHeat

Differential Revision: D21280786

fbshipit-source-id: a10b33cd72f263d08eea6d8e94963514affbe24d
2020-04-28 23:20:17 -07:00
Rick Hanlon 3729fe8de0 Update loading banner text and colors
Summary:
This diff updates the loading banner text and color on iOS for better UX.

Flow before:
- Loading from localhost:8081...
- Loading 20% (1000/5000)...
- Downloading JavaScript Bundle 20% (10/50)
- Downloading JavaScript Bundle...

After:
- Loading from Metro...
- Bundling 20%...
- Downloading 20%...
- Downloading...

Changelog: [Added] [iOS] Updated loading banner messages and color

Reviewed By: PeteTheHeat

Differential Revision: D21279939

fbshipit-source-id: fd7d90f85e25ce175a87087dfccf2180d49e3e98
2020-04-28 23:20:17 -07:00
Rick Hanlon 96999339b6 Add hostname to loading banner on iOS
Summary:
This diff adds a hostname to the loading banner on iOS so it's clear which server you're loading from.

Changelog: [Added] [iOS] Added hostname to loading banner.

Reviewed By: PeteTheHeat

Differential Revision: D21280252

fbshipit-source-id: d7733c056f5fb63e32b247a4fa1476ab42c7da17
2020-04-28 23:20:16 -07:00
Ramanpreet Nara 03bd7d799e Part 2: Update ObjC++ codegen classes to use ObjCTurboModule::InitParams
Summary:
## Summary
Please check out D21035209.

## Changes
- Codemod all ObjC NativeModule `getTurboModuleWithJsInvoker:nativeInvoker:perfLogger` methods to `getTurboModule:(const ObjCTurboModule::Args)`

## Script
```
var withSpaces = (...args) => args.join('\s*')

var regexString = withSpaces(
  '-',
  '\(',
  'std::shared_ptr',
  '<',
  '(?<turboModuleClass>(facebook::react::|react::|::|)TurboModule)',
  '>',
  '\)',
  'getTurboModuleWithJsInvoker',
  ':',
  '\(',
  'std::shared_ptr',
  '<',
  '(?<fbNamespace>(facebook::react::|react::|::|))CallInvoker',
  '>',
  '\)',
  '(?<jsInvokerInstance>[A-Za-z0-9]+)',
  'nativeInvoker',
  ':',
  '\(',
  'std::shared_ptr',
  '<',
  '(facebook::react::|react::|::|)CallInvoker',
  '>',
  '\)',
  '(?<nativeInvokerInstance>[A-Za-z0-9]+)',
  'perfLogger',
  ':',
  '\(',
  'id',
  '<',
  'RCTTurboModulePerformanceLogger',
  '>',
  '\)',
  '(?<perfLoggerInstance>[A-Za-z0-9]+)',
  '{',
  'return',
  'std::make_shared',
  '<',
  '(?<specName>(facebook::react::|react::|::|)Native[%A-Za-z0-9]+SpecJSI)',
  '>',
  '\(',
  'self',
  ',',
  '\k<jsInvokerInstance>',
  ',',
  '\k<nativeInvokerInstance>',
  ',',
  '\k<perfLoggerInstance>',
  '\)',
  ';',
  '}',
)

var replaceString = `- (std::shared_ptr<$<turboModuleClass>>) getTurboModule:(const $<fbNamespace>ObjCTurboModule::InitParams &)params
{
  return std::make_shared<$<specName>>(params);
}`

const exec = require('../lib/exec');
const abspath = require('../lib/abspath');
const relpath = require('../lib/relpath');
const readFile = (filename) => require('fs').readFileSync(filename, 'utf8');
const writeFile = (filename, content) => require('fs').writeFileSync(filename, content);

function main() {
  const tmFiles = exec('cd ~/fbsource && xbgs -n 10000 -l getTurboModuleWithJsInvoker:').split('\n').filter(Boolean);

  tmFiles
    .filter((filename) => !filename.includes('microsoft-fork-of-react-native'))
    .map(abspath)
    .forEach((filename) => {
      const source = readFile(filename);
      const newSource = source.replace(new RegExp(regexString, 'g'), replaceString);

      if (source == newSource) {
        console.log(relpath(filename));
      }

      writeFile(filename, newSource);
    });
}

if (!module.parent) {
  main();
}
```

## Re-generating diff
```
> hg revert -r .^ --all
> node index.js # run script
```

Changelog: [iOS][Changed] - Make all ObjC NativeModules create TurboModules using ObjCTurboModule::Args

Reviewed By: PeteTheHeat

Differential Revision: D21036265

fbshipit-source-id: 404bcc548d1775ef23d793527606d02fe384a0a2
2020-04-16 17:29:55 -07:00
Ramanpreet Nara 69698b25fc Codemod all getTurboModuleWithJsInvoker methods to accept a native CallInvoker
Summary:
To make iOS TurboModules integrate with the bridge's onBatchComplete event, they need to use a native CallInvoker. This call invoker is created by the `NativeToJsBridge`, and ObjCTurboModule will use this native CallInvoker to dispatch TurboModule method calls. This diff makes sure that ObjCTurboModules are created with that native CallInvoker.

## Script
```
var withSpaces = (...args) => args.join('\s*')

var regexString = withSpaces(
  '-',
  '\(',
  'std::shared_ptr',
  '<',
  '(?<turboModuleClass>(facebook::react::|react::|::|)TurboModule)',
  '>',
  '\)',
  'getTurboModuleWithJsInvoker',
  ':',
  '\(',
  'std::shared_ptr',
  '<',
  '(?<callInvokerClass>(facebook::react::|react::|::|)CallInvoker)',
  '>',
  '\)',
  '(?<jsInvokerInstance>[A-Za-z0-9]+)',
  'perfLogger',
  ':',
  '\(',
  'id',
  '<',
  'RCTTurboModulePerformanceLogger',
  '>',
  '\)',
  '(?<perfLoggerInstance>[A-Za-z0-9]+)',
  '{',
  'return',
  'std::make_shared',
  '<',
  '(?<specName>(facebook::react::|react::|::|)Native[%A-Za-z0-9]+SpecJSI)',
  '>',
  '\(',
  'self',
  ',',
  '\k<jsInvokerInstance>',
  ',',
  '\k<perfLoggerInstance>',
  '\)',
  ';',
  '}',
)

var replaceString = `- (std::shared_ptr<$<turboModuleClass>>)
    getTurboModuleWithJsInvoker:(std::shared_ptr<$<callInvokerClass>>)$<jsInvokerInstance>
                  nativeInvoker:(std::shared_ptr<$<callInvokerClass>>)nativeInvoker
                     perfLogger:(id<RCTTurboModulePerformanceLogger>)$<perfLoggerInstance>
{
  return std::make_shared<$<specName>>(self, $<jsInvokerInstance>, nativeInvoker, $<perfLoggerInstance>);
}`

const exec = require('../lib/exec');
const abspath = require('../lib/abspath');
const relpath = require('../lib/relpath');
const readFile = (filename) => require('fs').readFileSync(filename, 'utf8');
const writeFile = (filename, content) => require('fs').writeFileSync(filename, content);

function main() {
  const tmFiles = exec('cd ~/fbsource && xbgs -n 10000 -l getTurboModuleWithJsInvoker:').split('\n').filter(Boolean);

  tmFiles
    .filter((filename) => !filename.includes('microsoft-fork-of-react-native'))
    .map(abspath)
    .forEach((filename) => {
      const source = readFile(filename);
      const newSource = source.replace(new RegExp(regexString, 'g'), replaceString);

      if (source == newSource) {
        console.log(relpath(filename));
      }

      writeFile(filename, newSource);
    });
}

if (!module.parent) {
  main();
}
```

Changelog: [Internal]

Reviewed By: fkgozali

Differential Revision: D20809202

fbshipit-source-id: 5d39b3cacdaa5681b70ce1803351d0432dd74550
2020-04-03 02:27:10 -07:00
Ramanpreet Nara 652fa1b8d4 Add a perfLogger argument to getTurboModuleWithJSInvoker:
Summary:
## Purpose
We must modify the `getTurboModuleWithJsInvoker:` method of all our NativeModules to also accept a `id<RCTTurboModulePerformanceLogger>` object. This performance logger object should then be forwarded to the `Native*SpecJSI` constructor.

## Script
Run the following script via Node:
```
var withSpaces = (...args) => args.join('\s*')

var regexString = withSpaces(
  '-',
  '\(',
  'std::shared_ptr',
  '<',
  '(?<turboModuleClass>(facebook::react::|react::|::|)TurboModule)',
  '>',
  '\)',
  'getTurboModuleWithJsInvoker',
  ':',
  '\(',
  'std::shared_ptr',
  '<',
  '(?<callInvokerClass>(facebook::react::|react::|::|)CallInvoker)',
  '>',
  '\)',
  'jsInvoker',
  '{',
  'return',
  'std::make_shared',
  '<',
  '(?<specName>(facebook::react::|react::|::|)Native[A-Za-z0-9]+SpecJSI)',
  '>',
  '\(',
  '(?<arg1>[A-Za-z0-9]+)',
  ',',
  '(?<arg2>[A-Za-z0-9]+)',
  '\)',
  ';',
  '}',
)

var replaceString = `- (std::shared_ptr<$<turboModuleClass>>)
    getTurboModuleWithJsInvoker:(std::shared_ptr<$<callInvokerClass>>)jsInvoker
                     perfLogger:(id<RCTTurboModulePerformanceLogger>)perfLogger
{
  return std::make_shared<$<specName>>($<arg1>, $<arg2>, perfLogger);
}`

const exec = (cmd) => require('child_process').execSync(cmd, { encoding: 'utf8' });
const abspath = (filename) => `${process.env.HOME}/${filename}`;
const relpath = (filename) => filename.replace(process.env.HOME + '/', '');
const readFile = (filename) => require('fs').readFileSync(filename, 'utf8');
const writeFile = (filename, content) => require('fs').writeFileSync(filename, content);

function main() {
  const tmFiles = exec('cd ~/fbsource && xbgs -n 10000 -l getTurboModuleWithJsInvoker:').split('\n').filter(Boolean);

  tmFiles
    .filter((filename) => !filename.includes('microsoft-fork-of-react-native'))
    .map(abspath)
    .forEach((filename) => {
      const source = readFile(filename);
      const newSource = source.replace(new RegExp(regexString, 'g'), replaceString);

      if (source == newSource) {
        console.log(relpath(filename));
      }

      writeFile(filename, newSource);
    });
}

if (!module.parent) {
  main();
}
```

Also, run: `pushd ~/fbsource && js1 build oss-native-modules-specs -p ios && js1 build oss-native-modules-specs -p android && popd;`

Changelog: [Internal]

Reviewed By: fkgozali

Differential Revision: D20478718

fbshipit-source-id: 89ee27ed8a0338a66a9b2dbb716168a4c4582c44
2020-03-18 11:01:15 -07:00
Valentin Shergin d0871d0a9a Clang format for all React Native files
Summary:
Buckle up, this enables clang-format prettifier for all files in React Native opensource repo.

Changelog: [Internal] Clang-format codemod.

Reviewed By: mdvacca

Differential Revision: D20331210

fbshipit-source-id: 8da0f94700be0c35bfd399e0c48f1706de04f5b1
2020-03-08 23:01:17 -07:00
Ramanpreet Nara fe5ac2c3f9 Fix method signature
Summary:
All `NSNumber *` arguments of NativeModules need to be marked with `__nonnull`. Otherwise, when TurboModules are disabled, we run into a RedBox.

Changelog:
[iOS][Fixed] - Fix RCTDevLoadingView RedBox on Reload

Reviewed By: PeteTheHeat

Differential Revision: D20292188

fbshipit-source-id: a8a5d0b2070575d7728b6308b129196242671fe6
2020-03-06 12:44:56 -08:00
Arjan Zuidema 0a9cc34dd8 Added userInterfaceStyle prop to ActionSheetmanager to override user interface style for iOS 13 (#26401)
Summary:
Support to override actionsheet and share interface style to match your app. For example, when your app has it's own theming you want to match the stying on actionsheet and the share menu.

## Changelog

[iOS] [Added] - Added userInterfaceStyle for ActionSheetIOS and Share to override user interface style on IOS 13
Pull Request resolved: https://github.com/facebook/react-native/pull/26401

Test Plan:
Set dark style
![dark](https://user-images.githubusercontent.com/30040390/64685321-12a53080-d487-11e9-8846-f2ef89e114a2.jpg)
Set light style
![light](https://user-images.githubusercontent.com/30040390/64685322-12a53080-d487-11e9-9dfd-1e07b9fe0ce2.jpg)

Differential Revision: D17314080

Pulled By: hramos

fbshipit-source-id: f84278ca99ba20347d17e27295f661d6690fa68c
2020-02-28 00:08:54 -08:00
Ramanpreet Nara 6a9a76e420 Make RCTDevLoadingView TurboModule-compatible
Summary:
This is a redo of D16969764, with a few extensions.

## Changes
1. Move `RCTDevLoadingView.{h,m}` to `CoreModuels/RCTDevLoadingView.{h,mm}`
2. Extract ObjC API of `RCTDevLodingView` into `RCTDevLoadingViewProtocol` in `ReactInternal`.
3. Create API `RCTDevLoadingViewSetEnabled.h` in `ReactInternal` to enable/disable `RCTDevLoadingView`

Changelog:
[iOS][Added] - Make RCTDevLoadingView TurboModule-compatible

Reviewed By: PeteTheHeat

Differential Revision: D18642554

fbshipit-source-id: 6b62e27e128d98254b7a6d018399ec1c06e274fc
2020-02-27 17:06:13 -08:00
Ramanpreet Nara 1ad0862363 Revert D16969764: Make RCTDevLoadingView TurboModule-compatible
Differential Revision:
D16969764

Original commit changeset: 47e6682eea3f

fbshipit-source-id: d95b76eb8e57bbaff840b3d85f3745b13d622ce0
2019-11-21 08:43:12 -08:00
Ramanpreet Nara 294e31b7c2 Make RCTDevLoadingView TurboModule-compatible
Summary:
RCTDevLoadingView wasn't hooked up to the codegen. This diff makes RCTDevLoadingView type-safe and also makes it TurboModule-compatible.

Changelog:
[iOS][Added] - Make RCTDevLoadingView TurboModule-compatible

Reviewed By: PeteTheHeat

Differential Revision: D16969764

fbshipit-source-id: 47e6682eea3fc49d3f0448c636b5f616d5bce220
2019-11-20 11:20:12 -08:00