From 8ea7d49cbec15b4ebd93595976abf5e58deda814 Mon Sep 17 00:00:00 2001
From: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Date: Thu, 20 Aug 2026 13:22:06 -0400
Subject: [PATCH 1/2] docs(vue): update code to match tutorial gallery

---
 docs/vue/your-first-app/7-live-reload.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/docs/vue/your-first-app/7-live-reload.md b/docs/vue/your-first-app/7-live-reload.md
index 27239e270b..4e78c1b571 100644
--- a/docs/vue/your-first-app/7-live-reload.md
+++ b/docs/vue/your-first-app/7-live-reload.md
@@ -154,7 +154,7 @@ Wrap each image in a `<button>` element with a click handler. When the app user
 
       <ion-grid>
         <ion-row>
-          <ion-col size="6" v-for="(photo, index) in photos" :key="photo">
+          <ion-col size="6" v-for="(photo, index) in photos" :key="index">
             <!-- CHANGE: Wrap the image in a button element and add a click event listener -->
             <button @click="showActionSheet(photo)">
               <img :src="photo.webviewPath" :alt="`Photo ${index + 1}`" loading="lazy" />

From 0ef7b4edd02992e4251daf286312fcdbfed7942a Mon Sep 17 00:00:00 2001
From: Brandy Smith <6577830+brandyscarney@users.noreply.github.com>
Date: Thu, 20 Aug 2026 14:36:37 -0400
Subject: [PATCH 2/2] docs(tutorial): update readFile code to reflect tutorials

---
 .../your-first-app/4-loading-photos.md        |  8 ++++----
 .../angular/your-first-app/5-adding-mobile.md |  8 ++++----
 docs/react/your-first-app/4-loading-photos.md |  8 ++++----
 docs/react/your-first-app/5-adding-mobile.md  | 16 +++++++--------
 docs/vue/your-first-app/4-loading-photos.md   | 12 +++++------
 docs/vue/your-first-app/5-adding-mobile.md    | 20 +++++++++----------
 6 files changed, 36 insertions(+), 36 deletions(-)

diff --git a/docs/angular/your-first-app/4-loading-photos.md b/docs/angular/your-first-app/4-loading-photos.md
index 1855f976c5..bf14ebd738 100644
--- a/docs/angular/your-first-app/4-loading-photos.md
+++ b/docs/angular/your-first-app/4-loading-photos.md
@@ -105,13 +105,13 @@ export class PhotoService {
     // CHANGE: Display the photo by reading into base64 format
     for (const photo of photos) {
       // Read each saved photo's data from the Filesystem
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.filepath,
         directory: Directory.Data,
       });
 
       // Web platform only: Load the photo as base64 data
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
 
     // CHANGE: Set the signal so the gallery view updates
@@ -196,13 +196,13 @@ export class PhotoService {
 
     for (const photo of photos) {
       // Read each saved photo's data from the Filesystem
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.filepath,
         directory: Directory.Data,
       });
 
       // Web platform only: Load the photo as base64 data
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
 
     this.photos.set(photos);
diff --git a/docs/angular/your-first-app/5-adding-mobile.md b/docs/angular/your-first-app/5-adding-mobile.md
index ce7c3480d1..21d10528ae 100644
--- a/docs/angular/your-first-app/5-adding-mobile.md
+++ b/docs/angular/your-first-app/5-adding-mobile.md
@@ -160,13 +160,13 @@ public async loadSaved() {
   // If running on the web...
   if (!this.platform.is('hybrid')) {
     for (const photo of photos) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
           path: photo.filepath,
           directory: Directory.Data
       });
 
       // Web platform only: Load the photo as base64 data
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
   }
 
@@ -278,12 +278,12 @@ export class PhotoService {
     // If running on the web...
     if (!this.platform.is('hybrid')) {
       for (const photo of photos) {
-        const readFile = await Filesystem.readFile({
+        const file = await Filesystem.readFile({
           path: photo.filepath,
           directory: Directory.Data,
         });
         // Web platform only: Load the photo as base64 data
-        photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+        photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
       }
     }
 
diff --git a/docs/react/your-first-app/4-loading-photos.md b/docs/react/your-first-app/4-loading-photos.md
index 6b6a42a199..aebbfbaf6a 100644
--- a/docs/react/your-first-app/4-loading-photos.md
+++ b/docs/react/your-first-app/4-loading-photos.md
@@ -106,11 +106,11 @@ export function usePhotoGallery() {
 
       // CHANGE: Display the photo by reading into base64 format
       for (const photo of photosInPreferences) {
-        const readFile = await Filesystem.readFile({
+        const file = await Filesystem.readFile({
           path: photo.filepath,
           directory: Directory.Data,
         });
-        photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+        photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
       }
 
       setPhotos(photosInPreferences);
@@ -143,11 +143,11 @@ export function usePhotoGallery() {
       const photosInPreferences = (photoList ? JSON.parse(photoList) : []) as UserPhoto[];
 
       for (const photo of photosInPreferences) {
-        const readFile = await Filesystem.readFile({
+        const file = await Filesystem.readFile({
           path: photo.filepath,
           directory: Directory.Data,
         });
-        photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+        photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
       }
 
       setPhotos(photosInPreferences);
diff --git a/docs/react/your-first-app/5-adding-mobile.md b/docs/react/your-first-app/5-adding-mobile.md
index 9585640b1f..a3c6f48d78 100644
--- a/docs/react/your-first-app/5-adding-mobile.md
+++ b/docs/react/your-first-app/5-adding-mobile.md
@@ -46,10 +46,10 @@ const savePicture = async (photo: Photo, fileName: string): Promise<UserPhoto> =
   // CHANGE: Add platform check
   // "hybrid" will detect mobile - iOS or Android
   if (isPlatform('hybrid')) {
-    const readFile = await Filesystem.readFile({
+    const file = await Filesystem.readFile({
       path: photo.path!,
     });
-    base64Data = readFile.data;
+    base64Data = typeof file.data === 'string' ? file.data : await file.data.text();
   } else {
     // Fetch the photo, read as a blob, then convert to base64 format
     const response = await fetch(photo.webPath!);
@@ -93,11 +93,11 @@ const loadSaved = async () => {
   // If running on the web...
   if (!isPlatform('hybrid')) {
     for (const photo of photosInPreferences) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.filepath,
         directory: Directory.Data,
       });
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
   }
 
@@ -131,11 +131,11 @@ export function usePhotoGallery() {
       // If running on the web...
       if (!isPlatform('hybrid')) {
         for (const photo of photosInPreferences) {
-          const readFile = await Filesystem.readFile({
+          const file = await Filesystem.readFile({
             path: photo.filepath,
             directory: Directory.Data,
           });
-          photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+          photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
         }
       }
 
@@ -167,10 +167,10 @@ export function usePhotoGallery() {
     let base64Data: string | Blob;
     // "hybrid" will detect mobile - iOS or Android
     if (isPlatform('hybrid')) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.path!,
       });
-      base64Data = readFile.data;
+      base64Data = typeof file.data === 'string' ? file.data : await file.data.text();
     } else {
       // Fetch the photo, read as a blob, then convert to base64 format
       const response = await fetch(photo.webPath!);
diff --git a/docs/vue/your-first-app/4-loading-photos.md b/docs/vue/your-first-app/4-loading-photos.md
index 73022a5cef..8c8544840f 100644
--- a/docs/vue/your-first-app/4-loading-photos.md
+++ b/docs/vue/your-first-app/4-loading-photos.md
@@ -117,11 +117,11 @@ export const usePhotoGallery = () => {
 
     // CHANGE: Display the photo by reading into base64 format
     for (const photo of photosInPreferences) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.filepath,
         directory: Directory.Data,
       });
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
 
     photos.value = photosInPreferences;
@@ -207,11 +207,11 @@ export const usePhotoGallery = () => {
     const photosInPreferences = photoList.value ? JSON.parse(photoList.value) : [];
 
     for (const photo of photosInPreferences) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.filepath,
         directory: Directory.Data,
       });
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
 
     photos.value = photosInPreferences;
@@ -305,11 +305,11 @@ export const usePhotoGallery = () => {
     const photosInPreferences = photoList.value ? JSON.parse(photoList.value) : [];
 
     for (const photo of photosInPreferences) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.filepath,
         directory: Directory.Data,
       });
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
 
     photos.value = photosInPreferences;
diff --git a/docs/vue/your-first-app/5-adding-mobile.md b/docs/vue/your-first-app/5-adding-mobile.md
index 8401eedcbc..0ef2f5bdcf 100644
--- a/docs/vue/your-first-app/5-adding-mobile.md
+++ b/docs/vue/your-first-app/5-adding-mobile.md
@@ -47,10 +47,10 @@ const savePicture = async (photo: Photo, fileName: string): Promise<UserPhoto> =
   // CHANGE: Add platform check
   // "hybrid" will detect mobile - iOS or Android
   if (isPlatform('hybrid')) {
-    const readFile = await Filesystem.readFile({
+    const file = await Filesystem.readFile({
       path: photo.path!,
     });
-    base64Data = readFile.data;
+    base64Data = typeof file.data === 'string' ? file.data : await file.data.text();
   } else {
     // Fetch the photo, read as a blob, then convert to base64 format
     const response = await fetch(photo.webPath!);
@@ -98,10 +98,10 @@ const savePicture = async (photo: Photo, fileName: string): Promise<UserPhoto> =
   // CHANGE: Add platform check
   // "hybrid" will detect mobile - iOS or Android
   if (isPlatform('hybrid')) {
-    const readFile = await Filesystem.readFile({
+    const file = await Filesystem.readFile({
       path: photo.path!,
     });
-    base64Data = readFile.data;
+    base64Data = typeof file.data === 'string' ? file.data : await file.data.text();
   } else {
     // Fetch the photo, read as a blob, then convert to base64 format
     const response = await fetch(photo.webPath!);
@@ -145,12 +145,12 @@ const loadSaved = async () => {
   // If running on the web...
   if (!isPlatform('hybrid')) {
     for (const photo of photosInPreferences) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.filepath,
         directory: Directory.Data,
       });
       // Web platform only: Load the photo as base64 data
-      photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+      photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
     }
   }
 
@@ -195,10 +195,10 @@ export const usePhotoGallery = () => {
     let base64Data: string | Blob;
     // "hybrid" will detect mobile - iOS or Android
     if (isPlatform('hybrid')) {
-      const readFile = await Filesystem.readFile({
+      const file = await Filesystem.readFile({
         path: photo.path!,
       });
-      base64Data = readFile.data;
+      base64Data = typeof file.data === 'string' ? file.data : await file.data.text();
     } else {
       // Fetch the photo, read as a blob, then convert to base64 format
       const response = await fetch(photo.webPath!);
@@ -253,12 +253,12 @@ export const usePhotoGallery = () => {
     // If running on the web...
     if (!isPlatform('hybrid')) {
       for (const photo of photosInPreferences) {
-        const readFile = await Filesystem.readFile({
+        const file = await Filesystem.readFile({
           path: photo.filepath,
           directory: Directory.Data,
         });
         // Web platform only: Load the photo as base64 data
-        photo.webviewPath = `data:image/jpeg;base64,${readFile.data}`;
+        photo.webviewPath = `data:image/jpeg;base64,${file.data}`;
       }
     }