Update CONTRIBUTING.md

Author: fabOnReact

CONTRIBUTING.md

@@ -4,56 +4,109 @@ Contributions are always welcome, no matter how large or small!
 
 We want this community to be friendly and respectful to each other. Please follow it in all your interactions with the project. Before contributing, please read the [code of conduct](./CODE_OF_CONDUCT.md).
 
-## Development workflow
+https://github.com/user-attachments/assets/100ee026-550f-4d84-b180-58874ae2b395
 
-This project is a monorepo managed using [Yarn workspaces](https://yarnpkg.com/features/workspaces). It contains the following packages:
+### How to run the React Native Mobile example
 
-- The library package in the root directory.
-- The mobile android app is in the `example/` directory.
-- The Wear OS android app is in the `watch-example/` directory.
+You need to clone the `react-native-wear-connectivity` project, build and run the mobile app example.
 
-To get started with the project, run `yarn` in the root directory to install the required dependencies for each package:
-
-```sh
+```
+git clone https://github.com/fabOnReact/react-native-wear-connectivity
+cd react-native-wear-connectivity 
+yarn
+cd example
 yarn
+yarn android
 ```
 
-### Pair the Android and WearOS emulators
+### How to run the Jetpack Compose WearOS example
 
-- Create a new emulator of type [WearOS Large round][22].
-- Pair the Android emulator with the Wear OS emulator. Follow this [instructions][21].
+1) Clone the WearOS Jetpack Compose [example](https://github.com/fabOnReact/wearos-communication-with-rn)
 
-### Build the Mobile App
+```
+git clone https://github.com/fabOnReact/wearos-communication-with-rn
+```
 
-The first step is building the react-native Android mobile app.
+2) Open the project with android studio, build and run it on an [Android WearOS emulator](https://github-production-user-asset-6210df.s3.amazonaws.com/24992535/303911079-f6cb9f84-dc50-492b-963d-6d9e9396f451.png?X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAVCODYLSA53PQK4ZA%2F20250125%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250125T110158Z&X-Amz-Expires=300&X-Amz-Signature=4bd2be95943124fe34fb13e6a54e9a2fe8a9c06d1eb8afdf005ce02cf43c90d1&X-Amz-SignedHeaders=host).
 
-```bash
-cd example
-yarn install
-yarn start
-# Now build android
-yarn android
+3) Now you can pair the WearOS emulator with the Android Mobile Emulator as explained in these [instructions](https://developer.android.com/training/wearables/get-started/connect-phone).
+
+### Detailed explanation on how WearOS (Jetpack Compose) communicates with React Native (Android Mobile)
+
+**Sending messages from Jetpack Compose WearOS to React Native Mobile Device**
+
+[sendMessageToClient](https://github.com/fabOnReact/wearos-communication-with-rn/blob/371e6c5862d49ccbff08ab951a26284a216daf97/app/src/main/java/com/wearconnectivityexample/presentation/MainActivity.kt#L75-L87) is implemented on Jetpack Compose WearOS to send messages to the React Native Mobile App. `sendMessageToClient` is triggered on WearOS when [clicking](https://github.com/fabOnReact/wearos-communication-with-rn/blob/371e6c5862d49ccbff08ab951a26284a216daf97/app/src/main/java/com/wearconnectivityexample/presentation/WearApp.kt#L31) on the watch Button Component.
+
+```kotlin
+fun sendMessageToClient(node: Node) {
+    val jsonObject = JSONObject().apply {
+        put("event", "message")
+        put("text", "hello")
+    }
+    try {
+        val sendTask = Wearable.getMessageClient(applicationContext).sendMessage(
+            node.getId(), jsonObject.toString(), null
+        )
+    } catch (e: Exception) {
+        Log.w("WearOS: ", "e $e")
+    }
+}
 ```
 
-### Build the WearOS App
+The WearOS `sendMessageToClient` function retrieves the devices connected via bluetooth to the WearOS device, and sends a JSON payload to those devices. 
+
+The payload is:
 
-```bash
-cd watch-example
-yarn install
-yarn start --port=8082
+```javascript
+{
+   event: "message",
+   text: "this is the message parameter",
+}
 ```
 
-Build the project with `yarn android`, open the [react native dev menu][23] and change the bundle location to `your-ip:8082` (for ex. `192.168.18.2:8082`).
-Now you can build the WearOS app with the command:
+The React Native Mobile App uses `watchEvents.on(eventName, callback)` to listen to the `message` event and to increase the number displayed in the React Native Mobile App. The implementation in the React Native Mobile example is in [CounterScreen/index.android.tsx](https://github.com/fabOnReact/react-native-wear-connectivity/blob/2f936622422e197c22bef228b44eb24b46c878ae/example/src/CounterScreen/index.android.tsx#L14-L16).
 
-```bash
-yarn android
+```javascript
+useEffect(() => {
+  const unsubscribe = watchEvents.on('message', () => {
+    setCount((prevCount) => prevCount + 1);
+  });
+
+
+  return () => {
+    unsubscribe();
+  };
+}, []);
+```
+
+**Sending messages from React Native Mobile Device to Jetpack Compose WearOS**
+
+The React Native Mobile App Example sends messages to the WearOS Jetpack Compose example with [sendMessage](https://github.com/fabOnReact/react-native-wear-connectivity/blob/2f936622422e197c22bef228b44eb24b46c878ae/example/src/CounterScreen/index.android.tsx#L29-L33).
+
+```javascript
+const sendMessageToWear = () => {
+  setDisabled(true);
+  const json = { text: 'hello' };
+  sendMessage(json, onSuccess, onError);
+};
 ```
 
-[20]: https://reactnative.dev/docs/next/signed-apk-android
-[21]: https://developer.android.com/training/wearables/get-started/connect-phone
-[22]: https://gist.github.com/assets/24992535/f6cb9f84-dc50-492b-963d-6d9e9396f451 'wear os large round'
-[23]: https://reactnative.dev/docs/debugging
+The Jetpack Compose WearOS app implements [onMessageReceived](https://github.com/fabOnReact/wearos-communication-with-rn/blob/371e6c5862d49ccbff08ab951a26284a216daf97/app/src/main/java/com/wearconnectivityexample/presentation/MainActivity.kt#L89-L95) and updates the Counter number on the screen when the message is received:
+
+```kotlin
+override fun onMessageReceived(messageEvent: MessageEvent) {
+    val jsonObject = JSONObject(messageEvent.path)
+    val event = jsonObject.getString("event")
+    if (event.equals("message")) {
+        count = count + 1;
+    }
+}
+```
+
+onMessageReceived modifies the [count state variable](https://github.com/fabOnReact/wearos-communication-with-rn/blob/371e6c5862d49ccbff08ab951a26284a216daf97/app/src/main/java/com/wearconnectivityexample/presentation/MainActivity.kt#L31) and re-renders the Counter component with a new [text](https://github.com/fabOnReact/wearos-communication-with-rn/blob/371e6c5862d49ccbff08ab951a26284a216daf97/app/src/main/java/com/wearconnectivityexample/presentation/WearApp.kt#L46).
+
+You can copy the [implementation](https://github.com/fabOnReact/wearos-communication-with-rn/tree/main/app/src/main/java/com/wearconnectivityexample/presentation) from the example, or follow the instructions above to rename package name, application id and change the signing key to pair that example with your React Native App.
+
 
 ### Sending a pull request
 
@@ -62,19 +115,10 @@ yarn android
 When you're sending a pull request:
 
 - Prefer small pull requests focused on one change.
-- Verify that linters and tests are passing.
 - Review the documentation to make sure it looks good.
 - Follow the pull request template when opening a pull request.
 - For pull requests that change the API or implementation, discuss with maintainers first by opening an issue.
 
-### Linting and tests
-
-[ESLint](https://eslint.org/), [Prettier](https://prettier.io/), [TypeScript](https://www.typescriptlang.org/)
-
-We use [TypeScript](https://www.typescriptlang.org/) for type checking, [ESLint](https://eslint.org/) with [Prettier](https://prettier.io/) for linting and formatting the code, and [Jest](https://jestjs.io/) for testing.
-
-Our pre-commit hooks verify that the linter and tests pass when committing.
-
 ### Publishing to npm
 
 We use [release-it](https://github.com/release-it/release-it) to make it easier to publish new versions. It handles common tasks like bumping version based on semver, creating tags and releases etc.
@@ -84,12 +128,3 @@ To publish new versions, run the following:
 ```sh
 yarn release
 ```
-
-### Scripts
-
-The `package.json` file contains various scripts for common tasks:
-
-- `yarn`: setup project by installing dependencies.
-- `yarn typecheck`: type-check files with TypeScript.
-- `yarn lint`: lint files with ESLint.
-- `yarn test`: run unit tests with Jest.