fix: correct way to upload file

app/audio.tsx

@@ -3,6 +3,7 @@ import {SafeAreaView, View} from 'react-native';
 import {css} from '@emotion/native';
 import {IconButton, Typography} from 'dooboo-ui';
 import {Audio} from 'expo-av';
+import * as FileSystem from 'expo-file-system';
 
 import {uploadFileToSupabase} from '../supabase';
 
@@ -54,7 +55,7 @@ export default function AudioPage(): JSX.Element {
   };
 
   const stopRecording = async (): Promise<void> => {
-    console.log('Stopping recoasync async recording..');
+    console.log('Stopping recording..');
     setRecording(undefined);
     await recording?.stopAndUnloadAsync();
     await Audio.setAudioModeAsync({allowsRecordingIOS: false});
@@ -81,8 +82,12 @@ export default function AudioPage(): JSX.Element {
 
   const uploadFile = async (): Promise<void> => {
     try {
+      const base64 = await FileSystem.readAsStringAsync(uri!, {
+        encoding: FileSystem.EncodingType.Base64,
+      });
+
       const path = await uploadFileToSupabase({
-        file: uri!,
+        base64: base64,
         bucket: 'audios',
         destPath: 'audio.m4a',
       });

package.json

@@ -32,13 +32,15 @@
     "@react-native-google-signin/google-signin": "^11.0.1",
     "@shopify/flash-list": "1.6.4",
     "@supabase/supabase-js": "^2.43.2",
+    "base64-arraybuffer": "^1.0.2",
     "date-fns": "^3.6.0",
     "dooboo-ui": "^0.2.31",
     "expo": "~51.0.8",
     "expo-av": "~14.0.5",
     "expo-constants": "~16.0.1",
     "expo-dev-client": "~4.0.14",
     "expo-device": "~6.0.2",
+    "expo-file-system": "~17.0.1",
     "expo-font": "~12.0.5",
     "expo-image": "~1.12.9",
     "expo-image-picker": "~15.0.5",

supabase.ts

@@ -2,6 +2,7 @@ import 'react-native-url-polyfill/auto';
 
 import AsyncStorage from '@react-native-async-storage/async-storage';
 import {createClient} from '@supabase/supabase-js';
+import {decode} from 'base64-arraybuffer';
 
 import type {Database} from './src/types/supabase';
 import {supabaseAnonKey, supabaseUrl} from './config';
@@ -16,17 +17,19 @@ export const supabase = createClient<Database>(supabaseUrl, supabaseAnonKey, {
 });
 
 export const uploadFileToSupabase = async ({
-  file,
+  base64: file,
   bucket,
   destPath,
 }: {
-  file: string;
+  base64: string;
   bucket: string;
   destPath: string;
 }): Promise<string> => {
   const {data, error} = await supabase.storage
     .from(bucket)
-    .upload(destPath, file, {});
+    .upload(destPath, decode(file), {
+      contentType: 'audio/m4a',
+    });
 
   if (error) {
     throw error;