Adding native implementation for Dev Loading View for Android (#35743)

Summary: Pull Request resolved: #35743 Changelog: [Android][Added] - For supporting Dev Loading View across multiple platforms, altering the javascript implementation of Loading view of android to also rely on native implementation as iOS instead of Toast, thereby unifying both platforms Reviewed By: rshest Differential Revision: D42258041 fbshipit-source-id: 1be56c1e5696b1024ba09a0aa11da96e0a08f210
facebook · Dec 29, 2022 · 068a208 · 068a208
1 parent afd954e
commit 068a208
Show file tree

Hide file tree

Showing 3 changed files with 104 additions and 11 deletions.
diff --git a/Libraries/Utilities/LoadingView.android.js b/Libraries/Utilities/LoadingView.android.js
@@ -8,20 +8,43 @@
  * @flow strict-local
  */
 
-import ToastAndroid from '../Components/ToastAndroid/ToastAndroid';
-
-const TOAST_SHORT_DELAY = 2000;
-let isVisible = false;
+import processColor from '../StyleSheet/processColor';
+import Appearance from './Appearance';
+import NativeDevLoadingView from './NativeDevLoadingView';
 
 module.exports = {
   showMessage(message: string, type: 'load' | 'refresh') {
-    if (!isVisible) {
-      ToastAndroid.show(message, ToastAndroid.SHORT);
-      isVisible = true;
-      setTimeout(() => {
-        isVisible = false;
-      }, TOAST_SHORT_DELAY);
+    if (NativeDevLoadingView) {
+      if (type === 'refresh') {
+        const backgroundColor = processColor('#2584e8');
+        const textColor = processColor('#ffffff');
+
+        NativeDevLoadingView.showMessage(
+          message,
+          typeof textColor === 'number' ? textColor : null,
+          typeof backgroundColor === 'number' ? backgroundColor : null,
+        );
+      } else if (type === 'load') {
+        let backgroundColor;
+        let textColor;
+
+        if (Appearance.getColorScheme() === 'dark') {
+          backgroundColor = processColor('#fafafa');
+          textColor = processColor('#242526');
+        } else {
+          backgroundColor = processColor('#404040');
+          textColor = processColor('#ffffff');
+        }
+
+        NativeDevLoadingView.showMessage(
+          message,
+          typeof textColor === 'number' ? textColor : null,
+          typeof backgroundColor === 'number' ? backgroundColor : null,
+        );
+      }
     }
   },
-  hide() {},
+  hide() {
+    NativeDevLoadingView && NativeDevLoadingView.hide();
+  },
 };
diff --git a/ReactAndroid/src/main/java/com/facebook/react/modules/devloading/BUCK b/ReactAndroid/src/main/java/com/facebook/react/modules/devloading/BUCK
@@ -0,0 +1,22 @@
+load("//tools/build_defs/oss:rn_defs.bzl", "react_native_dep", "react_native_root_target", "react_native_target", "rn_android_library")
+
+rn_android_library(
+    name = "devloading",
+    srcs = glob(["**/*.java"]),
+    autoglob = False,
+    labels = [
+        "pfh:ReactNative_CommonInfrastructurePlaceholder",
+    ],
+    language = "JAVA",
+    visibility = [
+        "PUBLIC",
+    ],
+    deps = [
+        react_native_dep("third-party/java/infer-annotations:infer-annotations"),
+        react_native_dep("third-party/java/jsr-305:jsr-305"),
+        react_native_target("java/com/facebook/react/bridge:bridge"),
+        react_native_target("java/com/facebook/react/common:common"),
+        react_native_target("java/com/facebook/react/module/annotations:annotations"),
+    ],
+    exported_deps = [react_native_root_target(":FBReactNativeSpec")],
+)
diff --git a/ReactAndroid/src/main/java/com/facebook/react/modules/devloading/DevLoadingModule.java b/ReactAndroid/src/main/java/com/facebook/react/modules/devloading/DevLoadingModule.java
@@ -0,0 +1,48 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+package com.facebook.react.modules.devloading;
+
+import android.util.Log;
+import com.facebook.fbreact.specs.NativeDevLoadingViewSpec;
+import com.facebook.react.bridge.NativeModule;
+import com.facebook.react.bridge.ReactApplicationContext;
+import com.facebook.react.bridge.UiThreadUtil;
+import com.facebook.react.module.annotations.ReactModule;
+
+/** {@link NativeModule} that allows JS to show dev loading view. */
+@ReactModule(name = NativeDevLoadingViewSpec.NAME)
+public class DevLoadingModule extends NativeDevLoadingViewSpec {
+
+  public DevLoadingModule(ReactApplicationContext reactContext) {
+    super(reactContext);
+  }
+
+  @Override
+  public void showMessage(final String message, final Double color, final Double backgroundColor) {
+
+    UiThreadUtil.runOnUiThread(
+        new Runnable() {
+          @Override
+          public void run() {
+            Log.w(NAME, "Showing Message in DevLoadingModule java.");
+          }
+        });
+  }
+
+  @Override
+  public void hide() {
+
+    UiThreadUtil.runOnUiThread(
+        new Runnable() {
+          @Override
+          public void run() {
+            Log.w(NAME, "Hiding Message in DevLoadingModule java.");
+          }
+        });
+  }
+}