feat(expo-plugin): add watch expo plugin

[CristiCeban]

Hello and thank you very much for this package!
I've seen several requests to implement this feature, basically this pr adds plugin expo functionality, i.e. dynamically adds a watch target (including all necessary files, build configuration, fixes some issues with xcode 15, etc...).
You can test it with this repo https://github.com/CristiCeban/watch-example, which contains more information.
The main idea is taken from here and modified where needed, thanks a lot to this repo!

I attach a video with a working example (the watch app was generated entirely from the example-repo).

watch_integration.mp4

[yolpsoftware]

Looks okay to me, tested on our app (see here)

[yolpsoftware]

@mtford90 @walterholohan could you have a look at this please? Would be nice if we could release this soon, together with the other open PRs.

[walterholohan]

approved. WIll need @mtford90 to release new version however

[CristiCeban]

please don't merge this this pr until I add some warnings following the discussion here . I will also add some documentation to make it very clear how to integrate this plugin with expo prebuild.
Thanks!

[CristiCeban]

@yolpsoftware @walterholohan @mtford90 All good, I added docs for this. Could be reviewed and merged if everything is ok

[yolpsoftware]

@CristiCeban I just noticed something that might be a bug. If I place a file into a subfolder of the /watch folder, the file will not be included in the Xcode project.

Seems the Expo plugin creates an entry in project.pbxproj for the subfolder, but not for the actual files.

[yolpsoftware]

@CristiCeban another thing are resources for the Watch target. Not a strict requirement, since I can of course open the project in Xcode after the expo prebuild and add the resource files there.

But if you see an easy way to add resources when you generate the pbxproj file, this would be much appreciated. Maybe we can use some simple convention, like having a folder watch/resources, and all files in this folder get added as resources by the plugin.

Or, we make a list of common resource types (.jpg, .png, .jpeg, .mp3, .mp4 etc.), and the plugin automatically marks files of those types in the watch folder as resources for the Watch target.

What do you think?

Thanks again for your work on this.

EDIT: just saw that something like this already exists. If you could extend line 8 of plugin/src/ios/getFiles.ts by mp3, that would be great!

[CristiCeban]

@yolpsoftware Yes, I know about this issue, the big problem is that some folders used in xcode have extensions, such as resources.xcassets, it being a folder, but you have to link it as a file in xcode.
Likewise there's a big hassle with paths in subfolders, namely the linking part in xcode with the parser I used. At the moment the solution would be to put them all in a watch folder, no subfolders. it's a known limitation. I'll try to take the time to see how to ok implement this feature, but it won't be in the exact next while. If you have ideas, feel free to send a pr, or tell me how you're thinking of doing this.
Also out of curiosity, did you manage to test this pr on the app you were talking about? Does the integration part work ok? did you also manage to publish using this expo plugin?

[yolpsoftware]

@CristiCeban I see. Maybe, in the meantime, it would make sense that subfolders of the watch folder are copied to the main ios/watch folder by the plugin? That way, we can have a well-structured directory in the source repository. This is of course a hack, but I think it would be better than to just copy the subfolder files in a way such that they are not used in the build.

Yes, we are currently using the PR on our app (which is still in development). Everything works fine so far, the app gets published onto Testflight, including its Watch extension. We are able to build it by using Xcode and via a local EAS build (which uses Fastlane):

npx expo prebuild --platform ios --clean
eas build --platform ios --local --clear-cache

But EAS build works only if npx expo prebuild has been run before invoking eas build, so I doubt that the build would work on an EAS server.

So, great work, makes handling the Watch extension much more easy!

[JeffOtano]

@CristiCeban @yolpsoftware Any updates on getting this merged?

We would love to use this to develop a watch app for our expo app!

[yolpsoftware]

@walterholohan could you please take a look at and approve this?

@mtford90 could you please merge and release this?

[walterholohan]

Approved, great work everyone

[CristiCeban]

I see that more people want to use and test this integration. The author of this package I don't know if he still maintains it, can do release, etc. For this reason I made a fork and published the package as react-native-watch-connectivity-expo. You can download it from npm and use it like any other project. You can look here for an example of the integration. When this pr is merged and a new release is made, then you can use the original version again. Until then you can use the forked version.

CC: @JeffOtano @walterholohan

P.S
@yolpsoftware I'll try to look at the subfolder thing in the next little while, as I find the time. I can't give a timeline, but hopefully soon.

[yolpsoftware]

@CristiCeban are you actively using this library? Would you be interested in joining as a maintainer?

[craigsheen]

👋 This has been working amazingly!

I recently updated my mac however and when I run npx expo prebuild -p ios --clean it now errors.

[Xcodeproj] Consistency issue: unexpected multiple parents for object 'watch': [<PBXGroup path='Pods' UUID='D65327D7A22EEC0BE12398D9'>, <PBXGroup UUID='83CBB9F61A601CBA00E9B192'>]

This is the error it gives, and what seems like is happening is that the watch child project is now added to 2 pbxgroups and it doesn't like that. Any ideas on how to get around this without manually having to try remove one of the lines each time?