Error: [withObservable] Value passed to withObservables doesn't appear to be observable. See console for details

[arun-saleth]

component:

import React from 'react'
import { withObservables } from '@nozbe/watermelondb/react'

import { StyleSheet, Text, View } from 'react-native'

async function Postcomp({post}) {
// console.log(post,'pors')
console.log(post,'post')
return (
<>
<View style={{flexDirection:'row'}}>
id
title
subtitle
body
is_pinner

  <View style={{flexDirection:'row'}}>
      <Text style={styles.cell}>id</Text>
      <Text style={styles.cell}>title</Text>
      <Text style={styles.cell}>subtitle</Text>
      <Text style={styles.cell}>body</Text>
      <Text style={styles.cell}>is_pinner</Text>
  </View>
 </>

)
}

const styles =StyleSheet.create({
cell:{
borderWidth:0.5,
borderColor:'gray',
padding:10
}
})
const enhance = withObservables(['post'], ({ post }) => ({
post
}))
export default enhance(Postcomp)

Modal

import { Model } from '@nozbe/watermelondb'
import { field, text } from '@nozbe/watermelondb/decorators'
// import { database } from '../config'

export default class Post extends Model {
static table = 'posts'
static associations = {
comments: { type: 'has_many', foreignKey: 'post_id' },
}

@text('title') title
@text('body') body
@field('is_pinned') isPinned

}

App.js

import React, { useEffect } from 'react';
import {
SafeAreaView,
StatusBar,
StyleSheet,
Text,
TouchableOpacity,
} from 'react-native';
import Postcomp from './components/Postcomp';
import { database } from './db/config';

function App() {
const addNewPost = async() =>{
await database.write(async() => {
await database.get('posts').create(post => {
post.title = 'New post'
post.body = 'Lorem ipsum...'
})
})
}

const postsCollection = database.get('posts')

return (


Add


);
}

export default App

[rahulreddyRR]

the component is not async and if you want to access that withObservables use it in this way :
const enhance = withObservables([], () => ({ post: postsCollection.query() }))