FirebaseError: Missing or insufficient permissions with react js

Question

firebase permission denied with these rules: This rule allows anyone on the internet to view, edit, and delete all data in your Firestore database. It is useful for getting started, but it is configured to expire after 30 days because it leaves your app open to attackers. At that time, all client requests to your Firestore database will be denied. Make sure to write security rules for your app before that time, or else your app will lose access to your Firestore database

rules_version = '2';
 service cloud.firestore { 
    match /databases/{database}/documents {

    match /{document=**} {
      allow read, write: if false;
        }
      }
   } 

screen shot of browser console

output of the redux state in h3 tag

code of reducer:

import { GET_ALL_SCREAM, LOADING } from "../types";
import { db } from "../../firebase/config";
const initialState = {
  data: [],
  loading: false,
  error: {},
};
export default function (state = initialState, action) {
  switch (action.type) {
    case GET_ALL_SCREAM:
      db.collection("screams")
        .get()
        .then((data) => {
          let screams = [];
          data.forEach((doc) => {
            screams.push({
              id: doc.id,
              ...doc.data(),
            });
          });
          return { ...state, loading: false, date: screams };
        })
        .catch((err) => {
          console.error(err);
          return { ...state, loading: false, error: { ...err.response } };
        });
        console.log("error is in somewhere");
        return { ...state, loading: false, error: { "error": "something went wrong" } };
    case LOADING:
      return { ...state, loading: true };
    default:
      return state;
  }
}

Answer 1

Makes the changes in your database rules like the following one.

service cloud.firestore {
  match /databases/{database}/documents {
    match /{document=**} {
      allow read, write;
    }
  }
}

Answer 2

The if false in your rules mean that nobody can read that data, which is why the read from your app gets rejected.

If you want to allow that read, you'll have to model security rules to reflect that. The simplest way is to simply do if true, but that means everyone in the world can read and modify all of your data at will. This may be fine during development, but becomes dangerous as you add more users to your app.

The proper solution is to read the Firebase documentation on securing access to your data and implement rules that reflect exactly what is relevant to your use-case.