[pull] main from expo:main

apps/native-component-list/src/screens/FileSystemScreen.tsx

@@ -109,10 +109,10 @@ function FileSourcesSection({ setCurrentFile }: { setCurrentFile: (f: File) => v
 
       <ListButton
         title="Create local file"
-        onPress={() => {
+        onPress={async () => {
           const file = new File(Paths.cache, 'test_sandbox', 'test.txt');
           file.create({ intermediates: true, overwrite: true });
-          file.write('Hello from FileSystem sandbox! Timestamp: ' + Date.now());
+          await file.write('Hello from FileSystem sandbox! Timestamp: ' + Date.now());
           setCurrentFile(file);
           Alert.alert('Created', file.uri);
         }}
@@ -279,23 +279,23 @@ function ReadWriteSection({ withCurrentFile }: { withCurrentFile: WithCurrentFil
       <SimpleActionDemo
         title="write() text"
         action={withCurrentFile(async (file) => {
-          file.write('Written at ' + new Date().toISOString());
+          await file.write('Written at ' + new Date().toISOString());
           return 'OK - size is now: ' + file.size;
         })}
       />
       <SimpleActionDemo
         title="write() base64"
         action={withCurrentFile(async (file) => {
           // Base64 of "Hello Base64!"
-          file.write('SGVsbG8gQmFzZTY0IQ==', { encoding: 'base64' });
+          await file.write('SGVsbG8gQmFzZTY0IQ==', { encoding: 'base64' });
           return 'OK - text() = ' + truncate(await file.text());
         })}
       />
       <SimpleActionDemo
         title="write() Uint8Array"
         action={withCurrentFile(async (file) => {
           const bytes = new Uint8Array([72, 101, 108, 108, 111]); // "Hello"
-          file.write(bytes);
+          await file.write(bytes);
           return 'OK - text() = ' + file.textSync();
         })}
       />
@@ -687,7 +687,7 @@ function DirectoryOperationsSection({
             title="Create file 'test_created.txt' in picked dir"
             action={async () => {
               const file = safDirectory.createFile('test_created.txt', 'text/plain');
-              file.write('Created at ' + new Date().toISOString());
+              await file.write('Created at ' + new Date().toISOString());
               setCurrentFile(file);
               return { uri: file.uri, name: file.name };
             }}
@@ -788,7 +788,7 @@ function FileLifecycleSection({
           const name = `test_${Date.now()}.txt`;
           const file = new File(Paths.cache, 'test_sandbox', name);
           file.create({ intermediates: true });
-          file.write('Created for lifecycle test');
+          await file.write('Created for lifecycle test');
           setCurrentFile(file);
           return { uri: file.uri, exists: file.exists, size: file.size };
         }}

apps/native-component-list/src/screens/UI/NavigationBarScreen.android.tsx

@@ -0,0 +1,69 @@
+import {
+  Box,
+  Column,
+  Host,
+  Icon,
+  NavigationBar,
+  NavigationBarItem,
+  Surface,
+  Text as ComposeText,
+} from '@expo/ui/jetpack-compose';
+import { align, fillMaxSize, fillMaxWidth, padding } from '@expo/ui/jetpack-compose/modifiers';
+import * as React from 'react';
+
+const mailIcon = require('../../../assets/icons/ui/mail.xml');
+const personIcon = require('../../../assets/icons/ui/person.xml');
+const wifiIcon = require('../../../assets/icons/ui/wifi.xml');
+
+const tabs = [
+  { key: 'mail', label: 'Mail', icon: mailIcon },
+  { key: 'profile', label: 'Profile', icon: personIcon },
+  { key: 'network', label: 'Network', icon: wifiIcon },
+] as const;
+
+export default function NavigationBarScreen() {
+  const [selectedTab, setSelectedTab] = React.useState<(typeof tabs)[number]['key']>('mail');
+  const selected = tabs.find((tab) => tab.key === selectedTab) ?? tabs[0];
+
+  return (
+    <Host style={{ flex: 1 }}>
+      <Box modifiers={[fillMaxSize()]}>
+        <Surface modifiers={[fillMaxSize()]}>
+          <Column
+            horizontalAlignment="center"
+            verticalArrangement={{ spacedBy: 16 }}
+            modifiers={[fillMaxWidth(), padding(24, 32, 24, 120)]}>
+            <Icon source={selected.icon} size={48} />
+            <ComposeText style={{ typography: 'headlineSmall' }}>{selected.label}</ComposeText>
+            <ComposeText style={{ typography: 'bodyMedium' }}>
+              Tap a destination in the navigation bar.
+            </ComposeText>
+          </Column>
+        </Surface>
+
+        <NavigationBar modifiers={[align('bottomCenter'), fillMaxWidth()]}>
+          {tabs.map((tab) => (
+            <NavigationBarItem
+              key={tab.key}
+              selected={selectedTab === tab.key}
+              onClick={() => setSelectedTab(tab.key)}>
+              <NavigationBarItem.Icon>
+                <Icon source={tab.icon} size={24} />
+              </NavigationBarItem.Icon>
+              <NavigationBarItem.SelectedIcon>
+                <Icon source={tab.icon} size={24} />
+              </NavigationBarItem.SelectedIcon>
+              <NavigationBarItem.Label>
+                <ComposeText>{tab.label}</ComposeText>
+              </NavigationBarItem.Label>
+            </NavigationBarItem>
+          ))}
+        </NavigationBar>
+      </Box>
+    </Host>
+  );
+}
+
+NavigationBarScreen.navigationOptions = {
+  title: 'NavigationBar',
+};

apps/native-component-list/src/screens/UI/UIScreen.android.tsx

@@ -266,6 +266,14 @@ export const UIScreens = [
       return optionalRequire(() => require('./ListScreen'));
     },
   },
+  {
+    name: 'NavigationBar component',
+    route: 'ui/navigation-bar',
+    options: {},
+    getComponent() {
+      return optionalRequire(() => require('./NavigationBarScreen'));
+    },
+  },
   {
     name: 'BottomSheet component',
     route: 'ui/bottomsheet',

apps/test-suite/tests/ContactsNext.ts

@@ -120,7 +120,7 @@ export async function test(t) {
       const url = 'https://picsum.photos/200';
       const response = await fetch(url);
       const src = new File(Paths.cache, 'file.pdf');
-      src.write(await response.bytes());
+      await src.write(await response.bytes());
       const contactDetails = {
         givenName: 'Image',
         familyName: 'User',
@@ -960,7 +960,7 @@ export async function test(t) {
       const url = 'https://picsum.photos/200';
       const response = await fetch(url);
       const src = new File(Paths.cache, 'file.pdf');
-      src.write(await response.bytes());
+      await src.write(await response.bytes());
       await contact.setImage(src.uri);
       const retrievedImage = await contact.getImage();
       const retrievedThumbnail = await contact.getThumbnail();