Implement logging system

This commit is contained in:
Paul Frazee 2023-01-02 17:38:13 -06:00
parent 99cec71ed7
commit f6a0e634d7
39 changed files with 442 additions and 125 deletions

View file

@ -35,9 +35,9 @@ export const Home = observer(function Home({
if (store.me.mainFeed.isLoading) {
return
}
console.log('Polling home feed')
store.log.debug('Polling home feed')
store.me.mainFeed.checkForLatest().catch(e => {
console.error('Failed to poll feed', e)
store.log.error('Failed to poll feed', e.toString())
})
}
@ -49,12 +49,12 @@ export const Home = observer(function Home({
}
if (hasSetup) {
console.log('Updating home feed')
store.log.debug('Updating home feed')
store.me.mainFeed.update()
doPoll()
} else {
store.nav.setTitle(navIdx, 'Home')
console.log('Fetching home feed')
store.log.debug('Fetching home feed')
store.me.mainFeed.setup().then(() => {
if (aborted) return
setHasSetup(true)

100
src/view/screens/Log.tsx Normal file
View file

@ -0,0 +1,100 @@
import React, {useEffect} from 'react'
import {ScrollView, StyleSheet, TouchableOpacity, View} from 'react-native'
import {observer} from 'mobx-react-lite'
import {FontAwesomeIcon} from '@fortawesome/react-native-fontawesome'
import {useStores} from '../../state'
import {ScreenParams} from '../routes'
import {s} from '../lib/styles'
import {ViewHeader} from '../com/util/ViewHeader'
import {Text} from '../com/util/text/Text'
import {usePalette} from '../lib/hooks/usePalette'
import {ago} from '../../lib/strings'
export const Log = observer(function Log({navIdx, visible}: ScreenParams) {
const pal = usePalette('default')
const store = useStores()
const [expanded, setExpanded] = React.useState<string[]>([])
useEffect(() => {
if (!visible) {
return
}
store.shell.setMinimalShellMode(false)
store.nav.setTitle(navIdx, 'Log')
}, [visible, store])
const toggler = (id: string) => () => {
if (expanded.includes(id)) {
setExpanded(expanded.filter(v => v !== id))
} else {
setExpanded([...expanded, id])
}
}
return (
<View style={[s.flex1]}>
<ViewHeader title="Log" />
<ScrollView style={s.flex1}>
{store.log.entries
.slice(0)
.reverse()
.map(entry => {
return (
<View key={`entry-${entry.id}`}>
<TouchableOpacity
style={[styles.entry, pal.border, pal.view]}
onPress={toggler(entry.id)}>
{entry.type === 'debug' ? (
<FontAwesomeIcon icon="info" />
) : (
<FontAwesomeIcon icon="exclamation" style={s.red3} />
)}
<Text type="body2" style={[styles.summary, pal.text]}>
{entry.summary}
</Text>
{!!entry.details ? (
<FontAwesomeIcon
icon={
expanded.includes(entry.id) ? 'angle-up' : 'angle-down'
}
style={s.mr5}
/>
) : undefined}
<Text type="body2" style={[styles.ts, pal.textLight]}>
{entry.ts ? ago(entry.ts) : ''}
</Text>
</TouchableOpacity>
{expanded.includes(entry.id) ? (
<View style={[pal.btn, styles.details]}>
<Text type="body1" style={pal.text}>
{entry.details}
</Text>
</View>
) : undefined}
</View>
)
})}
<View style={{height: 100}} />
</ScrollView>
</View>
)
})
const styles = StyleSheet.create({
entry: {
flexDirection: 'row',
borderTopWidth: 1,
paddingVertical: 10,
paddingHorizontal: 6,
},
summary: {
flex: 1,
},
ts: {
width: 40,
},
details: {
paddingVertical: 10,
paddingHorizontal: 6,
},
})

View file

@ -14,12 +14,12 @@ export const Notifications = ({navIdx, visible}: ScreenParams) => {
if (!visible) {
return
}
console.log('Updating notifications feed')
store.log.debug('Updating notifications feed')
store.me.refreshMemberships() // needed for the invite notifications
store.me.notifications
.update()
.catch(e => {
console.error('Error while updating notifications feed', e)
store.log.error('Error while updating notifications feed', e.toString())
})
.then(() => {
store.me.notifications.updateReadState()

View file

@ -31,7 +31,6 @@ export const PostThread = ({navIdx, visible, params}: ScreenParams) => {
setTitle()
store.shell.setMinimalShellMode(false)
if (!view.hasLoaded && !view.isLoading) {
console.log('Fetching post thread', uri)
view.setup().then(
() => {
if (!aborted) {
@ -39,14 +38,14 @@ export const PostThread = ({navIdx, visible, params}: ScreenParams) => {
}
},
err => {
console.error('Failed to fetch thread', err)
store.log.error('Failed to fetch thread', err.toString())
},
)
}
return () => {
aborted = true
}
}, [visible, store.nav, name])
}, [visible, store.nav, store.log, name])
return (
<View style={{flex: 1}}>

View file

@ -40,10 +40,8 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => {
return
}
if (hasSetup) {
console.log('Updating profile for', params.name)
uiState.update()
} else {
console.log('Fetching profile for', params.name)
store.nav.setTitle(navIdx, params.name)
uiState.setup().then(() => {
if (aborted) return
@ -64,12 +62,19 @@ export const Profile = observer(({navIdx, visible, params}: ScreenParams) => {
const onRefresh = () => {
uiState
.refresh()
.catch((err: any) => console.error('Failed to refresh', err))
.catch((err: any) =>
store.log.error('Failed to refresh user profile', err.toString()),
)
}
const onEndReached = () => {
uiState
.loadMore()
.catch((err: any) => console.error('Failed to load more', err))
.catch((err: any) =>
store.log.error(
'Failed to load more entries in user profile',
err.toString(),
),
)
}
const onPressTryAgain = () => {
uiState.setup()

View file

@ -3,7 +3,7 @@ import {StyleSheet, TouchableOpacity, View} from 'react-native'
import {observer} from 'mobx-react-lite'
import {useStores} from '../../state'
import {ScreenParams} from '../routes'
import {s, colors} from '../lib/styles'
import {s} from '../lib/styles'
import {ViewHeader} from '../com/util/ViewHeader'
import {Link} from '../com/util/Link'
import {Text} from '../com/util/text/Text'
@ -32,7 +32,7 @@ export const Settings = observer(function Settings({
return (
<View style={[s.flex1]}>
<ViewHeader title="Settings" />
<View style={[s.mt10, s.pl10, s.pr10]}>
<View style={[s.mt10, s.pl10, s.pr10, s.flex1]}>
<View style={[s.flexRow]}>
<Text style={pal.text}>Signed in as</Text>
<View style={s.flex1} />
@ -61,9 +61,23 @@ export const Settings = observer(function Settings({
</View>
</View>
</Link>
<Link href="/debug" title="Debug tools">
<View style={s.flex1} />
<Text type="overline1" style={[s.mb5]}>
Advanced
</Text>
<Link
style={[pal.view, s.p10, s.mb2]}
href="/sys/log"
title="System log">
<Text style={pal.link}>System log</Text>
</Link>
<Link
style={[pal.view, s.p10, s.mb2]}
href="/sys/debug"
title="Debug tools">
<Text style={pal.link}>Debug tools</Text>
</Link>
<View style={{height: 100}} />
</View>
</View>
)