From a58b84bef97e5ac57129044de00a5db927695cc9 Mon Sep 17 00:00:00 2001 From: Jun Murakami <126404131+Jun-Murakami@users.noreply.github.com> Date: Wed, 22 May 2024 21:03:03 +0900 Subject: [PATCH] =?UTF-8?q?useIndexedDb.ts=E3=81=A8useObserve.ts=E3=81=AE?= =?UTF-8?q?=E5=A4=89=E6=9B=B4=E3=82=92=E3=82=B3=E3=83=9F=E3=83=83=E3=83=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/useAuth.ts | 96 ++++++++++++++++++++++++++------------- src/hooks/useIndexedDb.ts | 3 -- src/hooks/useObserve.ts | 32 +++++++------ 3 files changed, 83 insertions(+), 48 deletions(-) diff --git a/src/hooks/useAuth.ts b/src/hooks/useAuth.ts index d1d8cd9..a59c479 100644 --- a/src/hooks/useAuth.ts +++ b/src/hooks/useAuth.ts @@ -1,13 +1,24 @@ import { useEffect } from 'react'; import { getApp, initializeApp } from 'firebase/app'; import { - getAuth, indexedDBLocalPersistence, initializeAuth, GoogleAuthProvider, OAuthProvider, signInWithPopup, signInWithCredential, signInWithEmailAndPassword, createUserWithEmailAndPassword, sendPasswordResetEmail, signOut + getAuth, + indexedDBLocalPersistence, + initializeAuth, + GoogleAuthProvider, + OAuthProvider, + signInWithPopup, + signInWithCredential, + signInWithEmailAndPassword, + createUserWithEmailAndPassword, + sendPasswordResetEmail, + signOut, } from 'firebase/auth'; import { getDatabase, remove, ref, get, set } from 'firebase/database'; import { getStorage, ref as storageRef, deleteObject, listAll } from 'firebase/storage'; import { Capacitor } from '@capacitor/core'; import { FirebaseAuthentication } from '@capacitor-firebase/authentication'; import { useObserve } from './useObserve'; +import { useIndexedDb } from './useIndexedDb'; import { useAppStateStore } from '../store/appStateStore'; import { useTreeStateStore } from '../store/treeStateStore'; import { useInputDialogStore } from '../store/dialogStore'; @@ -62,11 +73,14 @@ export const useAuth = () => { const showInputDialog = useInputDialogStore((state) => state.showDialog); + const { loadSettingsFromIdb } = useIndexedDb(); // 追加 + const { observeTimeStamp } = useObserve(); // ログイン状態の監視 useEffect(() => { const asyncFunc = async () => { + await loadSettingsFromIdb(); if (Capacitor.isNativePlatform() && FirebaseAuthentication) { FirebaseAuthentication.addListener('authStateChange', async (result) => { if (result.user) { @@ -85,10 +99,10 @@ export const useAuth = () => { return () => { unsubscribe(); FirebaseAuthentication.removeAllListeners(); - } + }; }; asyncFunc(); - }, [setIsLoading, setIsLoggedIn, setUid, setEmail]); + }, [setIsLoading, setIsLoggedIn, setUid, setEmail, loadSettingsFromIdb]); useEffect(() => { const auth = getAuth(); @@ -124,13 +138,15 @@ export const useAuth = () => { const result = await FirebaseAuthentication.signInWithGoogle(); // 2. Sign in on the web layer using the id token const credential = GoogleAuthProvider.credential(result.credential?.idToken); - await signInWithCredential(await auth, credential).then(async () => { - setIsLoggedIn(true); - setSystemMessage(null); - }).catch((error) => { - setSystemMessage('Googleログインに失敗しました。Code:100\n\n' + error.code); - setIsLoading(false); - }); + await signInWithCredential(await auth, credential) + .then(async () => { + setIsLoggedIn(true); + setSystemMessage(null); + }) + .catch((error) => { + setSystemMessage('Googleログインに失敗しました。Code:100\n\n' + error.code); + setIsLoading(false); + }); } catch (error) { setSystemMessage('Googleログインに失敗しました。Code:101\n\n' + error); setIsLoading(false); @@ -166,13 +182,15 @@ export const useAuth = () => { return; } const credential = provider.credential({ idToken: result.credential.idToken, rawNonce: result.credential.nonce }); - await signInWithCredential(await auth, credential).then(async () => { - setIsLoggedIn(true); - setSystemMessage(null); - }).catch((error) => { - setSystemMessage('Appleログインに失敗しました。Code:104\n\n' + error.code); - setIsLoading(false); - }) + await signInWithCredential(await auth, credential) + .then(async () => { + setIsLoggedIn(true); + setSystemMessage(null); + }) + .catch((error) => { + setSystemMessage('Appleログインに失敗しました。Code:104\n\n' + error.code); + setIsLoading(false); + }); } catch (error) { setSystemMessage('Appleログインに失敗しました。Code:105\n\n' + error); setIsLoading(false); @@ -188,7 +206,7 @@ export const useAuth = () => { .catch((error) => { setSystemMessage('Appleログインに失敗しました。Code:106\n\n' + error.code); setIsLoading(false); - }) + }); } }; @@ -200,19 +218,25 @@ export const useAuth = () => { } setSystemMessage('ログイン中...'); setIsLoading(true); - signInWithEmailAndPassword(await auth, email, password).then(() => { - setIsLoggedIn(true); - setSystemMessage(null); - }).catch((error) => { - if (error.code === 'auth/invalid-credential') { - setSystemMessage('ログインに失敗しました。メールアドレスとパスワードを確認してください。Googleログインで使用したメールアドレスでログインする場合は、パスワードのリセットを行ってください。'); - } else if (error.code === 'auth/invalid-login-credentials') { - setSystemMessage('ログインに失敗しました。メールアドレスとパスワードを確認してください。Googleログインで使用したメールアドレスでログインする場合は、パスワードのリセットを行ってください。'); - } else { - setSystemMessage('ログインに失敗しました。Code:107\n\n' + error.code); - } - setIsLoading(false); - }); + signInWithEmailAndPassword(await auth, email, password) + .then(() => { + setIsLoggedIn(true); + setSystemMessage(null); + }) + .catch((error) => { + if (error.code === 'auth/invalid-credential') { + setSystemMessage( + 'ログインに失敗しました。メールアドレスとパスワードを確認してください。Googleログインで使用したメールアドレスでログインする場合は、パスワードのリセットを行ってください。' + ); + } else if (error.code === 'auth/invalid-login-credentials') { + setSystemMessage( + 'ログインに失敗しました。メールアドレスとパスワードを確認してください。Googleログインで使用したメールアドレスでログインする場合は、パスワードのリセットを行ってください。' + ); + } else { + setSystemMessage('ログインに失敗しました。Code:107\n\n' + error.code); + } + setIsLoading(false); + }); }; // メールアドレスとパスワードでサインアップ @@ -417,5 +441,13 @@ export const useAuth = () => { } setIsWaitingForDelete(false); }; - return { handleGoogleLogin, handleAppleLogin, handleEmailLogin, handleSignup, handleResetPassword, handleLogout, handleDeleteAccount }; + return { + handleGoogleLogin, + handleAppleLogin, + handleEmailLogin, + handleSignup, + handleResetPassword, + handleLogout, + handleDeleteAccount, + }; }; diff --git a/src/hooks/useIndexedDb.ts b/src/hooks/useIndexedDb.ts index 921cc15..c334a27 100644 --- a/src/hooks/useIndexedDb.ts +++ b/src/hooks/useIndexedDb.ts @@ -123,9 +123,6 @@ export const useIndexedDb = () => { // IndexedデータベースからAppの設定を読み込む ------------------------------------------------ const loadSettingsFromIdb = async () => { - if (!uid) { - return; - } try { const appState = await idb.appstate.get(1); if (appState) { diff --git a/src/hooks/useObserve.ts b/src/hooks/useObserve.ts index 687072e..215b73b 100644 --- a/src/hooks/useObserve.ts +++ b/src/hooks/useObserve.ts @@ -7,7 +7,7 @@ import { useFirebaseConnection } from './useFirebaseConnection'; import { useError } from './useError'; import { useDatabase } from './useDatabase'; import { useIndexedDb } from './useIndexedDb'; -import { getDatabase, ref, onValue, } from 'firebase/database'; +import { getDatabase, ref, onValue } from 'firebase/database'; import { useAppStateStore } from '../store/appStateStore'; import { useTreeStateStore } from '../store/treeStateStore'; import { useDialogStore } from '../store/dialogStore'; @@ -38,15 +38,15 @@ export const useObserve = () => { const { loadCurrentTreeData, handleLoadedContent } = useTreeManagement(); const { loadTreesListFromDb, saveItemsDb } = useDatabase(); - const { syncDb, + const { + syncDb, checkAndSyncDb, - loadSettingsFromIdb, loadTreesListFromIdb, saveSettingsIdb, saveItemsIdb, saveTreesListIdb, saveQuickMemoIdb, - copyTreeDataToIdbFromDb + copyTreeDataToIdbFromDb, } = useIndexedDb(); const { loadSettingsFromDb, loadQuickMemoFromDb, saveQuickMemoDb } = useAppStateManagement(); const { handleError } = useError(); @@ -59,7 +59,6 @@ export const useObserve = () => { } if (!isLoading) setIsLoading(true); await checkAndSyncDb(); - await loadSettingsFromIdb(); await loadTreesListFromIdb(); await loadQuickMemoFromDb(); setIsLoading(false); @@ -72,7 +71,11 @@ export const useObserve = () => { const name = treeNameOffline ? treeNameOffline : 'オフラインツリー'; const quickMemo = quickMemoOffline ? quickMemoOffline : ''; const conbinedQuickMemoText = quickMemoText + '\n\n' + quickMemo; - const result = await showDialog('オフラインツリーが見つかりました。このツリーを読み込みますか？', 'オフラインツリーの読み込み', true); + const result = await showDialog( + 'オフラインツリーが見つかりました。このツリーを読み込みますか？', + 'オフラインツリーの読み込み', + true + ); if (result) { await handleLoadedContent(JSON.stringify({ name, items })); setQuickMemoText(conbinedQuickMemoText); @@ -80,7 +83,11 @@ export const useObserve = () => { await Preferences.remove({ key: `treeName_offline` }); await Preferences.remove({ key: `quick_memo_offline` }); } else { - const removeResult = await showDialog('オフラインツリーを削除しますか？削除せず、次回ログイン時に読み込むこともできます。', 'オフラインツリーの削除', true); + const removeResult = await showDialog( + 'オフラインツリーを削除しますか？削除せず、次回ログイン時に読み込むこともできます。', + 'オフラインツリーの削除', + true + ); if (removeResult) { await Preferences.remove({ key: `items_offline` }); await Preferences.remove({ key: `treeName_offline` }); @@ -136,7 +143,6 @@ export const useObserve = () => { setPrevCurrentTree(null); await loadCurrentTreeData(currentTree); } - } setIsLoading(false); }); @@ -155,7 +161,7 @@ export const useObserve = () => { await saveItemsIdb(prevItems, prevCurrentTree); await saveItemsDb(prevItems, prevCurrentTree); } - } + }; asyncFunc(); } setPrevCurrentTree(currentTree); @@ -184,7 +190,7 @@ export const useObserve = () => { const asyncFunc = async () => { await saveItemsIdb(items, targetTree); await saveItemsDb(items, targetTree); - } + }; asyncFunc(); } setPrevItems([]); @@ -219,7 +225,7 @@ export const useObserve = () => { const asyncFunc = async () => { await saveQuickMemoIdb(quickMemoText); await saveQuickMemoDb(quickMemoText); - } + }; asyncFunc(); } } catch (error) { @@ -233,6 +239,6 @@ export const useObserve = () => { }, [quickMemoText]); return { - observeTimeStamp + observeTimeStamp, }; -} \ No newline at end of file +};