Skip to content

Commit 849cb62

Browse files
author
Alex Patterson
committed
update for firebase
1 parent 9a0382d commit 849cb62

File tree

4 files changed

+67
-70
lines changed

4 files changed

+67
-70
lines changed

lib/firebase.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -11,9 +11,9 @@ export default async function loadFirebase() {
1111
const firebase = await import("firebase/app");
1212
await import("firebase/firestore");
1313
try {
14-
if (!firebase.apps.length) {
15-
const app = firebase.initializeApp(firebaseConfig);
16-
firebase.firestore(app);
14+
if (!firebase.default.apps.length) {
15+
const app = firebase.default.initializeApp(firebaseConfig);
16+
firebase.default.firestore(app);
1717
}
1818
} catch (err) {
1919
// we skip the "already exists" message which is

next.config.js

Lines changed: 15 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -1,34 +1,33 @@
1-
const withBundleAnalyzer = require('@zeit/next-bundle-analyzer');
1+
const withBundleAnalyzer = require("@zeit/next-bundle-analyzer");
22

33
const nextConfig = {
4-
analyzeServer: ['server', 'both'].includes(process.env.BUNDLE_ANALYZE),
5-
analyzeBrowser: ['browser', 'both'].includes(process.env.BUNDLE_ANALYZE),
4+
analyzeServer: ["server", "both"].includes(process.env.BUNDLE_ANALYZE),
5+
analyzeBrowser: ["browser", "both"].includes(process.env.BUNDLE_ANALYZE),
66
bundleAnalyzerConfig: {
77
server: {
8-
analyzerMode: 'static',
9-
reportFilename: '../bundles/server.html'
8+
analyzerMode: "static",
9+
reportFilename: "../bundles/server.html",
1010
},
1111
browser: {
12-
analyzerMode: 'static',
13-
reportFilename: '../bundles/client.html'
14-
}
12+
analyzerMode: "static",
13+
reportFilename: "../bundles/client.html",
14+
},
1515
},
1616
webpack(config) {
1717
return config;
18-
}
18+
},
1919
};
2020

2121
const prodConfig = {
22-
API_ENDPOINT: 'https://us-central1-ajonp-ajs-books.cloudfunctions.net/api/'
22+
API_ENDPOINT: "https://us-central1-ajonp-ajs-books.cloudfunctions.net/api/",
2323
};
2424

2525
const devConfig = {
26-
API_ENDPOINT: 'http://localhost:5001/ajonp-ajs-books/us-central1/api/'
26+
API_ENDPOINT: "https://us-central1-ajonp-ajs-books.cloudfunctions.net/api/",
2727
};
2828

29-
module.exports =
30-
{
31-
target: 'serverless',
32-
env: process.env.NODE_ENV === 'production' ? prodConfig : devConfig
33-
},
29+
(module.exports = {
30+
target: "serverless",
31+
env: process.env.NODE_ENV === "production" ? prodConfig : devConfig,
32+
}),
3433
withBundleAnalyzer(nextConfig);

pages/book.tsx

Lines changed: 34 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
1-
import Grid from '@material-ui/core/Grid';
2-
import fetch from 'isomorphic-unfetch';
3-
import { NextRouter, withRouter } from 'next/router';
4-
import { Component } from 'react';
5-
import { docData } from 'rxfire/firestore';
6-
import { Subject } from 'rxjs';
7-
import { takeUntil } from 'rxjs/operators';
1+
import Grid from "@material-ui/core/Grid";
2+
import fetch from "isomorphic-unfetch";
3+
import { NextRouter, withRouter } from "next/router";
4+
import { Component } from "react";
5+
import { docData } from "rxfire/firestore";
6+
import { Subject } from "rxjs";
7+
import { takeUntil } from "rxjs/operators";
88

9-
import BookDetail from '../components/BookDetail';
10-
import BookPage from '../components/BookPage';
11-
import ChapterDetail from '../components/ChapterDetail';
12-
import loadFirebase from '../lib/firebase';
13-
import BookModel from '../models/BookModel';
14-
import ChapterModel from '../models/ChapterModel';
15-
import PageModel from '../models/PageModel';
9+
import BookDetail from "../components/BookDetail";
10+
import BookPage from "../components/BookPage";
11+
import ChapterDetail from "../components/ChapterDetail";
12+
import loadFirebase from "../lib/firebase";
13+
import BookModel from "../models/BookModel";
14+
import ChapterModel from "../models/ChapterModel";
15+
import PageModel from "../models/PageModel";
1616

1717
class book extends Component<
1818
{
@@ -33,7 +33,7 @@ class book extends Component<
3333
book: {},
3434
chapter: {},
3535
page: {},
36-
stopSubs: new Subject<boolean>()
36+
stopSubs: new Subject<boolean>(),
3737
};
3838

3939
static async getInitialProps({ req, query }: any) {
@@ -43,19 +43,19 @@ class book extends Component<
4343

4444
const retObj = {
4545
book: {
46-
id: id
46+
id: id,
4747
},
4848
chapter: {
49-
id: chapterId
49+
id: chapterId,
5050
},
5151
page: {
52-
id: pageId
53-
}
52+
id: pageId,
53+
},
5454
};
5555
if (req) {
5656
/* Just a note using Promise.all() would probably be faster */
5757
if (id) {
58-
console.log('Server Fetching Book', id);
58+
console.log("Server Fetching Book", id);
5959
const res = await fetch(
6060
/*
6161
API can be found in next.config.js
@@ -68,19 +68,17 @@ class book extends Component<
6868
retObj.book = json;
6969
}
7070
if (chapterId) {
71-
console.log('Server Fetching Chapter', chapterId);
71+
console.log("Server Fetching Chapter", chapterId);
7272
const res = await fetch(
7373
`${process.env.API_ENDPOINT}chapter?id=${id}&chapterId=${chapterId}`
7474
);
7575
const json = await res.json();
7676
retObj.chapter = json;
7777
}
7878
if (pageId) {
79-
console.log('Server Fetching Page', pageId);
79+
console.log("Server Fetching Page", pageId);
8080
const res = await fetch(
81-
`${
82-
process.env.API_ENDPOINT
83-
}page?id=${id}&chapterId=${chapterId}&pageId=${pageId}`
81+
`${process.env.API_ENDPOINT}page?id=${id}&chapterId=${chapterId}&pageId=${pageId}`
8482
);
8583
const json = await res.json();
8684
retObj.page = json;
@@ -94,7 +92,7 @@ class book extends Component<
9492
book: this.props.book,
9593
chapter: this.props.chapter,
9694
page: this.props.page,
97-
firebase: await loadFirebase()
95+
firebase: await loadFirebase(),
9896
});
9997

10098
/* After client loads */
@@ -129,37 +127,37 @@ class book extends Component<
129127
pageId: string | undefined
130128
) {
131129
if (bookId) {
132-
const booksRef = this.state.firebase
130+
const booksRef = this.state.firebase.default
133131
.firestore()
134-
.collection('books')
132+
.collection("books")
135133
.doc(bookId);
136134
// Book Detail
137-
docData(booksRef, 'id')
135+
docData(booksRef, "id")
138136
.pipe(takeUntil(this.state.stopSubs))
139-
.subscribe(book => {
137+
.subscribe((book) => {
140138
this.setState({ book });
141139
});
142140
}
143141
// Chapter Detail
144142
if (chapterId) {
145-
const chapterRef = this.state.firebase
143+
const chapterRef = this.state.firebase.default
146144
.firestore()
147145
.collection(`books/${bookId}/chapters`)
148146
.doc(chapterId);
149-
docData(chapterRef, 'id')
147+
docData(chapterRef, "id")
150148
.pipe(takeUntil(this.state.stopSubs))
151-
.subscribe(chapter => {
149+
.subscribe((chapter) => {
152150
this.setState({ chapter });
153151
});
154152

155153
if (pageId) {
156-
const pageRef = this.state.firebase
154+
const pageRef = this.state.firebase.default
157155
.firestore()
158156
.collection(`books/${bookId}/chapters/${chapterId}/pages`)
159157
.doc(pageId);
160-
docData(pageRef, 'id')
158+
docData(pageRef, "id")
161159
.pipe(takeUntil(this.state.stopSubs))
162-
.subscribe(page => {
160+
.subscribe((page) => {
163161
this.setState({ page });
164162
});
165163
} else {

pages/books.tsx

Lines changed: 15 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,14 @@
1-
import CircularProgress from '@material-ui/core/CircularProgress';
2-
import Grid from '@material-ui/core/Grid';
3-
import React, { Component } from 'react';
4-
import { collectionData } from 'rxfire/firestore';
5-
import { Subject } from 'rxjs';
6-
import fetch from 'isomorphic-unfetch';
7-
import { takeUntil } from 'rxjs/operators';
1+
import CircularProgress from "@material-ui/core/CircularProgress";
2+
import Grid from "@material-ui/core/Grid";
3+
import React, { Component } from "react";
4+
import { collectionData } from "rxfire/firestore";
5+
import { Subject } from "rxjs";
6+
import fetch from "isomorphic-unfetch";
7+
import { takeUntil } from "rxjs/operators";
88

9-
import BookCard from '../components/BookCard';
10-
import loadFirebase from '../lib/firebase';
11-
import BookModel from '../models/BookModel';
9+
import BookCard from "../components/BookCard";
10+
import loadFirebase from "../lib/firebase";
11+
import BookModel from "../models/BookModel";
1212

1313
export default class books extends Component<
1414
{
@@ -22,7 +22,7 @@ export default class books extends Component<
2222
firebase?: any;
2323
} = {
2424
books: [],
25-
stopSubs: new Subject<boolean>()
25+
stopSubs: new Subject<boolean>(),
2626
};
2727
static async getInitialProps() {
2828
const res = await fetch(`${process.env.API_ENDPOINT}books`);
@@ -33,15 +33,15 @@ export default class books extends Component<
3333
/* Coming from SSR Initial Props */
3434
await this.setState(() => {
3535
return {
36-
books: this.props.books
36+
books: this.props.books,
3737
};
3838
});
3939
/* After client loads */
4040
const firebase = await loadFirebase();
41-
const booksRef = firebase.firestore().collection('books');
42-
collectionData(booksRef, 'bookId')
41+
const booksRef = firebase.default.firestore().collection("books");
42+
collectionData(booksRef, "bookId")
4343
.pipe(takeUntil(this.state.stopSubs))
44-
.subscribe(books => {
44+
.subscribe((books) => {
4545
this.setState({ books });
4646
});
4747
}

0 commit comments

Comments
 (0)