Follow conventions for query, use isDirty flag in session store to avoid unneccessary writes
parent
742f53d1ec
commit
b0c9cce5c3
|
@ -1,8 +1,8 @@
|
||||||
import {useQuery} from '@tanstack/react-query'
|
import {useQuery} from '@tanstack/react-query'
|
||||||
|
|
||||||
import {PUBLIC_BSKY_AGENT} from '#/data'
|
import {PUBLIC_BSKY_AGENT} from '#/state/queries'
|
||||||
|
|
||||||
export function useGetProfile({did}: {did: string}) {
|
export function useProfileQuery({did}: {did: string}) {
|
||||||
return useQuery({
|
return useQuery({
|
||||||
queryKey: ['getProfile', did],
|
queryKey: ['getProfile', did],
|
||||||
queryFn: async () => {
|
queryFn: async () => {
|
|
@ -4,7 +4,7 @@ import {BskyAgent, AtpPersistSessionHandler} from '@atproto/api'
|
||||||
import {networkRetry} from '#/lib/async/retry'
|
import {networkRetry} from '#/lib/async/retry'
|
||||||
import {logger} from '#/logger'
|
import {logger} from '#/logger'
|
||||||
import * as persisted from '#/state/persisted'
|
import * as persisted from '#/state/persisted'
|
||||||
import {PUBLIC_BSKY_AGENT} from '#/data'
|
import {PUBLIC_BSKY_AGENT} from '#/state/queries'
|
||||||
|
|
||||||
export type SessionAccount = persisted.PersistedAccount
|
export type SessionAccount = persisted.PersistedAccount
|
||||||
|
|
||||||
|
@ -102,6 +102,7 @@ function createPersistSessionHandler(
|
||||||
}
|
}
|
||||||
|
|
||||||
export function Provider({children}: React.PropsWithChildren<{}>) {
|
export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
|
const isDirty = React.useRef(false)
|
||||||
const [state, setState] = React.useState<StateContext>({
|
const [state, setState] = React.useState<StateContext>({
|
||||||
agent: PUBLIC_BSKY_AGENT,
|
agent: PUBLIC_BSKY_AGENT,
|
||||||
hasSession: false,
|
hasSession: false,
|
||||||
|
@ -113,6 +114,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
|
|
||||||
const upsertAccount = React.useCallback(
|
const upsertAccount = React.useCallback(
|
||||||
(account: persisted.PersistedAccount, expired = false) => {
|
(account: persisted.PersistedAccount, expired = false) => {
|
||||||
|
isDirty.current = true
|
||||||
setState(s => {
|
setState(s => {
|
||||||
return {
|
return {
|
||||||
...s,
|
...s,
|
||||||
|
@ -124,7 +126,6 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
[setState],
|
[setState],
|
||||||
)
|
)
|
||||||
|
|
||||||
// TODO have not connected this yet
|
|
||||||
const createAccount = React.useCallback<ApiContext['createAccount']>(
|
const createAccount = React.useCallback<ApiContext['createAccount']>(
|
||||||
async ({service, email, password, handle, inviteCode}: any) => {
|
async ({service, email, password, handle, inviteCode}: any) => {
|
||||||
logger.debug(
|
logger.debug(
|
||||||
|
@ -231,6 +232,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
|
|
||||||
const logout = React.useCallback<ApiContext['logout']>(async () => {
|
const logout = React.useCallback<ApiContext['logout']>(async () => {
|
||||||
logger.debug(`session: logout`, {}, logger.DebugContext.session)
|
logger.debug(`session: logout`, {}, logger.DebugContext.session)
|
||||||
|
isDirty.current = true
|
||||||
setState(s => {
|
setState(s => {
|
||||||
return {
|
return {
|
||||||
...s,
|
...s,
|
||||||
|
@ -301,6 +303,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
|
|
||||||
const removeAccount = React.useCallback<ApiContext['removeAccount']>(
|
const removeAccount = React.useCallback<ApiContext['removeAccount']>(
|
||||||
account => {
|
account => {
|
||||||
|
isDirty.current = true
|
||||||
setState(s => {
|
setState(s => {
|
||||||
return {
|
return {
|
||||||
...s,
|
...s,
|
||||||
|
@ -317,6 +320,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
ApiContext['updateCurrentAccount']
|
ApiContext['updateCurrentAccount']
|
||||||
>(
|
>(
|
||||||
account => {
|
account => {
|
||||||
|
isDirty.current = true
|
||||||
setState(s => {
|
setState(s => {
|
||||||
const currentAccount = s.currentAccount
|
const currentAccount = s.currentAccount
|
||||||
|
|
||||||
|
@ -363,6 +367,7 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
)
|
)
|
||||||
|
|
||||||
const clearCurrentAccount = React.useCallback(() => {
|
const clearCurrentAccount = React.useCallback(() => {
|
||||||
|
isDirty.current = true
|
||||||
setState(s => ({
|
setState(s => ({
|
||||||
...s,
|
...s,
|
||||||
currentAccount: undefined,
|
currentAccount: undefined,
|
||||||
|
@ -370,10 +375,13 @@ export function Provider({children}: React.PropsWithChildren<{}>) {
|
||||||
}, [setState])
|
}, [setState])
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
persisted.write('session', {
|
if (isDirty.current) {
|
||||||
accounts: state.accounts,
|
persisted.write('session', {
|
||||||
currentAccount: state.currentAccount,
|
accounts: state.accounts,
|
||||||
})
|
currentAccount: state.currentAccount,
|
||||||
|
})
|
||||||
|
isDirty.current = false
|
||||||
|
}
|
||||||
}, [state])
|
}, [state])
|
||||||
|
|
||||||
React.useEffect(() => {
|
React.useEffect(() => {
|
||||||
|
|
|
@ -11,7 +11,7 @@ import {Trans, msg} from '@lingui/macro'
|
||||||
import {useLingui} from '@lingui/react'
|
import {useLingui} from '@lingui/react'
|
||||||
import {styles} from './styles'
|
import {styles} from './styles'
|
||||||
import {useSession, useSessionApi, SessionAccount} from '#/state/session'
|
import {useSession, useSessionApi, SessionAccount} from '#/state/session'
|
||||||
import {useGetProfile} from '#/data/useGetProfile'
|
import {useProfileQuery} from '#/state/queries/profile'
|
||||||
|
|
||||||
function AccountItem({
|
function AccountItem({
|
||||||
account,
|
account,
|
||||||
|
@ -22,7 +22,7 @@ function AccountItem({
|
||||||
}) {
|
}) {
|
||||||
const pal = usePalette('default')
|
const pal = usePalette('default')
|
||||||
const {_} = useLingui()
|
const {_} = useLingui()
|
||||||
const {isError, data} = useGetProfile({did: account.did})
|
const {isError, data} = useProfileQuery({did: account.did})
|
||||||
|
|
||||||
const onPress = React.useCallback(() => {
|
const onPress = React.useCallback(() => {
|
||||||
onSelect(account)
|
onSelect(account)
|
||||||
|
|
|
@ -19,7 +19,7 @@ import {Haptics} from 'lib/haptics'
|
||||||
import {Trans, msg} from '@lingui/macro'
|
import {Trans, msg} from '@lingui/macro'
|
||||||
import {useLingui} from '@lingui/react'
|
import {useLingui} from '@lingui/react'
|
||||||
import {useSession, useSessionApi, SessionAccount} from '#/state/session'
|
import {useSession, useSessionApi, SessionAccount} from '#/state/session'
|
||||||
import {useGetProfile} from '#/data/useGetProfile'
|
import {useProfileQuery} from '#/state/queries/profile'
|
||||||
|
|
||||||
export const snapPoints = ['40%', '90%']
|
export const snapPoints = ['40%', '90%']
|
||||||
|
|
||||||
|
@ -29,7 +29,7 @@ function SwitchAccountCard({account}: {account: SessionAccount}) {
|
||||||
const {track} = useAnalytics()
|
const {track} = useAnalytics()
|
||||||
const {isSwitchingAccounts, currentAccount} = useSession()
|
const {isSwitchingAccounts, currentAccount} = useSession()
|
||||||
const {logout} = useSessionApi()
|
const {logout} = useSessionApi()
|
||||||
const {isError, data: profile} = useGetProfile({did: account.did})
|
const {isError, data: profile} = useProfileQuery({did: account.did})
|
||||||
const isCurrentAccount = account.did === currentAccount?.did
|
const isCurrentAccount = account.did === currentAccount?.did
|
||||||
const {onPressSwitchAccount} = useAccountSwitcher()
|
const {onPressSwitchAccount} = useAccountSwitcher()
|
||||||
|
|
||||||
|
|
|
@ -58,7 +58,7 @@ import {
|
||||||
useSetRequireAltTextEnabled,
|
useSetRequireAltTextEnabled,
|
||||||
} from '#/state/preferences'
|
} from '#/state/preferences'
|
||||||
import {useSession, useSessionApi, SessionAccount} from '#/state/session'
|
import {useSession, useSessionApi, SessionAccount} from '#/state/session'
|
||||||
import {useGetProfile} from '#/data/useGetProfile'
|
import {useProfileQuery} from '#/state/queries/profile'
|
||||||
|
|
||||||
// TEMPORARY (APP-700)
|
// TEMPORARY (APP-700)
|
||||||
// remove after backend testing finishes
|
// remove after backend testing finishes
|
||||||
|
@ -72,7 +72,7 @@ function SettingsAccountCard({account}: {account: SessionAccount}) {
|
||||||
const pal = usePalette('default')
|
const pal = usePalette('default')
|
||||||
const {isSwitchingAccounts, currentAccount} = useSession()
|
const {isSwitchingAccounts, currentAccount} = useSession()
|
||||||
const {logout} = useSessionApi()
|
const {logout} = useSessionApi()
|
||||||
const {isError, data} = useGetProfile({did: account.did})
|
const {isError, data} = useProfileQuery({did: account.did})
|
||||||
const isCurrentAccount = account.did === currentAccount?.did
|
const isCurrentAccount = account.did === currentAccount?.did
|
||||||
const {onPressSwitchAccount} = useAccountSwitcher()
|
const {onPressSwitchAccount} = useAccountSwitcher()
|
||||||
|
|
||||||
|
|
|
@ -41,7 +41,7 @@ import {router} from '../../../routes'
|
||||||
import {makeProfileLink} from 'lib/routes/links'
|
import {makeProfileLink} from 'lib/routes/links'
|
||||||
import {useLingui} from '@lingui/react'
|
import {useLingui} from '@lingui/react'
|
||||||
import {Trans, msg} from '@lingui/macro'
|
import {Trans, msg} from '@lingui/macro'
|
||||||
import {useGetProfile} from '#/data/useGetProfile'
|
import {useProfileQuery} from '#/state/queries/profile'
|
||||||
import {useSession} from '#/state/session'
|
import {useSession} from '#/state/session'
|
||||||
|
|
||||||
const ProfileCard = observer(function ProfileCardImpl() {
|
const ProfileCard = observer(function ProfileCardImpl() {
|
||||||
|
@ -50,7 +50,7 @@ const ProfileCard = observer(function ProfileCardImpl() {
|
||||||
isLoading,
|
isLoading,
|
||||||
isError,
|
isError,
|
||||||
data: profile,
|
data: profile,
|
||||||
} = useGetProfile({did: currentAccount!.did})
|
} = useProfileQuery({did: currentAccount!.did})
|
||||||
const {isDesktop} = useWebMediaQueries()
|
const {isDesktop} = useWebMediaQueries()
|
||||||
const size = 48
|
const size = 48
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue