expo-dev-menu 4.2.0 → 4.3.0

package/.eslintignore

@@ -0,0 +1 @@
+build

package/CHANGELOG.md

@@ -10,6 +10,37 @@
 
 ### 💡 Others
 
+## 4.3.0 — 2023-10-17
+
+### 🛠 Breaking changes
+
+- Dropped support for Android SDK 21 and 22. ([#24201](https://github.com/expo/expo/pull/24201) by [@behenate](https://github.com/behenate))
+
+### 🐛 Bug fixes
+
+- [Android] Fixed Fast Refresh being disabled by default ([#24643](https://github.com/expo/expo/pull/24643) by [@gabrieldonadel](https://github.com/gabrieldonadel))
+
+### 💡 Others
+
+- Drop support for configuring SDK 44 and below with Prebuild. ([#24504](https://github.com/expo/expo/pull/24504) by [@EvanBacon](https://github.com/EvanBacon))
+
+## 3.2.1 — 2023-09-25
+
+_This version does not introduce any user-facing changes._
+
+## 4.2.1 — 2023-09-18
+
+### 💡 Others
+
+- Fix eslint and TypeScript warnings ([#24497](https://github.com/expo/expo/pull/24497) by [@kadikraman](https://github.com/kadikraman))
+
+## 3.2.0 — 2023-09-15
+
+### 🎉 New features
+
+- Add `control+d` as a hotkey to open the menu. ([#24434](https://github.com/expo/expo/pull/24434) by [@alanjhughes](https://github.com/alanjhughes))
+- Separate `refresh` button from the rest ([#24426](https://github.com/expo/expo/pull/24426) by [@kadikraman](https://github.com/kadikraman))
+
 ## 4.2.0 — 2023-09-15
 
 ### 🎉 New features

package/android/build.gradle

@@ -3,15 +3,15 @@ apply plugin: 'kotlin-android'
 apply plugin: 'maven-publish'
 
 group = 'host.exp.exponent'
-version = '4.2.0'
+version = '4.3.0'
 
-buildscript {
-  def expoModulesCorePlugin = new File(project(":expo-modules-core").projectDir.absolutePath, "ExpoModulesCorePlugin.gradle")
-  if (expoModulesCorePlugin.exists()) {
-    apply from: expoModulesCorePlugin
-    applyKotlinExpoModulesCorePlugin()
-  }
+def expoModulesCorePlugin = new File(project(":expo-modules-core").projectDir.absolutePath, "ExpoModulesCorePlugin.gradle")
+if (expoModulesCorePlugin.exists()) {
+  apply from: expoModulesCorePlugin
+  applyKotlinExpoModulesCorePlugin()
+}
 
+buildscript {
   // Simple helper that allows the root project to override versions declared by this library.
   ext.safeExtGet = { prop, fallback ->
     rootProject.ext.has(prop) ? rootProject.ext.get(prop) : fallback
@@ -51,7 +51,19 @@ afterEvaluate {
 }
 
 android {
-  compileSdkVersion safeExtGet("compileSdkVersion", 33)
+  // Remove this if and it's contents, when support for SDK49 is dropped
+  if (!safeExtGet("expoProvidesDefaultConfig", false)) {
+    compileSdkVersion safeExtGet("compileSdkVersion", 33)
+    
+    defaultConfig {
+      minSdkVersion safeExtGet("minSdkVersion", 23)
+      targetSdkVersion safeExtGet("targetSdkVersion", 33)
+    }
+
+    lintOptions {
+      abortOnError false
+    }
+  }
 
   def agpVersion = com.android.Version.ANDROID_GRADLE_PLUGIN_VERSION
   if (agpVersion.tokenize('.')[0].toInteger() < 8) {
@@ -67,13 +79,8 @@ android {
 
   namespace "expo.modules.devmenu"
   defaultConfig {
-    minSdkVersion safeExtGet("minSdkVersion", 21)
-    targetSdkVersion safeExtGet("targetSdkVersion", 33)
     versionCode 10
-    versionName '4.2.0'
-  }
-  lintOptions {
-    abortOnError false
+    versionName '4.3.0'
   }
 
   buildTypes {

package/android/src/main/java/com/facebook/react/devsupport/DevMenuReactInternalSettings.kt

@@ -69,5 +69,12 @@ internal class DevMenuInternalSettingsWrapper(private val devSettings: DevIntern
     set(value) {
       devSettings.isRemoteJSDebugEnabled = value
     }
+
+  var isJSDevModeEnabled: Boolean
+    get() = devSettings.isJSDevModeEnabled
+    set(value) {
+      devSettings.isJSDevModeEnabled = value
+    }
+
   val packagerConnectionSettings: PackagerConnectionSettings = devSettings.packagerConnectionSettings
 }

package/android/src/main/java/expo/modules/devmenu/devtools/DevMenuDevToolsDelegate.kt

@@ -3,7 +3,6 @@ package expo.modules.devmenu.devtools
 import android.content.Context
 import android.content.Intent
 import android.net.Uri
-import android.os.Build
 import android.provider.Settings
 import android.util.Log
 import com.facebook.react.ReactInstanceManager
@@ -35,7 +34,7 @@ class DevMenuDevToolsDelegate(
   internal val devInternalSettings: DevMenuInternalSettingsWrapper?
     get() {
       val devSettings = this.devSettings ?: return null
-      return if (devSettings.javaClass.canonicalName == "com.facebook.react.DevInternalSettings") DevMenuInternalSettingsWrapper(devSettings) else null
+      return if (devSettings.javaClass.canonicalName == "com.facebook.react.devsupport.DevLauncherInternalSettings") DevMenuInternalSettingsWrapper(devSettings) else null
     }
 
   val reactContext
@@ -105,10 +104,7 @@ class DevMenuDevToolsDelegate(
    * Such permission is required to enable performance monitor.
    */
   private fun requestOverlaysPermission(context: Context) {
-    if (
-      Build.VERSION.SDK_INT >= Build.VERSION_CODES.M &&
-      !Settings.canDrawOverlays(context)
-    ) {
+    if (!Settings.canDrawOverlays(context)) {
       val uri = Uri.parse("package:" + context.applicationContext.packageName)
       val intent = Intent(Settings.ACTION_MANAGE_OVERLAY_PERMISSION, uri).apply {
         flags = Intent.FLAG_ACTIVITY_NEW_TASK

package/android/src/main/java/expo/modules/devmenu/extensions/DevMenuExtension.kt

@@ -4,6 +4,7 @@ import android.util.Log
 import android.view.KeyEvent
 import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.bridge.ReactContextBaseJavaModule
+import com.facebook.react.devsupport.HMRClient
 import expo.interfaces.devmenu.DevMenuExtensionInterface
 import expo.interfaces.devmenu.DevMenuExtensionSettingsInterface
 import expo.interfaces.devmenu.items.DevMenuDataSourceInterface
@@ -87,7 +88,20 @@ class DevMenuExtension(reactContext: ReactApplicationContext) :
       }
 
       val fastRefreshAction = {
-        devInternalSettings.isHotModuleReplacementEnabled = !devInternalSettings.isHotModuleReplacementEnabled
+        val nextEnabled = !devInternalSettings.isHotModuleReplacementEnabled
+        devInternalSettings.isHotModuleReplacementEnabled = nextEnabled
+
+       if (reactApplicationContext != null) {
+         if (nextEnabled) {
+           reactApplicationContext.getJSModule(HMRClient::class.java).enable()
+         } else {
+           reactApplicationContext.getJSModule(HMRClient::class.java).disable()
+         }
+       }
+       if (nextEnabled && !devInternalSettings.isJSDevModeEnabled) {
+         devInternalSettings.isJSDevModeEnabled = true
+         reactDevManager.handleReloadJS()
+       }
       }
 
       action("fast-refresh", fastRefreshAction) {

package/app/App.tsx

@@ -4,7 +4,6 @@ import { View } from 'react-native';
 import { AppProviders } from './components/AppProviders';
 import { LoadInitialData } from './components/LoadInitialData';
 import { Main } from './components/Main';
-import { Onboarding } from './components/Onboarding';
 import { Splash } from './components/Splash';
 import { AppInfo, DevSettings, MenuPreferences } from './native-modules/DevMenu';
 

package/app/components/LoadInitialData.tsx

@@ -1,8 +1,8 @@
 import { View } from 'expo-dev-client-components';
 import * as React from 'react';
 
-import { loadFontsAsync } from '../native-modules/DevMenu';
 import { Splash } from './Splash';
+import { loadFontsAsync } from '../native-modules/DevMenu';
 
 type LoadInitialDataProps = {
   children: React.ReactElement<any> | React.ReactElement<any>[];

package/app/components/Main.tsx

@@ -43,12 +43,13 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
   const appInfoClipboard = useClipboard();
 
   function onCopyUrlPress() {
-    const { hostUrl } = appInfo;
-    urlClipboard.onCopyPress(hostUrl);
+    if (appInfo?.hostUrl) {
+      urlClipboard.onCopyPress(appInfo.hostUrl);
+    }
   }
 
   function onCopyAppInfoPress() {
-    const { runtimeVersion, sdkVersion, appName, appVersion } = appInfo;
+    const { runtimeVersion, sdkVersion, appName, appVersion } = appInfo || {};
     appInfoClipboard.onCopyPress({ runtimeVersion, sdkVersion, appName, appVersion });
   }
 
@@ -76,9 +77,9 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
           <Row align="center" shrink="1">
             <View>
               <View height="xl" width="xl" overflow="hidden" bg="secondary" rounded="medium">
-                {Boolean(appInfo.appIcon) && (
+                {Boolean(appInfo?.appIcon) && (
                   <Image
-                    source={{ uri: appInfo.appIcon }}
+                    source={{ uri: appInfo?.appIcon }}
                     style={{ flex: 1, resizeMode: 'contain' }}
                   />
                 )}
@@ -90,22 +91,22 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
             <View shrink="1">
               <Row style={{ flexWrap: 'wrap' }}>
                 <Heading weight="bold" numberOfLines={1}>
-                  {appInfo.appName}
+                  {appInfo?.appName}
                 </Heading>
               </Row>
 
-              {Boolean(appInfo.runtimeVersion) && (
+              {Boolean(appInfo?.runtimeVersion) && (
                 <>
                   <Text size="small" color="secondary">
-                    {`Runtime version: ${appInfo.runtimeVersion}`}
+                    {`Runtime version: ${appInfo?.runtimeVersion}`}
                   </Text>
                 </>
               )}
 
-              {Boolean(appInfo.sdkVersion) && !appInfo.runtimeVersion && (
+              {Boolean(appInfo?.sdkVersion) && !appInfo?.runtimeVersion && (
                 <>
                   <Text size="small" color="secondary">
-                    {`SDK version: ${appInfo.sdkVersion}`}
+                    {`SDK version: ${appInfo?.sdkVersion}`}
                   </Text>
                 </>
               )}
@@ -129,7 +130,7 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
       <Divider />
       <View style={{ flex: 1 }}>
         <ScrollView nestedScrollEnabled>
-          {Boolean(appInfo.hostUrl) && (
+          {Boolean(appInfo?.hostUrl) && (
             <>
               <View bg="default" padding="medium">
                 <Text color="secondary">Connected to:</Text>
@@ -144,7 +145,7 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
                     <Spacer.Horizontal size="small" />
                     <Row flex="1" justify="between">
                       <Text type="mono" numberOfLines={2} size="small">
-                        {appInfo.hostUrl}
+                        {appInfo?.hostUrl}
                       </Text>
 
                       <ClipboardIcon />
@@ -276,7 +277,7 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
             </View>
           </View>
 
-          {appInfo.engine === 'Hermes' && (
+          {appInfo?.engine === 'Hermes' && (
             <>
               <Spacer.Vertical size="large" />
 
@@ -316,18 +317,18 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
           <Spacer.Vertical size="large" />
 
           <View mx="small" rounded="large" overflow="hidden">
-            <AppInfoRow title="Version" value={appInfo.appVersion} />
+            <AppInfoRow title="Version" value={appInfo?.appVersion || 'Unknown'} />
             <Divider />
-            {Boolean(appInfo.runtimeVersion) && (
+            {Boolean(appInfo?.runtimeVersion) && (
               <>
-                <AppInfoRow title="Runtime version" value={appInfo.runtimeVersion} />
+                <AppInfoRow title="Runtime version" value={appInfo?.runtimeVersion || 'Unknown'} />
                 <Divider />
               </>
             )}
 
-            {Boolean(appInfo.sdkVersion) && !appInfo.runtimeVersion && (
+            {Boolean(appInfo?.sdkVersion) && !appInfo?.runtimeVersion && (
               <>
-                <AppInfoRow title="SDK Version" value={appInfo.sdkVersion} />
+                <AppInfoRow title="SDK Version" value={appInfo?.sdkVersion || 'Unknown'} />
                 <Divider />
               </>
             )}
@@ -370,7 +371,7 @@ export function Main({ registeredCallbacks = [], isDevice }: MainProps) {
 }
 
 type SettingsRowButtonProps = {
-  icon: React.ReactElement<any>;
+  icon: React.ReactElement<any> | null;
   label: string;
   description?: string;
   onPress: () => void;

package/app/hooks/useClipboard.tsx

@@ -6,7 +6,7 @@ export function useClipboard(clearInMillis: number = 3000) {
   const [clipboardContent, setClipboardContent] = React.useState('');
   const [clipboardError, setClipboardError] = React.useState('');
 
-  const timerRef = React.useRef(null);
+  const timerRef = React.useRef<ReturnType<typeof setTimeout>>();
 
   React.useEffect(() => {
     if (clipboardContent) {

package/app/hooks/useDevSettings.tsx

@@ -17,7 +17,7 @@ const defaultDevSettings: DevMenu.DevSettings = {
   isJSInspectorAvailable: false,
 };
 
-const DevSettingsContext = React.createContext<DevMenu.DevSettings>(defaultDevSettings);
+const DevSettingsContext = React.createContext<DevMenu.DevSettings | undefined>(defaultDevSettings);
 
 export type DevSettingsProviderProps = {
   children: React.ReactNode;