resulturan / refine-firebase

MIT License
43 stars 22 forks source link

i can't use this firebase dataprovider with refine #5

Closed pinale closed 1 year ago

pinale commented 1 year ago

Refine version: "@pankod/refine-core": "^3.18.0"

my firebase.ts

import { 
    initializeFirebase,
    FirebaseAuth,
    FirebaseDatabase,
    FirestoreDatabase,    
} from 'refine-firebase/lib';

const firebaseConfig = {
  apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
  authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.REACT_APP_FIREBASE_DATABASE_URL,
  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
  storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_FIREBASE_SENDER_ID,
  appId: process.env.REACT_APP_FIREBASE_APP_ID 
}

export const firebaseApp = initializeFirebase(firebaseConfig);

export const firebaseAuth = new FirebaseAuth();
export const firestoreDatabase = new FirestoreDatabase();
export const firebaseDatabase = new FirebaseDatabase();

my App.tsx

import { firestoreDatabase } from "./firebase";
<Refine
          ...
          dataProvider={firestoreDatabase.getDataProvider()}
resulturan commented 1 year ago

can you give more details about your issue?

pinale commented 1 year ago

i've some types mistmatch by typescript level

import { firestoreDatabase } from "./firebase";
 <Refine
        ...
        dataProvider={firestoreDatabase}

Type 'FirestoreDatabase' is not assignable to type 'IDataContextProvider | IDataMultipleContextProvider'.\n Property 'default' is missing in type 'FirestoreDatabase' but required in type 'IDataMultipleContextProvider

or

import { firestoreDatabase } from "./firebase";
 <Refine
        ...
        dataProvider={firestoreDatabase.getDataProvider()}

Type 'IDataContextProvider' is not assignable to type 'IDataContextProvider | IDataMultipleContextProvider'.\n Property 'default' is missing in type 'IDataContextProvider' but required in type 'IDataMultipleContextProvider

my firebase.js file:

import { 
    initializeFirebase,
    FirebaseAuth,
    FirebaseDatabase,
    FirestoreDatabase,    
} from 'refine-firebase/lib';   //<----lib?????

const firebaseConfig = {
  apiKey: process.env.REACT_APP_FIREBASE_API_KEY,
  authDomain: process.env.REACT_APP_FIREBASE_AUTH_DOMAIN,
  databaseURL: process.env.REACT_APP_FIREBASE_DATABASE_URL,
  projectId: process.env.REACT_APP_FIREBASE_PROJECT_ID,
  storageBucket: process.env.REACT_APP_FIREBASE_STORAGE_BUCKET,
  messagingSenderId: process.env.REACT_APP_FIREBASE_SENDER_ID,
  appId: process.env.REACT_APP_FIREBASE_APP_ID 
}

export const firebaseApp = initializeFirebase(firebaseConfig);

export const firebaseAuth = new FirebaseAuth();
export const firestoreDatabase = new FirestoreDatabase();
export const firebaseDatabase = new FirebaseDatabase();

i've a live example on this repo: https://github.com/pinale/Refine/tree/master/refinefirebase

resulturan commented 1 year ago

the problem is about @Refine's type definitions I think. It supports multi dataProvider now and default field is required in the IDataMultipleContextProvider interface.

You can try this as a workaround. But Refine team may comment about the issue I think dataProvider={firestoreDatabase.getDataProvider() as any}

resulturan commented 1 year ago

This problem is solved in v1.1.1