expo-dev-menu 4.2.0 → 4.2.1

package/.eslintignore

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

package/CHANGELOG.md

@@ -10,6 +10,19 @@
 
 ### 💡 Others
 
+## 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,7 +3,7 @@ apply plugin: 'kotlin-android'
 apply plugin: 'maven-publish'
 
 group = 'host.exp.exponent'
-version = '4.2.0'
+version = '4.2.1'
 
 buildscript {
   def expoModulesCorePlugin = new File(project(":expo-modules-core").projectDir.absolutePath, "ExpoModulesCorePlugin.gradle")
@@ -70,7 +70,7 @@ android {
     minSdkVersion safeExtGet("minSdkVersion", 21)
     targetSdkVersion safeExtGet("targetSdkVersion", 33)
     versionCode 10
-    versionName '4.2.0'
+    versionName '4.2.1'
   }
   lintOptions {
     abortOnError false

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;