mirror/php-web-maker
1
0
Fork 0
mirror of https://github.com/chinchang/web-maker.git synced 2025-07-25 07:51:12 +02:00
Code Issues Releases Wiki Activity

update firebase to 10

Browse Source
This commit is contained in:
Kushagra Gour
2024-02-20 12:55:36 +05:30
parent 24cdf7ef7c
commit 2ea0090564
8 changed files with 3154 additions and 688 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3626
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

2
package.json
View File

@@ -75,7 +75,7 @@
"codemirror": "^5.37.0", "codemirror": "^5.37.0",
"copy-webpack-plugin": "^4.5.1", "copy-webpack-plugin": "^4.5.1",
"esprima": "^4.0.0", "esprima": "^4.0.0",
"firebase": "^8.10.0", "firebase": "^10.8.0",
"jszip": "^3.1.5", "jszip": "^3.1.5",
"preact": "^10.5.13", "preact": "^10.5.13",
"preact-portal": "^1.1.3", "preact-portal": "^1.1.3",

29
src/auth.js
View File

@@ -1,35 +1,40 @@
import { trackEvent } from './analytics'; import { trackEvent } from './analytics';
import firebase from 'firebase/app'; import { auth } from './firebaseInit';
import {
GithubAuthProvider,
TwitterAuthProvider,
GoogleAuthProvider,
signInWithPopup,
signOut
} from 'firebase/auth';
import { log } from './utils'; import { log } from './utils';
export const auth = { export const authh = {
logout() { logout() {
firebase.auth().signOut(); signOut();
}, },
login(providerName) { login(providerName) {
var provider; var provider;
if (providerName === 'facebook') { if (providerName === 'facebook') {
provider = new firebase.auth.FacebookAuthProvider(); provider = new FacebookAuthProvider();
} else if (providerName === 'twitter') { } else if (providerName === 'twitter') {
provider = new firebase.auth.TwitterAuthProvider(); provider = new TwitterAuthProvider();
} else if (providerName === 'google') { } else if (providerName === 'google') {
provider = new firebase.auth.GoogleAuthProvider(); provider = new GoogleAuthProvider();
provider.addScope('https://www.googleapis.com/auth/userinfo.profile'); provider.addScope('https://www.googleapis.com/auth/userinfo.profile');
} else { } else {
provider = new firebase.auth.GithubAuthProvider(); provider = new GithubAuthProvider();
} }
return firebase return signInWithPopup(auth, provider)
.auth() .then(function () {
.signInWithPopup(provider)
.then(function() {
trackEvent('fn', 'loggedIn', providerName); trackEvent('fn', 'loggedIn', providerName);
// Save to recommend next time // Save to recommend next time
window.db.local.set({ window.db.local.set({
lastAuthProvider: providerName lastAuthProvider: providerName
}); });
}) })
.catch(function(error) { .catch(function (error) {
log(error); log(error);
if (error.code === 'auth/account-exists-with-different-credential') { if (error.code === 'auth/account-exists-with-different-credential') {
alert( alert(

4
src/components/Login.jsx
View File

@@ -1,12 +1,12 @@
import { h, Component } from 'preact'; import { h, Component } from 'preact';
import { trackEvent } from '../analytics'; import { trackEvent } from '../analytics';
import { auth } from '../auth'; import { authh } from '../auth';
export default class Login extends Component { export default class Login extends Component {
login(e) { login(e) {
const provider = e.target.dataset.authProvider; const provider = e.target.dataset.authProvider;
trackEvent('ui', 'loginProviderClick', provider); trackEvent('ui', 'loginProviderClick', provider);
auth.login(provider); authh.login(provider);
} }
componentDidMount() { componentDidMount() {
window.db.local.get( window.db.local.get(

10
src/components/app.jsx
View File

@@ -41,10 +41,10 @@ import { modes, HtmlModes, CssModes, JsModes } from '../codeModes';
import { trackEvent } from '../analytics'; import { trackEvent } from '../analytics';
import { deferred } from '../deferred'; import { deferred } from '../deferred';
import { alertsService } from '../notifications'; import { alertsService } from '../notifications';
import firebase from 'firebase/app'; import { auth } from '../firebaseInit';
import 'firebase/auth'; import { onAuthStateChanged } from 'firebase/auth';
import { Profile } from './Profile'; import { Profile } from './Profile';
import { auth } from '../auth'; import { authh } from '../auth';
import { SupportDeveloperModal } from './SupportDeveloperModal'; import { SupportDeveloperModal } from './SupportDeveloperModal';
import { KeyboardShortcutsModal } from './KeyboardShortcutsModal'; import { KeyboardShortcutsModal } from './KeyboardShortcutsModal';
import { takeScreenshot } from '../takeScreenshot'; import { takeScreenshot } from '../takeScreenshot';
@@ -161,7 +161,7 @@ export default class App extends Component {
}; };
this.prefs = {}; this.prefs = {};
firebase.auth().onAuthStateChanged(user => { onAuthStateChanged(auth, user => {
this.setState({ isLoginModalOpen: false }); this.setState({ isLoginModalOpen: false });
if (user) { if (user) {
log('You are -> ', user); log('You are -> ', user);
@@ -1043,7 +1043,7 @@ export default class App extends Component {
} }
} }
trackEvent('fn', 'loggedOut'); trackEvent('fn', 'loggedOut');
auth.logout(); authh.logout();
this.setState({ isProfileModalOpen: false }); this.setState({ isProfileModalOpen: false });
alertsService.add('Log out successfull'); alertsService.add('Log out successfull');
} }

44
src/db.js
View File

@@ -1,6 +1,7 @@
import './firebaseInit'; // import './firebaseInit';
import firebase from 'firebase/app';
import 'firebase/firestore'; import 'firebase/firestore';
import { db } from './firebaseInit';
import { getDoc, getDocs, doc, updateDoc, setDoc } from 'firebase/firestore';
import { deferred } from './deferred'; import { deferred } from './deferred';
import { trackEvent } from './analytics'; import { trackEvent } from './analytics';
import { log } from './utils'; import { log } from './utils';
@@ -8,7 +9,7 @@ import { log } from './utils';
(() => { (() => {
const FAUX_DELAY = 1; const FAUX_DELAY = 1;
var db; // var db;
var dbPromise; var dbPromise;
var local = { var local = {
@@ -55,13 +56,13 @@ import { log } from './utils';
if (db) { if (db) {
return resolve(db); return resolve(db);
} }
const firestoreInstance = firebase.firestore(); const firestoreInstance = db;
return firestoreInstance return firestoreInstance
.enablePersistence({ experimentalTabSynchronization: true }) .enablePersistence({ experimentalTabSynchronization: true })
.then(function() { .then(function () {
// Initialize Cloud Firestore through firebase // Initialize Cloud Firestore through firebase
db = firebase.firestore(); // db = firebase.firestore();
// const settings = { // const settings = {
// timestampsInSnapshots: true // timestampsInSnapshots: true
// }; // };
@@ -69,7 +70,7 @@ import { log } from './utils';
log('firebase db ready', db); log('firebase db ready', db);
resolve(db); resolve(db);
}) })
.catch(function(err) { .catch(function (err) {
reject(err.code); reject(err.code);
if (err.code === 'failed-precondition') { if (err.code === 'failed-precondition') {
// Multiple tabs open, persistence can only be enabled // Multiple tabs open, persistence can only be enabled
@@ -113,11 +114,11 @@ import { log } from './utils';
{ {
lastSeenVersion: version lastSeenVersion: version
}, },
function() {} function () {}
); );
if (window.user) { if (window.user) {
const remoteDb = await getDb(); const remoteDb = await getDb();
remoteDb.doc(`users/${window.user.uid}`).update({ updateDoc(doc(remoteDb, `users/${window.user.uid}`), {
lastSeenVersion: version lastSeenVersion: version
}); });
} }
@@ -125,21 +126,16 @@ import { log } from './utils';
async function getUser(userId) { async function getUser(userId) {
const remoteDb = await getDb(); const remoteDb = await getDb();
return remoteDb
.doc(`users/${userId}`) return getDoc(doc(remoteDb, `users/${userId}`)).then(doc => {
.get() if (!doc.exists()) {
.then(doc => { return setDoc(doc(remoteDb, `users/${userId}`), {}, { merge: true });
if (!doc.exists) }
return remoteDb.doc(`users/${userId}`).set(
{}, const user = doc.data();
{ Object.assign(window.user, user);
merge: true return user;
} });
);
const user = doc.data();
Object.assign(window.user, user);
return user;
});
} }
// Fetch user settings. // Fetch user settings.

13
src/firebaseInit.js
View File

@@ -1,5 +1,7 @@
import firebase from 'firebase/app'; import { initializeApp } from 'firebase/app';
// import 'firebase/firestore'; import { getAuth } from 'firebase/auth';
import { getFirestore } from 'firebase/firestore';
const config = { const config = {
apiKey: 'AIzaSyBl8Dz7ZOE7aP75mipYl2zKdLSRzBU2fFc', apiKey: 'AIzaSyBl8Dz7ZOE7aP75mipYl2zKdLSRzBU2fFc',
authDomain: 'web-maker-app.firebaseapp.com', authDomain: 'web-maker-app.firebaseapp.com',
@@ -8,4 +10,9 @@ const config = {
storageBucket: 'web-maker-app.appspot.com', storageBucket: 'web-maker-app.appspot.com',
messagingSenderId: '560473480645' messagingSenderId: '560473480645'
}; };
firebase.initializeApp(config);
const app = initializeApp(config);
export { app };
export const auth = getAuth(app);
export const db = getFirestore(app);

114
src/itemService.js
View File

@@ -1,16 +1,27 @@
import { deferred } from './deferred'; import { deferred } from './deferred';
import { log } from 'util'; import { log } from './utils';
import firebase from 'firebase/app'; import {
collection,
deleteField,
where,
getDoc,
query,
setDoc,
writeBatch,
doc,
deleteDoc,
updateDoc,
getDocs
} from 'firebase/firestore';
export const itemService = { export const itemService = {
async getItem(id) { async getItem(id) {
var remoteDb = await window.db.getDb(); var remoteDb = await window.db.getDb();
return remoteDb return getDoc(doc(remoteDb, `items/${id}`))
.doc(`items/${id}`)
.get()
.then(doc => { .then(doc => {
return doc.data(); return doc.data();
}); })
.catch(error => log(error));
}, },
/** /**
@@ -48,22 +59,24 @@ export const itemService = {
if (window.user && !shouldFetchLocally) { if (window.user && !shouldFetchLocally) {
var remoteDb = await window.db.getDb(); var remoteDb = await window.db.getDb();
remoteDb // console.log(query, window.user.uid);
.collection('items') // d.resolve([]);
.where('createdBy', '==', window.user.uid)
.onSnapshot(
function(querySnapshot) {
querySnapshot.forEach(function(doc) {
items.push(doc.data());
});
log('Items fetched in ', Date.now() - t, 'ms');
d.resolve(items); const q = query(
}, collection(remoteDb, 'items'),
function() { where('createdBy', '==', window.user.uid)
d.resolve([]); );
} getDocs(q)
); .then(querySnapshot => {
querySnapshot.forEach(doc => {
items.push(doc.data());
});
log(`${items.length} items fetched in `, Date.now() - t, 'ms');
d.resolve(items);
})
.catch(() => {
d.resolve([]);
});
} else { } else {
for (let i = 0; i < itemIds.length; i++) { for (let i = 0; i < itemIds.length; i++) {
/* eslint-disable no-loop-func */ /* eslint-disable no-loop-func */
@@ -83,7 +96,7 @@ export const itemService = {
async setUser() { async setUser() {
const remoteDb = await window.db.getDb(); const remoteDb = await window.db.getDb();
return remoteDb.doc(`users/${window.user.uid}`).set({ return setDoc(doc(remoteDb, `users/${window.user.uid}`), {
items: {} items: {}
}); });
}, },
@@ -113,14 +126,11 @@ export const itemService = {
// LOGGED IN // LOGGED IN
var remoteDb = await window.db.getDb(); var remoteDb = await window.db.getDb();
item.createdBy = window.user.uid; item.createdBy = window.user.uid;
remoteDb setDoc(doc(remoteDb, `items/${id}`), item, {
.collection('items') merge: true
.doc(id) })
.set(item, { .then(() => {
merge: true log(`Document written`);
})
.then(arg => {
log('Document written', arg);
d.resolve(); d.resolve();
}) })
.catch(d.reject); .catch(d.reject);
@@ -147,7 +157,7 @@ export const itemService = {
{ {
items: {} items: {}
}, },
function(result) { function (result) {
/* eslint-disable guard-for-in */ /* eslint-disable guard-for-in */
for (var id in items) { for (var id in items) {
result.items[id] = true; result.items[id] = true;
@@ -160,12 +170,15 @@ export const itemService = {
); );
} else { } else {
window.db.getDb().then(remoteDb => { window.db.getDb().then(remoteDb => {
const batch = remoteDb.batch(); const batch = writeBatch(remoteDb);
/* eslint-disable guard-for-in */ /* eslint-disable guard-for-in */
for (var id in items) { for (var id in items) {
items[id].createdBy = window.user.uid; items[id].createdBy = window.user.uid;
batch.set(remoteDb.doc(`items/${id}`), items[id]); batch.set(doc(remoteDb, `items/${id}`), items[id]);
batch.update(remoteDb.doc(`users/${window.user.uid}`), { batch.update(doc(remoteDb, `users/${window.user.uid}`), {
[`items.${id}`]: true
});
batch.update(doc(remoteDb, `users/${window.user.uid}`), {
[`items.${id}`]: true [`items.${id}`]: true
}); });
// Set these items on our cached user object too // Set these items on our cached user object too
@@ -188,12 +201,9 @@ export const itemService = {
} }
const remoteDb = await window.db.getDb(); const remoteDb = await window.db.getDb();
log(`Starting to save item ${id}`); log(`Starting to save item ${id}`);
return remoteDb return deleteDoc(doc(remoteDb, `items/${id}`))
.collection('items') .then(() => {
.doc(id) log('Document removed');
.delete()
.then(arg => {
log('Document removed', arg);
}) })
.catch(error => log(error)); .catch(error => log(error));
}, },
@@ -205,7 +215,7 @@ export const itemService = {
{ {
items: {} items: {}
}, },
function(result) { function (result) {
result.items[itemId] = true; result.items[itemId] = true;
window.db.local.set({ window.db.local.set({
items: result.items items: result.items
@@ -214,12 +224,9 @@ export const itemService = {
); );
} }
const remoteDb = await window.db.getDb(); const remoteDb = await window.db.getDb();
return remoteDb return updateDoc(doc(remoteDb, `users/${window.user.uid}`), {
.collection('users') [`items.${itemId}`]: true
.doc(window.user.uid) })
.update({
[`items.${itemId}`]: true
})
.then(arg => { .then(arg => {
log(`Item ${itemId} set for user`, arg); log(`Item ${itemId} set for user`, arg);
window.user.items = window.user.items || {}; window.user.items = window.user.items || {};
@@ -235,7 +242,7 @@ export const itemService = {
{ {
items: {} items: {}
}, },
function(result) { function (result) {
delete result.items[itemId]; delete result.items[itemId];
window.db.local.set({ window.db.local.set({
items: result.items items: result.items
@@ -244,15 +251,12 @@ export const itemService = {
); );
} }
const remoteDb = await window.db.getDb(); const remoteDb = await window.db.getDb();
return remoteDb return updateDoc(doc(remoteDb, `users/${window.user.uid}`), {
.collection('users') [`items.${itemId}`]: deleteField()
.doc(window.user.uid) })
.update({
[`items.${itemId}`]: firebase.firestore.FieldValue.delete()
})
.then(arg => { .then(arg => {
delete window.user.items[itemId];
log(`Item ${itemId} unset for user`, arg); log(`Item ${itemId} unset for user`, arg);
delete window.user.items[itemId];
}) })
.catch(error => log(error)); .catch(error => log(error));
}, },