Firebase does not save empty array

Question

Hello I have a question I am making app with Firebase and React. The problem is that I want to have comment array but it is empty when the item is created. How can I solve this problem and have an empty array and then update this array after adding comments.

There is a lot of code.

 const onSubmitHandler = (e: React.FormEvent): void => {
        e.preventDefault();
        if (user?.displayName) {
          const recipe: Recipe = {
            username: user.displayName,
            title: title,
            type: type,
            description: description,
            id: Math.random(),
            time: time,
            ingredients: ingredients,
            stars: Math.floor(Math.random() * 6) + 1,
            steps: steps,
            comments: [],
          };
          dispatch(recipeAction.addRecipe(recipe));
          dispatch(sendData(recipe));
          navigate("/");
        }
      };
Redux action 

export const fetchRecipes = () => {
  return async (dispatch: ThunkDispatch<{}, {}, AnyAction>) => {
    dispatch(uiAction.isLoading(true));
    const getRecipes = async () => {
      const response = await fetch(
        *FIREBASE API*
      );
      const data = response.json();
      return data;
    };

    try {
      const data = await getRecipes();
      console.log(data);
      if (data) {
        for (const key of Object.keys(data)) {
          dispatch(recipeAction.replaceRecipes(data[key]));
        }... other not needed code.
Redux slice 

replaceRecipes(state, action: PayloadAction<Recipe>) {
      const fetchedRecipe = action.payload;

      state.recipes.push(fetchedRecipe);
    },

halfer · Accepted Answer · 2022-06-11 10:20:09Z

1

Why won't it save an empty array?

I don't have so much knowledge so I am just explaining it in Java.

When you create a new empty array like this:

List array = new ArrayList<>();

its size is 0. And, 0 can in other words be said null for an empty array. Now, Firebase ignores null or 0 sized array as it had nothing to display in the console.

Then what should I do?

It is not a hard thing to do that. Now, in your case, because there is no such key in the database, it will give null and then you try using it you'll get an exception. This is what every developer wants to prevent. So the solution can be to store a boolean in the database with the other keys to check if a data has the array or not. When the post is just created, there are no comments. You can set it to false. Now, when a user adds a comment, set it to true.

Now when fetching the comments, first check if the boolean is true or not. If true, fetch the comments. Or else just ignore.

Code?

As mentioned, I have not used React.JS so much so can't provide the code. But I hope that you will be able to do it as you have already done so much of it by yourself.

edited Jun 11, 2022 at 10:20

halfer

20.2k20 gold badges110 silver badges207 bronze badges

answered Mar 31, 2022 at 16:27

Sambhav Khandelwal

3,7732 gold badges11 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Kay Over a year ago

Thanks I understand what you mean. I will do it on my own. :)

Collectives™ on Stack Overflow

Firebase does not save empty array

1 Answer 1

Why won't it save an empty array?

Then what should I do?

Code?

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Why won't it save an empty array?

Then what should I do?

Code?

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related