Add support for Firebase 8.0.0

[hipdev]

If firebase gets updated to 8.0.0 app will stop working because TypeError: Cannot read property 'length' of undefined, and comes maybe from this file:
https://github.com/nandorojo/swr-firestore/blob/master/src/classes/Fuego.ts

Is also may be related to this one:
https://stackoverflow.com/questions/64545862/upgrade-to-firebase-js-8-0-0-attempted-import-error-app-is-not-exported-from

Thanks for a great package @nandorojo ;)

[nandorojo]

#58

[nandorojo]

For now, you can copy the contents of that file, make your own Fuego with the default import, and pass that to the FuegoProvider like normal.

[nandorojo]

Just do this in your app:

// fuego.ts
import firebase from 'firebase/app'

type Config = Parameters<typeof firebase.initializeApp>[0]

export class Fuego {
  public db: ReturnType<firebase.app.App['firestore']>
  public auth: typeof firebase.auth
  public functions: typeof firebase.functions
  public storage: typeof firebase.storage
  constructor(config: Config) {
    this.db = !firebase.apps.length
      ? firebase.initializeApp(config).firestore()
      : firebase.app().firestore()
    this.auth = firebase.auth
    this.functions = firebase.functions
    this.storage = firebase.storage
  }
}

Then wherever you use it:

- import { Fuego } from '@nandorojo/swr-firestore'
+ import { Fuego } from './fuego'

const fuego = new Fuego(...)

<FuegoProvider fuego={fuego} />

[armouti]

hey @nandorojo just checking if there's any plans soon to add native support for firebase 8

[nandorojo]

Hey, I haven't upgraded myself quite yet, but I can upgrade this when I do. The solution above should work, though.

[armouti]

@nandorojo thank you for that. Unfortunately this solution seems to be breaking the types ?

[nandorojo]

You should still import lowercase fuego from this library directly in the rest of your app.

[armouti]

yes that is what I'm doing
import { fuego } from '@nandorojo/swr-firestore';

[nandorojo]

Hm, I see. What if you instead import your own fuego then?

[armouti]

yes you're right, that fuego instance seems to have the correct typings, thanks

[javiio]

JS version:

import firebase from 'firebase/app';

export default class Fuego {
  constructor(config) {
    this.db = !firebase.apps.length
      ? firebase.initializeApp(config).firestore()
      : firebase.app().firestore();
    this.auth = firebase.auth;
    this.functions = firebase.functions;
    this.storage = firebase.storage;
  }
}

Then
import Fuego from 'config/Fuego';

[andrewtsun25]

just wondering why can't you reference firebase.apps.length as such? this is a feature in TypeScript called optional chaining.

firebase?.apps.length

this would still compile in TypeScript and would not break for v7 nor v8 and would solve everyone's problems listed above with minimal effort (i.e. would not need to upgrade Firebase)

[nandorojo]

It’s not because it’s undefined. It’s because firebase 8 imports default, while v7 imports imports * as firebase

[andrewtsun25]

ahhhhh i see, so the firebase object is fundamentally different.