Rework loadModel for ios to match the wfloat-web style

Author: mitchsayre

CONTRIBUTING.md

@@ -1,18 +1,20 @@
-# Contributing
 
-Thanks for contributing to `@wfloat/react-native-wfloat`.
+Before running the example app, create a local config file for untracked developer-specific values:
 
-This repository is a React Native library package with a local example app used to exercise the library during development.
+```ts
+// example/src/localConfig.ts
+export const LOCAL_CONFIG = {
+  modelId: 'your-model-id',
+} as const;
+```
 
-Before contributing, please read the [Code of Conduct](./CODE_OF_CONDUCT.md).
+This file is gitignored. Use it for values you need locally in the example app but do not want to commit, such as a model id.
 
 ## Repository structure
 
 - The package itself lives at the repository root.
 - The example app lives in [`example/`](./example) and is used to run the package on iOS and Android during local development.
 
-The root package is the main thing you are developing. The example app is a harness for validating package changes in a real React Native app.
-
 ## Getting started
 
 Install dependencies from the repository root:
@@ -21,100 +23,9 @@ Install dependencies from the repository root:
 yarn
 ```
 
-This repo uses Yarn workspaces. Use Yarn for development commands.
-
-## Development model
-
-Most code changes happen in the package at the repository root:
-
-- JavaScript and TypeScript source lives in [`src/`](./src).
-- iOS native code lives in [`ios/`](./ios).
-- Android native code lives in [`android/`](./android).
-- Generated package output is written to [`lib/`](./lib) by the build step.
-
-The example app in [`example/`](./example) is how you run and verify the package while you work.
-
-## Core commands
-
-From the repository root:
-
-```sh
-yarn typecheck
-yarn lint
-yarn test
-yarn prepare
-```
-
-What these do:
-
-- `yarn typecheck` runs TypeScript checks.
-- `yarn lint` runs ESLint.
-- `yarn test` runs Jest tests.
-- `yarn prepare` runs `bob build` and regenerates the package build output.
-
-## When to run `yarn prepare`
-
-Run `yarn prepare` from the repository root when you change package code that should be rebuilt into distributable output, especially:
-
-- files in `src/`
-- exported package APIs
-- codegen-related package definitions
-- package build output before publishing
-
-Broadly, `yarn prepare` is the package build step for this repository.
-
-## Working with the example app
-
-You can run the example app either from the root with the workspace script or from inside `example/`.
-
-From the repository root:
-
-```sh
-yarn example start
-yarn example ios
-yarn example android
-```
-
-Equivalent commands from `example/`:
-
-```sh
-yarn start
-yarn ios
-yarn android
-```
-
-## Typical development workflows
-
-### JavaScript or TypeScript package changes
-
-1. Edit package code in the repository root.
-2. Start Metro for the example app.
-3. Run the example app on iOS or Android.
-4. Run `yarn prepare` if you need refreshed built package output.
-
-Typical commands:
-
-```sh
-yarn example start
-yarn example ios
-```
-
-or
-
-```sh
-yarn example start
-yarn example android
-```
 
 ### iOS native changes
 
-If you change iOS native code or iOS dependency state:
-
-1. Make the package change in the repository root.
-2. Run `yarn prepare` if the package build or codegen output needs to be refreshed.
-3. Install pods from `example/ios`.
-4. Run the example app on iOS.
-
 Typical commands:
 
 ```sh
@@ -124,105 +35,3 @@ bundle exec pod install
 cd ../..
 yarn example ios
 ```
-
-Notes:
-
-- Use Bundler for CocoaPods commands.
-- Run React Native doctor for this repo from `example/`, not from the repository root.
-
-Example:
-
-```sh
-cd example
-npx react-native doctor
-```
-
-### Android native changes
-
-If you change Android native code or Android build configuration:
-
-1. Make the package change in the repository root.
-2. Run `yarn prepare` if the package build or codegen output needs to be refreshed.
-3. Run the example app on Android.
-
-Typical commands:
-
-```sh
-yarn prepare
-yarn example android
-```
-
-If you need Android codegen artifacts explicitly:
-
-```sh
-cd example/android
-./gradlew generateCodegenArtifactsFromSchema
-cd ../..
-```
-
-## Tooling notes
-
-- CocoaPods and the iOS Ruby toolchain are configured from [`example/Gemfile`](./example/Gemfile).
-- The example app links to the package in the repository root.
-- Metro is configured so the example app can develop against the local package source.
-
-## Quality checks
-
-Before opening a pull request, run:
-
-```sh
-yarn typecheck
-yarn lint
-yarn test
-```
-
-If your change affects package build output or native integration, also run:
-
-```sh
-yarn prepare
-```
-
-If your change affects iOS, also verify:
-
-```sh
-cd example/ios
-bundle exec pod install
-cd ../..
-yarn example ios
-```
-
-If your change affects Android, also verify:
-
-```sh
-yarn example android
-```
-
-## Commit messages
-
-This repo follows [Conventional Commits](https://www.conventionalcommits.org/en/v1.0.0/).
-
-Examples:
-
-- `feat: add playback status event`
-- `fix: correct Android module initialization`
-- `docs: update iOS setup instructions`
-- `chore: refresh build configuration`
-
-## Publishing
-
-This repo uses `release-it` for releases:
-
-```sh
-yarn release
-```
-
-Before publishing, make sure the package has been rebuilt and the example app still validates the current changes.
-
-## Pull requests
-
-When opening a pull request:
-
-- keep the change focused
-- include tests when practical
-- update docs when behavior or setup changes
-- mention any iOS or Android manual verification you performed

android/src/main/java/com/wfloat/WfloatModule.kt

@@ -3,6 +3,7 @@ package com.wfloat
 import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.module.annotations.ReactModule
 import com.facebook.react.bridge.Promise
+import com.facebook.react.bridge.ReadableMap
 import android.content.res.AssetManager
 import com.k2fsa.sherpa.onnx.OfflineTts
 import com.k2fsa.sherpa.onnx.OfflineTtsConfig
@@ -30,6 +31,13 @@ class WfloatModule(reactContext: ReactApplicationContext) :
     return NAME
   }
 
+  override fun loadModel(options: ReadableMap, promise: Promise) {
+    promise.reject(
+      "UNIMPLEMENTED",
+      "loadModel is only implemented on iOS right now."
+    )
+  }
+
   private fun copyDir(assetManager: AssetManager, assetDir: String, targetDir: File) {
     val assets = assetManager.list(assetDir) ?: return
     targetDir.mkdirs()

example/src/App.tsx

@@ -1,86 +1,25 @@
-import { Text, View, StyleSheet, Button } from 'react-native';
-import {
-  speech,
-  playWav,
-  loadModel,
-  unloadModel,
-  testStorage,
-  streamSpeech,
-} from '@wfloat/react-native-wfloat';
-
-const playSound = async () => {
-  try {
-    const text =
-      'Implementing a super epic duper VITS with streaming capabilities on iOS is feasible but requires custom development. VITS, originally a non-streaming text-to-speech model, has been adapted for streaming in projects like VITS Server, which supports fast inference and streaming capabilities. However, integrating such a server-based solution into an iOS app would involve setting up a backend server to handle the TTS processing and streaming the generated audio to the iOS device.'; // hellooooo hi world this is going to be a looong sentence let's see if it fails. Is a realistic text and i am messing with it";
-    // const text = 'Hello world.';
-    // const words = text.split(" ");
-    // const randomLength = Math.floor(Math.random() * words.length) + 1;
-    // const randomText = words.slice(0, randomLength).join(" ");
-
-    // console.log("random text", randomText);
-
-    const startTime = Date.now();
-    const newSound = await speech('en_US-ryan-medium', text);
-    const endTime = Date.now();
-
-    console.log(`runtime is ${endTime - startTime}ms`);
-    console.log(newSound);
-    playWav(newSound);
-  } catch (error) {
-    console.error(error);
-  }
-};
-
-const streamAudio = async () => {
-  try {
-    // const text = "Hello there Dubfloat. Wfloat is a realistic text. Anyway now you know. Auuuh, Peace out!";
-    const text =
-      'Implementing a super duper VITS with streaming capabilities on iOS is feasible but requires custom development. VITS, originally a non-streaming text-to-speech model, has been adapted for streaming in projects like VITS Server, which supports fast inference and streaming capabilities. However, integrating such a server-based solution into an iOS app would involve setting up a backend server to handle the TTS processing and streaming the generated audio to the iOS device.';
-    // const words = text.split(" ");
-    // const randomLength = Math.floor(Math.random() * words.length) + 1;
-    // const randomText = words.slice(0, randomLength).join(" ");
-
-    // console.log("random text", randomText);
-
-    const startTime = Date.now();
-    const newSound = await streamSpeech('en_US-ryan-medium', text);
-    console.log('newSound', newSound);
-    const endTime = Date.now();
-    playWav(newSound);
-
-    console.log(`runtime is ${endTime - startTime}ms`);
-    console.log(newSound);
-    // playWav(newSound);
-  } catch (error) {
-    console.error(error);
-  }
-};
+import { View, StyleSheet, Button } from 'react-native';
+import { SpeechClient } from '@wfloat/react-native-wfloat';
+import { LOCAL_CONFIG } from './localConfig';
 
 const downloadVoice = async () => {
   try {
-    // const modelPath = await loadModel('default_male');
     console.log('loading model');
-    const modelPath = await loadModel('en_US-ryan-medium');
+    await SpeechClient.loadModel(LOCAL_CONFIG.modelId, {
+      onProgressCallback: (event) => {
+        console.log('loadModel progress', event);
+      },
+    });
     console.log('model loaded');
-    console.log(modelPath);
   } catch (error) {
     console.error(error);
   }
 };
 
-const removeVoice = async () => {
-  await unloadModel('en_US-ryan-medium');
-};
-
 export default function App() {
   return (
     <View style={styles.container}>
-      {/* <Text>Result: {result}</Text> */}
-      <Button title="Stream speech" onPress={streamAudio} />
-      <Button title="Play Sound" onPress={playSound} />
       <Button title="Load model" onPress={downloadVoice} />
-      <Button title="Unload model" onPress={removeVoice} />
-      <Button title="Test Storage" onPress={testStorage} />
     </View>
   );
 }

ios/Wfloat.h

@@ -3,7 +3,7 @@
 #ifdef RCT_NEW_ARCH_ENABLED
 
 #import "generated/RNWfloatSpec/RNWfloatSpec.h"
-@interface Wfloat : NSObject <NativeWfloatSpec>
+@interface Wfloat : NativeWfloatSpecBase <NativeWfloatSpec>
 
 #else