Encountering a type error while trying to create a document within a nested collection in Firebase Firestore

While trying to submit the form with property data, I encountered an error message:

FirebaseError: Expected type 'za', but it was: a custom Ha object
. There doesn't seem to be any information available online explaining what a Ha object is or what type 'za' refers to. I suspect it has something to do with how I am accessing the nested collection, despite attempting different methods without success. Below is my code along with variable data types:

const submitProperty = async () => {
  setLoading(true);
  const ref = collection(db, "users", user.uid, "properties");
  await setDoc(ref, {
    propertyName: propertyName, //string
    address: address, //string
    city: city, //string
    zipcode: zipcode, //string
    mortgage: mortgage, //number
    rentalIncome: rentalIncome, //number
    vacancy: vacancy, //bool
    propertyTax: propertyTax, //number
  });
  setLoading(false);
};

I have attempted changing data types and adjusting the way I access the collection and create the document, but unfortunately, the error response remains consistent.

Answer №1

Your ref is pointing to a collection, making it invalid to invoke setDoc on it.

If your intention is to insert a document into the collection, consider using addDoc instead of setDoc.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Error message: React Native encountered a prop type failure when an invalid prop of type array was passed to the Overlay component

I am brand new to React Native and encountering an error message when opening a specific component. Although it doesn't hinder navigation, I would like to resolve this issue. I suspect it could be related to a syntax or typo error, but pinpointing the ...

Encountered a JavaScript error while using Internet Explorer

My web and Jquery plugins are working flawlessly on various browsers such as Firefox, Chrome, Safari (Windows & OSX), and Android. However, they encounter issues with Windows and Internet Explorer as some JavaScript fails to load. It's frustrating tha ...

Updating ES6 syntax for superset in array: a step-by-step guide

I am currently working with ES6 React code that generates an array of MiniIcons on a webpage. const MiniIcons = ({miniicons}) => ( <div id="application"> {miniicons.map(miniicon => ( <MiniIcon key={miniicon.id} id={miniicon.id} ...

Employing an unchanging Map format for observation

I'm currently working on implementing a synchronization mechanism using observable and Map structures from Immutable.js. However, I'm encountering an issue where the Map is unable to function as an observable or perhaps I might be approaching it ...

Personalize the file button for uploading images

I have a button to upload image files and I want to customize it to allow for uploading more than one image file. What is the logic to achieve this? <input type="file" />, which renders a choose button with text that says `no files chosen` in the sa ...

Tips on capturing the response data in UI testing automation

Currently, I am working on automating a login page using WebDriverIO for UI Automation. After clicking the Login button, a request to *.com/user/login is triggered in the background. I need to capture this call's response in order to obtain a token r ...

Jest came across a surprising token that it wasn't expecting while working with React and TypeScript in conjunction with Jest and React-testing-L

An unexpected token was encountered by Jest while using React and TypeScript along with Jest and React-testing-Library. Error occurred at: E:\Git\node_modules@mui\x-date-pickers\internals\demo\index.js:1 ({"Object." ...

Angular Leaflet area selection feature

Having an issue with the leaflet-area-select plugin in my Angular9 project. Whenever I try to call this.map.selectArea, VSCode gives me an error saying that property 'selectArea' does not exist on type 'Map'. How can I resolve this? I& ...

Transforming javascript's array.map into php's array_map function

The following code snippet is written in JavaScript and consists of a hashmap array with keys and values. I have created a function using map that returns the values of the entered keys. var rule = { "c": "d", "a": "o", "t": "g", "h": "a", "e": "n", "n": ...

Generate dynamic routes in Next.js only when needed

I'm currently working on a project using NextJS to create a frontend for a database that contains thousands of products, with the expectation of significant growth. The site/products/ route is functioning well, but I wanted to add a route to view indi ...

AngularJS: default option not being selected in dropdown menus

I need assistance with a dropdown list issue. See the code snippet below: My Controller (function(angular) { 'use strict'; angular.module('ngrepeatSelect', []) .controller('ExampleController', ['$scope', functi ...

Exploring techniques to query a Mongoose/Express array generated from a select multiple option

I am currently working on a search form that utilizes the select multiple attribute. Below is the code snippet for the form. <form action="/search" method="get"> <select name="q" multiple> <optgroup label="Fruit"> <option ...

"Encountering problems with location search function on Instagram API for retrieving posts

I've been working on integrating two APIs – Instagram and Google Maps. While I've managed to get everything functioning smoothly, there's an issue with displaying "up to 20 pictures" around a specific location. I'm unsure why this in ...

Choose between using a function as a parameter or an instruction when making a selection based on change

I am curious about the distinction between the following two sentences: $('#select').on('change', function() { Manager.doRequest(); }).trigger('change'); And these variations: $('#select').on('change&apos ...

The onKeyUp event is not functioning as expected in React, unlike the onChange event

For a React coding challenge, I am required to update a value onKeyUp instead of onChange. However, after changing it to onKeyUp, my fields are not updating and I cannot type anything into the textarea. class MarkdownApp extends React.Component { constr ...

Upgrading to React Router v6: Implementing Loader Functions with Context API

Having issues implementing loaders in React-Router V6 while making a request for a page through a function located in the context file. Unfortunately, I can't access the context from main.js where the router is defined. Main.js import ReactDOM from & ...

The desktop display is experiencing a technical issue where menus are failing to appear

When my website is opened on desktop, the state remains false which causes no menus to show. I only want this functionality to be active on mobile devices. const Navbar = () => { const [isMenuOpen, setIsMenuOpen] = useState(false); const toggle = () ...

Can Capacitor be integrated with the latest NextJS 13's "/app" architecture?

I'm experiencing challenges with implementing Capacitor in my NextJS 13 project that utilizes the new App router. Is there a way to generate an "out" folder and an "index.html" file when building the application while following the new "/app" structu ...

Retrieving JSON information from asynchronous JavaScript and XML (AJAX)

I am struggling with making a URL that contains JSON Data work properly. The issue lies in the data field - I am unsure of what to input here as it is currently undefined. My goal is to store an array of the JSON data received from the ajax request. What ...

Issue with JavaScript-generated dropdown menu malfunctioning in WebView on Android devices

During my testing of the app on a Galaxy Tab with Android 2.2, I encountered an issue within the WebView component. The problem arises when I have a local HTML page generated dynamically and it contains a SELECT element like this: <select class='d ...