Getting a really vague error message when trying to load a screen in my react native app. I'm assuming that the %s was supposed to evaluate to some function name but it is not providing me any info at all.
The error message:
Warning: %s(...) is deprecated in plain JavaScript React classes. %sat node_modules\react-native\Libraries\LogBox\LogBox.js:117:10 in registerWarningat node_modules\react-native\Libraries\LogBox\LogBox.js:63:8 in warnImplat node_modules\react-native\Libraries\LogBox\LogBox.js:36:4 in console.warnat node_modules\expo\build\environment\react-native-logs.fx.js:18:4 in warnat App.tsx:24:4 in console.warnat node_modules\@sentry\utils\dist\instrument.js:110:42 in <anonymous>at node_modules\react\cjs\react.development.js:315:4 in printWarningat node_modules\react\cjs\react.development.js:278:16 in warnat node_modules\react\cjs\react.development.js:508:12 in Object.defineProperty$argument_2.getat screens\ContactEditScreen.tsx:229:10 in renderat node_modules\regenerator-runtime\runtime.js:63:36 in tryCatchat node_modules\regenerator-runtime\runtime.js:293:29 in invokeat node_modules\regenerator-runtime\runtime.js:63:36 in tryCatchat node_modules\regenerator-runtime\runtime.js:154:27 in invokeat node_modules\regenerator-runtime\runtime.js:164:18 in PromiseImpl.resolve.then$argument_0at node_modules\react-native\node_modules\promise\setimmediate\core.js:37:13 in tryCallOneat node_modules\react-native\node_modules\promise\setimmediate\core.js:123:24 in setImmediate$argument_0at node_modules\react-native\Libraries\Core\Timers\JSTimers.js:130:14 in _callTimerat node_modules\react-native\Libraries\Core\Timers\JSTimers.js:181:14 in _callImmediatesPassat node_modules\react-native\Libraries\Core\Timers\JSTimers.js:441:30 in callImmediatesat node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:387:6 in __callImmediatesat node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:135:6 in __guard$argument_0at node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:364:10 in __guardat node_modules\react-native\Libraries\BatchedBridge\MessageQueue.js:134:4 in flushedQueueat [native code]:null in flushedQueueat [native code]:null in callFunctionReturnFlushedQueue
The screen causing it:
import React from 'react';import { ScreenProps, ScrollView } from 'react-navigation';import { ListItem, Icon } from 'react-native-elements';import { View, ActivityIndicator, Alert, StyleSheet, TouchableHighlight, StatusBar,} from 'react-native';import { SwipeListView, SwipeRow } from 'react-native-swipe-list-view';import * as Amplitude from 'expo-analytics-amplitude';import '@firebase/firestore';import firebase from 'firebase';import { Platform } from '@unimodules/core';import { AmplitudeEvents } from '../util/PricingApi';import MessageText from '../components/MessageText';import FloatingActionButton from '../components/FloatingActionButton';import Layout from '../constants/Layout';export default class NotesScreen extends React.Component<ScreenProps> { static navigationOptions = ({ navigation }: any) => ({ title: `Notes: ${navigation.getParam('custNo')}`, headerStyle: { marginTop: StatusBar.currentHeight }, }); isMounted = false; state = { notes: [] as firebase.firestore.QueryDocumentSnapshot[], isError: false, isLoading: true, }; myScrollView?: ScrollView | null; async componentDidMount() { this.isMounted = true; const { navigation } = this.props; const custNo = navigation.getParam('custNo'); await this.fetchNotes(custNo); navigation.addListener('willFocus', () => this.fetchNotes(custNo)); this.setState({ isLoading: false }); Amplitude.logEventAsync(AmplitudeEvents.NOTES_VIEW); } componentWillUnmount() { this.isMounted = false; } fetchNotes = async (custNo: string) => { try { const notes = await firebase.firestore().collection(`customers/${custNo}/notes`).get(); if (this.isMounted) { this.setState({ notes: notes.docs, }); } } catch (error) { this.setState({ isError: true, }); } } addNote = async () => { const { navigation } = this.props; const custNo = navigation.getParam('custNo'); try { const doc = await firebase.firestore().collection(`customers/${custNo}/notes`).add({ content: '', editted: firebase.firestore.Timestamp.now(), created: firebase.firestore.Timestamp.now(), }); navigation.navigate('NoteDetails', { note: await doc.get() }); } catch (error) { Alert.alert('Note Creation Failed', 'Check your internet connection'); } } deleteNote = async (note: firebase.firestore.QueryDocumentSnapshot) => { const { notes } = this.state; notes.splice(notes.indexOf(note), 1); try { await note.ref.delete(); if (this.isMounted) this.setState({ notes }); } catch (error) { Alert.alert('Note Deletion Failed', 'Check your internet connection'); } } render() { const { isLoading, isError, notes } = this.state; if (isLoading) { return (<ActivityIndicator color="#1D81FA" style={{ alignItems: 'center', justifyContent: 'center', flexGrow: 1 }} /> ); } if (isError) { return (<View><MessageText messageType="warning"> No notes</MessageText></View> ); } return (<View style={{ flex: 1, height: 300 }}><SwipeListView useFlatList data={notes.sort((a, b) => (b.get('editted') as firebase.firestore.Timestamp).toMillis() - (a.get('editted') as firebase.firestore.Timestamp).toMillis())} extraData={this.state.notes} renderItem={(data: any) => (<SwipeRow disableRightSwipe rightOpenValue={-75}><View style={styles.rowBack}><TouchableHighlight onPress={() => this.deleteNote(data.item)} style={styles.backRightBtn} underlayColor="#AAA"><View><Icon name={Platform.OS === 'ios' ? 'ios-trash' : 'md-trash'} type="ionicon" color="#FFF" /></View></TouchableHighlight></View><ListItem title={data.item.get('content')} subtitle={(data.item.get('editted') as firebase.firestore.Timestamp).toDate().toLocaleDateString()} onPress={() => this.props.navigation.navigate('NoteDetails', { note: data.item })} titleProps={{ numberOfLines: 2 }} bottomDivider chevron /></SwipeRow> )} /><FloatingActionButton name="add" color="#517fa4" onPress={this.addNote} /></View> ); }}const styles = StyleSheet.create({ rowBack: { alignItems: 'center', backgroundColor: 'red', flex: 1, flexDirection: 'row', justifyContent: 'flex-end', }, backRightBtn: { width: 75, padding: 15, },});
The screen mentioned in the warning message is not the screen that is throwing the warning and the warning still happens even if that chunk of code in the other screen is commented out. I can't seem to make any progress on this so any help or tips would be appreciated.
Using expo SDK 41, by the way. Thanks.