matejkriz/react-native-today-widget

iOS Today Widget in React Native

react-native-today-widget's Issues

Memory usage too high?

I can't seem to run the today widget on a device. I've tried creating my own today widget as well, and it seems to crash with an 'Unable to load' screen. This is likely because of too much memory usage. Does anyone have any insight into this?

No response after adding the configuration

According to the documentation and demo code, the widget cannot be implemented

[error] react-native link Package name not found in {app-folder}/android/app/src/debug/AndroidManifest.xml

I've been receiving this error when I try to use react-native link command after installing.

rnpm-install ERR! ERRPACKAGEJSON No package found. Are you sure this is a React Native project?

Package name not found in {app-folder}/android/app/src/debug/AndroidManifest.xml

react-native-cl version: 2.0.1
react-native version: 0.47.2
npm version - 5.3.0
yarn version - 0.28.4

In the case that this is indeed a bug and not a misconfiguration of my part, how should I do the manual instalation of the extension in the lib? I've tried to do it using the scripts contained in the bin folder, but so far I could not get it right.

Widget did display callback?

Just checking out this project, pretty cool how it works!

One question I have, I'd like to "refresh" the widget when it's shown i.e. to hit an endpoint and display updated information. Is there any way to detect when the widget is displayed?

eject from node_modules

The goal is to provide an easy way for moving the widget from node_modules somewhere else to be under version control.

The reason for this is to be able to modify native project of the widget (e.g. to be able to add some native dependency for the widget).

library not found for -lRCTImage

Description

I just finished installing the react-native-today-widget as instruction, but couldn't build the project due to the error: library not found for -lRCTImage

Steps to reproduce

1. react-native install react-native-today-widget
2. open X-code project
3. Clean build folder
4. build

System configuration

[email protected]
SDKs:
iOS SDK:
Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
Android SDK:
API Levels: 23, 24, 25, 26, 27, 28
Build Tools: 23.0.1, 27.0.3, 28.0.3
System Images: android-24 | Google Play Intel x86 Atom
IDEs:
Android Studio: 3.4 AI-183.6156.11.34.5522156
Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
npmPackages:
react: 16.8.3 => 16.8.3
react-native: 0.59.9 => 0.59.9
npmGlobalPackages:
react-native-cli: 2.0.1
Update: It seems like all the libRCT.... libraries can cause this error. Because i tried deleting the library one by one until i got no error announced, i just keft : JavaScriptCore.framework and NotificationCenter.framework it still raised 3 errors:
Undefined symbols for architecture x86_64:
"OBJC_CLASS$_RCTRootView", referenced from:
objc-class-ref in TodayViewController.o
"OBJC_CLASS$_RCTBundleURLProvider", referenced from:
objc-class-ref in TodayViewController.o
"_RCTRegisterModule", referenced from:
+[Linking load] in Linking.o
+[DisplayMode load] in DisplayMode.o
ld: symbol(s) not found for architecture x86_64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

Xcode Crash after linking

native-today-widget/ios/../../react-native/packager/react-native-xcode.sh: No such file or directory

Error: Bundle identifier

while attempting to run my app, it reached the following build error:

The following build commands failed: ValidateEmbeddedBinary build/Build/Products/Debug-iphonesimulator/WidgetTest.app/PlugIns/TodayWidgetExtension.appex (1 failure)

and above it listed this:

`error: Embedded binary's bundle identifier is not prefixed with the parent app's bundle identifier.

	Embedded Binary Bundle Identifier:	.TodayWidgetExtension
	Parent App Bundle Identifier:		org.reactjs.native.example.WidgetTest`

i installed all the dependencies and multiple tests yielded the same error.
am i doing anything wrong? i copy-pasted the widget code from the example and it still doesnt work.

Failed to build iOS project.

Description

I was just following the steps in /Example/Basic and nothing else. I added react-native-today-widget and run react-native link. Then TodayWidget.js and index.widget.js. At last, I run react-native run-ios, and then it said failed to build ios project.

Steps to reproduce

Just steps above.

System configuration

I'm using [email protected].

Results of react-native info:

info
  React Native Environment Info:
    System:
      OS: macOS 10.14.5
      CPU: (4) x64 Intel(R) Core(TM) i5-5257U CPU @ 2.70GHz
      Memory: 145.09 MB / 8.00 GB
      Shell: 5.3 - /bin/zsh
    Binaries:
      Node: 10.16.0 - /usr/local/bin/node
      Yarn: 1.6.0 - ~/.yarn/bin/yarn
      npm: 6.9.0 - /usr/local/bin/npm
      Watchman: 4.9.0 - /usr/local/bin/watchman
    SDKs:
      iOS SDK:
        Platforms: iOS 12.2, macOS 10.14, tvOS 12.2, watchOS 5.2
    IDEs:
      Xcode: 10.2.1/10E1001 - /usr/bin/xcodebuild
    npmPackages:
      react: 16.8.3 => 16.8.3
      react-native: 0.59.9 => 0.59.9
    npmGlobalPackages:
      create-react-native-app: 1.0.0
      react-native-cli: 2.0.1

iOS 'React/RCTBridgeModule.h' file not found

Description

Followed steps https://github.com/matejkriz/react-native-today-widget#manual-linking and stuck in build

/node_modules/react-native-today-widget/ios/TodayWidgetExtension/Linking.h:9:9: 'React/RCTBridgeModule.h' file not found

/node_modules/react-native-today-widget/ios/TodayWidgetExtension/DisplayMode.h:9:9: 'React/RCTBridgeModule.h' file not found

Any solution about it?

System configuration

react: 16.9.0
react-native: 0.61.5
react-native-today-widget: 1.0.0

XCode crash when trying to open project after linking

From crash report:
ASSERTION FAILURE in /Library/Caches/com.apple.xbs/Sources/IDEXcode3ProjectSupport/IDEXcode3ProjectSupport-12122/Xcode3Core/LegacyProjects/Frameworks/DevToolsCore/DevToolsCore/ProjectModel/DataModel/Containers/PBXContainerItemProxy.m:260
Details: Tried to access the containerPortal of an orphaned container item proxy (Global ID='57DB434C1ED1A1E3002AE0EB', Remote Info='(null)'). A common cause of this is corrupt project files which illegally reuse the same target dependency instance for multiple targets.
Object: <PBXContainerItemProxy: 0x7fa955b29af0>
Method: -_containerPortal
Thread: <NSThread: 0x7fa94d417590>{number = 1, name = main}

Enable to config Display Name and Bundle ID

The goal is to make Display Name (CFBundleName) and Bundle ID (CFBundleIdentifier) configurable.

Currently, the Bundle ID is set by the main app with .TodayWidgetExtension suffix using postinstall script. Display name has to be set using XCode manually.

Where is the best place for this configuration? For me, it looks like app.json file will be fine. Or split it to something like widget.json?

Android version

Create Today widget with Cocoapods

Hi,

For those who have some issues to create a Today Widget and link it to use React Native in the widget, here is the missing parts.

1. Follow up this wonderful Medium article => https://medium.com/@davidskaarup/add-ios-today-widget-to-your-react-native-app-ed9c9b601cc
2. In step 4. Add New Run Script Phase, replace the script with the updated path for react 0.58

export NODE_BINARY=node
../node_modules/react-native/scripts/react-native-xcode.sh

3. Edit your Podfile to get something like this :

target 'MainApp' do
 ... pods with React...

  target 'TodayWidget' do
    inherit! :search_paths
  end
end

Tada!

Enable to provide more than one today widget.

The main app on iOS could have multiple widgets available.

Build Error: library not found for -lRCTAnimation

It can be reproduced.

react-native: 0.59.3
xcode: 10.2

Basic Example Displays "Unable to Load" every 1/4 times it's displayed

Description

Swiping between widgets and the desktop I find that every 1/4 times the widget displays "Unable to load"

Steps to reproduce

Wait on home screen 3-4 seconds and swipe to widget screen, repeat several times

System configuration

Please add result of react-native info command and react-native-today-widget version used

react-native-today-widget 1.0.0

Environment:
  OS: macOS High Sierra 10.13.4
  Node: 9.8.0
  Yarn: 1.3.2
  npm: 5.6.0
  Watchman: 4.9.0
  Xcode: Xcode 9.4.1 Build version 9F2000
  Android Studio: 2.3 AI-162.4069837

Packages: (wanted => installed)
  react: 16.3.1 => 16.3.1
  react-native: 0.55.4 => 0.55.4

This is a real shame at the moment as when this does work it's awesome, seriously great work making this library!

Edit: I can only replicate this on an actual device, it always works on the simulator.

Some information

@matejkriz : Hi, congratulations on your project.
Your example works only on Ios, right?

We have developed a listview widget for android, where every row of the listview is clickable and takes a certain action.

We wanted to know in terms of performance, do you have problems, slowdowns or anything else?

Instalation error: Could not write domain /../ios/TodayWidgetExtension/Info.plist;

Hello;

I'm trying to install the react-native-today-widget in version 0.6.4 because of the react-native version of my project (0.44.3), I'm having this problem when I try to install the package:

yarn add [email protected]
yarn add v0.24.5
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 📃  Building fresh packages...
[1/1] ⡀ react-native-today-widget: setting ".TodayWidgetExtension" as CFBundleIdentifier for
/../ios/TodayWidgetEx
[-/1] ⡀ waiting...
[-/1] ⡀ waiting...
[-/1] ⡀ waiting...
error /Users/algartelecom/Documents/Josiane/testTodayWidget/node_modules/react-native-today-widget: Command failed.
Exit code: 1
Command: sh
Arguments: -c ./bin/setBundleId.sh
Directory: /Users/algartelecom/Documents/Josiane/testTodayWidget/node_modules/react-native-today-widget
Output:
./bin/setBundleId.sh: line 3: realpath: command not found
usage: dirname path
sed: 1: "s/^\s*"name": "(.*?)",$ ...": RE error: repetition-operator operand invalid
Reading CFBundleIdentifier from: /../../../ios//Info.plist
2018-01-08 16:46:09.080 defaults[13479:375454]
The domain/default pair of (/../../../ios//Info.plist, CFBundleIdentifier) does not exist
setting ".TodayWidgetExtension" as CFBundleIdentifier for  /../ios/TodayWidgetExtension/Info.plist
2018-01-08 16:46:09.219 defaults[13489:375499] Could not write domain /../ios/TodayWidgetExtension/Info.plist; exiting
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.

Assuming I can not update the version of my project, what can I do to fix this?

Project Version: react-native 0.44.3
Version of react-native-today-widget: 0.6.4

Thanks!

Cannot get basic example to display widget

Description

Please describe expected and actual behavior.
Following steps from example app.

Steps to reproduce

System configuration

Please add result of react-native info command and react-native-today-widget version used
latest rn version and used npm install from master branch.

Implement conditional displaying of the widget.

https://developer.apple.com/documentation/notificationcenter/ncwidgetcontroller/1456693-sethascontent

Extract DevMenu to separate library

A JavaScript implementation of Developer Menu could be useful in other projects (especially in other iOS App Extensions) where the native menu is not available.

pass data example

Description

Would be cool to get a example on passing data from the app to widget.

Provide declarative API for expandable widgets

Issue opening app by clicking widget Component

Description

I have implemented this widget by following this example Building a React-Native Today Widget in iOS
I want to link a view to component in widget(icon) etc. When click that item it should open app and goto that screen.
But I don't know how to do it.
This code is working fine and showing images in widget except of opening app.

This is the code of my index.widget.js file

import React from 'react'
import {AppRegistry, Platform, Text, View, Image, TouchableOpacity, Linking} from 'react-native'
openMe = async (pm) => {
    console.warn(pm)
    Linking.openURL('appName://Camera/0')
}
const TodayWidget = () => (
<View style={{ flex: 1, flexDirection:'row', justifyContent: 'center',alignItems:'center'}}>
    <View style={{flex:1, justifyContent:'center',alignItems:'center'}}>
        <TouchableOpacity  onPress={() => this.openMe('first')}>
            <Image source={require('./app/Images/camera.png')} resizeMode='contain' style={{width:50,height:50}} />
        </TouchableOpacity>
    </View>

    <View style={{flex:1, justifyContent:'center',alignItems:'center'}}>
        <TouchableOpacity  onPress={() => this.openMe('second')}>
            <Image source={require('./app/Images/camera.png')} resizeMode='contain' style={{width:50,height:50}}/>
        </TouchableOpacity>
    </View>
</View>
)
if (Platform.OS === 'ios') {
AppRegistry.registerComponent('AITodayWidget', () => TodayWidget)
}

Steps to reproduce

Please follow this example Building a React-Native Today Widget in iOS

System configuration

OS: macOS High Sierra 10.13.6
Node: 9.6.1
Yarn: 0.15.1
npm: 6.4.1
Watchman: 4.9.0
Xcode: Xcode 10.0 Build version 10A255
Android Studio: 3.1 AI-173.4907809

Packages: (wanted => installed)
react: 16.2.0 => 16.2.0
react-native: ^0.52.0 => 0.52.3

Unable to use widget on iOS device

Description

I followed instruction and built project successfully. I also checked the 3D touch on my device, it worked well, i added it to the widgets on real device but it was "Unable to load" even it was just a widget with Hello React Native text view

Steps to reproduce

1. React-native install react-native-today-widget.
2. Delete all the libRCT... and then add them again with the JavaScriptCore.framework also ( if i don't do this, it'll raise errors that Xcode can't find all the libRCT... libraries)
3. Change the bundle identifier of TodayWidgetExtension to org.reactjs.native.example.MyProject.TodayWidgetExtension (if not it will raise error: Embedded binary's bundle identifier is not prefixed with the parent app's bundle identifier).
4. Open the project target -> build phases -> in the Embed App Extensions -> Checked the Copy only when installing (if not it'll raise an error : Failed to set plugin placeholders for org.react.native.example.MyProject

System configuration

When i run the react-native log-ios:
un 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.WebKit.WebContent) : Unknown key for Boolean: EnableTransactions
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.WebKit.WebContent) : Unknown key for Boolean: EnablePressuredExit
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.backboard.display.archive) : Unknown key for Boolean: EnableTransactions
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.backboard.display.archive) : Unknown key for Boolean: EnablePressuredExit
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.imfoundation.IMRemoteURLConnectionAgent) : Unknown key for Boolean: EnableTransactions
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.imfoundation.IMRemoteURLConnectionAgent) : Unknown key for integer: _DirtyJetsamMemoryLimit
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.imfoundation.IMRemoteURLConnectionAgent) : Unknown key for Boolean: EnablePressuredExit
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.uifoundation-bundle-helper) : Unknown key for Boolean: EnableTransactions
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (com.apple.uifoundation-bundle-helper) : Unknown key for Boolean: EnablePressuredExit
Jun 25 15:20:47 thanhtans-MacBook-Pro com.apple.CoreSimulator.SimDevice.A03980F8-1C89-418A-BCAB-361E840F6EDB[87375] (org.reactjs.native.example.BaseControlls.TodayWidgetExtension[87486]) : assertion failed: 18F132: launchd_sim + 63721 [4911879E-54AD-341A-9EEA-BD6E6DDD9DD6]: 0x16

Showcase

Is there a showcase of any apps using this? Wondering whether it's worth trying to struggle with the memory limitation to make this work with RN

How to share data between main App and widget?

Hello!

I'm trying to share data as you do in "Complex example". But with https://github.com/kevinresol/react-native-default-preference

Have you been able to use UserDefaults to share data?

Description

In main app:

await DefaultPreference.setName("NAME_OF_YOUR_GROUP")
await DefaultPreference.set("key1", "value1")

In widget:

await DefaultPreference.setName("NAME_OF_YOUR_GROUP")
const k = await DefaultPreference.get("key1")

k is undefined. Should be value1

Unable to install with yarn: Could not write domain

$ yarn add react-native-today-widget
yarn add v0.24.5
[1/5] 🔍  Resolving packages...
[2/5] 🚚  Fetching packages...
[3/5] 🔗  Linking dependencies...
[4/5] 📃  Building fresh packages...
[-/8] ⠈ waiting...
[-/8] ⠈ waiting...
[8/8] ⠈ react-native-today-widget: setting ".TodayWidgetExtension" as CFBundleIdentifier for  /../ios/TodayW
[-/8] ⠈ waiting...
error /Users/jcursi/Sites/joncursi/redbirdNative/node_modules/react-native-today-widget: Command failed.
Exit code: 1
Command: sh
Arguments: -c ./bin/setBundleId.sh
Directory: /Users/jcursi/Sites/joncursi/redbirdNative/node_modules/react-native-today-widget
Output:
./bin/setBundleId.sh: line 3: realpath: command not found
usage: dirname path
sed: 1: "s/^\s*"name": "(.*?)",$ ...": RE error: repetition-operator operand invalid
Reading CFBundleIdentifier from: /../../../ios//Info.plist
2017-07-10 16:34:36.024 defaults[29636:174124] 
The domain/default pair of (/../../../ios//Info.plist, CFBundleIdentifier) does not exist
setting ".TodayWidgetExtension" as CFBundleIdentifier for  /../ios/TodayWidgetExtension/Info.plist
2017-07-10 16:34:36.184 defaults[29645:174193] Could not write domain /../ios/TodayWidgetExtension/Info.plist; exiting
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.

update to v1.0.0, still unable to load, any good idea for me

Description

Please describe expected and actual behavior.
today widget unable to load

Steps to reproduce

System configuration

Please add result of react-native info command and react-native-today-widget version used
v1.0.0

Unable to Load

I am trying to render a verrrry simple today widget but all I get is "Unable to Load". The code uses one View and one Text, and I am running on a simulator in release mode:

const TodayWidget = () => (
  <View>

    <Text>
      Hello Today Widget!
    </Text>

  </View>
);