Skip to content
This repository has been archived by the owner on Apr 2, 2021. It is now read-only.

Commit

Permalink
Merge pull request #418 from shocknet/new-debug-screen
Browse files Browse the repository at this point in the history
new debug screen
  • Loading branch information
Daniel Lugo authored Nov 26, 2020
2 parents 7f5d07d + c98e7bf commit 50e80ab
Show file tree
Hide file tree
Showing 4 changed files with 179 additions and 158 deletions.
11 changes: 9 additions & 2 deletions app/components/settings/icon.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import Entypo from 'react-native-vector-icons/Entypo'
import Ionicons from 'react-native-vector-icons/Ionicons'
import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityIcons'
import Fontisto from 'react-native-vector-icons/Fontisto'
import { ActivityIndicator } from 'react-native'

import * as CSS from '../../res/css'

Expand All @@ -26,7 +27,7 @@ const _Icon: React.FC<Props> = ({ name }) => {
}

if (name === 'check') {
return <Entypo name="check" color={CSS.Colors.BLUE_LIGHT} size={24} />
return <Entypo name="check" color={CSS.Colors.DARK_MODE_CYAN} size={24} />
}

if (name === 'checkbox-passive') {
Expand All @@ -46,7 +47,13 @@ const _Icon: React.FC<Props> = ({ name }) => {
}

if (name === 'copy') {
return <Ionicons name="ios-copy" color={CSS.Colors.BLUE_LIGHT} size={24} />
return (
<Ionicons name="ios-copy" color={CSS.Colors.DARK_MODE_CYAN} size={24} />
)
}

if (name === 'spinner') {
return <ActivityIndicator size="small" color={CSS.Colors.DARK_MODE_CYAN} />
}

throw new Error(`<Settings.Icon />: wrong icon name supplied.`)
Expand Down
292 changes: 136 additions & 156 deletions app/screens/Debug.tsx
Original file line number Diff line number Diff line change
@@ -1,222 +1,204 @@
import React from 'react'
import {
Clipboard,
ScrollView,
Button,
Text,
ToastAndroid,
View,
} from 'react-native'
import { View, Text, ToastAndroid } from 'react-native'
import { NavigationEvents } from 'react-navigation'
import { connect } from 'react-redux'
import uuid from 'uuid/v1'
import { StackNavigationOptions } from 'react-navigation-stack/lib/typescript/src/vendor/types'
import * as FS from 'react-native-fs'
import Share from 'react-native-share'

import * as CSS from '../res/css'
import * as Cache from '../services/cache'
import {
SettingOrData,
headerStyle,
headerTitleStyle,
headerBackImage,
ScrollViewContainer,
PAD_BETWEEN_ITEMS,
} from '../components/settings'

import Pad from '../components/Pad'
import * as Store from '../store'
import * as Services from '../services'

import QR from './WalletOverview/QR'

interface OwnProps {}

interface StateProps {
chatsAmt: number
sentReqsAmt: number
receivedReqsAmt: number
ownPostsAmt: number
feedPostsAmt: number
followsAmt: number
host: string
err?: string
debugModeEnabled: boolean

online: boolean

token: string

deviceID: string

err: string
}

interface DispatchProps {
enableDebug(): void
disableDebug(): void
tokenDidInvalidate(): void
hostWasSet(h: ''): void
}

type Props = OwnProps & StateProps & DispatchProps

class Debug extends React.PureComponent<Props, Record<string, any>> {
state: Record<string, any> = {}
interface State {
sharingWalletLog: boolean
sharingAPILog: boolean
}

mounted = false
class Debug extends React.PureComponent<Props, State> {
static navigationOptions: StackNavigationOptions = {
title: 'Debug',
headerStyle,
headerTitleAlign: 'center',
headerTitleStyle,
headerBackImage,
}

state: State = {
sharingAPILog: false,
sharingWalletLog: false,
}

subs = [() => {}]
mounted = false

componentDidMount() {
this.mounted = true
const { host } = this.props

const s = Services.rifle(host, `$user::currentHandshakeAddress::on`)

s.on('$shock', (data: string) => {
this.setState({
handshakeAddr: data,
})
})

this.subs.push(() => {
s.off('*')
s.close()
})

this.props.enableDebug()
ToastAndroid.show('Debug mode enabled', 800)
}

componentWillUnmount() {
this.mounted = false
}

copyDeviceID = () => {
Clipboard.setString(this.props.deviceID)
ToastAndroid.show('Copied', 800)
}

copyToken = () => {
Clipboard.setString(this.props.token)
ToastAndroid.show('Copied', 800)
}

clearAuthData = () => {
Cache.writeStoredAuthData(null)
this.props.tokenDidInvalidate()
this.props.hostWasSet('')
}

generateNewHandshakeNode = () => {
Services.post(`api/gun/put`, {
body: `$user>currentHandshakeAddress`,
value: uuid(),
})
enableDebugMode = () => {
this.props.enableDebug()
ToastAndroid.show('Debug mode enabled', 800)
}

disableDebugMode = () => {
this.props.disableDebug()
}

render() {
const {
err,
chatsAmt,
deviceID,
feedPostsAmt,
followsAmt,
online,
ownPostsAmt,
receivedReqsAmt,
sentReqsAmt,
token,
debugModeEnabled,
} = this.props

if (err) {
return (
<View style={CSS.styles.flexDeadCenter}>
<Text>{err}</Text>
</View>
)
toggleDebugMode = () => {
if (this.props.debugModeEnabled) {
this.disableDebugMode()
} else {
this.enableDebugMode()
}
}

const { handshakeAddr } = this.state
shareWalletLog = async () => {
ToastAndroid.show('Coming soon', ToastAndroid.LONG)
// try {
// this.setState({
// sharingWalletLog: true,
// })

return (
<ScrollView
style={styles.container}
contentContainerStyle={CSS.styles.alignItemsCenter}
>
<Text>A random Number: {Math.random().toString()}</Text>
<Button title="Disable " onPress={this.disableDebugMode} />
{debugModeEnabled ? (
<Text>Debug Mode Enabled</Text>
) : (
<Text>Debug Mode Disabled</Text>
)}
// console.log('beforeeee')

<Text>Canary Socket Status:</Text>
<Text>{online ? 'Connected' : 'Disconnected'}</Text>
// const files = await Logger.listAllLogFiles()

<Text>Current Handshake Address:</Text>
<Text>{handshakeAddr}</Text>
// console.log(files)

<Text>Current Chats:</Text>
<Text>{chatsAmt}</Text>
// this.setState({
// sharingWalletLog: false,
// })
// } catch (e) {}
}

<Text>Current Sent reqs:</Text>
<Text>{sentReqsAmt}</Text>
shareAPILog = async () => {
try {
this.setState({
sharingAPILog: true,
})

<Text>Current Received reqs:</Text>
<Text>{receivedReqsAmt}</Text>
interface Res {
dailyRotateFile: Array<{
message: string
level: string
}>
}

<Text>Feed posts:</Text>
<Text>{feedPostsAmt}</Text>
const { dailyRotateFile: lines } = await Services.get<Res>('api/log')

<Text>Follows:</Text>
<Text>{followsAmt}</Text>
const path = FS.DocumentDirectoryPath + '/shock-api-log-export.txt'

<Text>Own Posts:</Text>
<Text>{ownPostsAmt}</Text>
const txt = lines.map(l => JSON.stringify(l)).join('\n')

<Text>Device ID:</Text>
<Text>{deviceID}</Text>
FS.writeFile(path, txt)

<Text>Token:</Text>
<Text>{token}</Text>
Share.open({
type: 'plain/text',
url: 'file://' + path,
})

<Button title="Clear ALL Data" onPress={Cache.clearAllStorage} />
this.setState({
sharingAPILog: false,
})
} catch (e) {
ToastAndroid.show(
`Could not share API log: ${e.message}`,
ToastAndroid.LONG,
)
}
}

<Button title="Clear AUTH Data" onPress={this.clearAuthData} />
dismissSpinners = () => {
this.setState({
sharingAPILog: false,
sharingWalletLog: false,
})
}

<Button
title="Copy device id to clipboard"
onPress={this.copyDeviceID}
/>
render() {
const { err, debugModeEnabled } = this.props
const { sharingAPILog, sharingWalletLog } = this.state

<Button title="Copy token to clipboard" onPress={this.copyToken} />
if (err) {
return (
<View style={CSS.styles.flexDeadCenter}>
<Text>{err}</Text>
</View>
)
}

<Button
title="New Handshake Address"
onPress={this.generateNewHandshakeNode}
return (
<>
<NavigationEvents
onDidFocus={this.enableDebugMode}
onDidBlur={this.dismissSpinners}
/>

<QR size={256} logoToShow="shock" value={`${this.state.pk}`} />
</ScrollView>
<ScrollViewContainer>
<SettingOrData
onPress={this.toggleDebugMode}
title="Debug Mode Enabled"
subtitle="Logs become more verbose"
rightSide={
debugModeEnabled ? 'checkbox-active' : 'checkbox-passive'
}
/>

<Pad amount={PAD_BETWEEN_ITEMS} />

<SettingOrData
onPress={this.shareWalletLog}
title="Share Log"
subtitle="Share as text file"
rightSide={sharingWalletLog ? 'spinner' : 'copy'}
/>

<Pad amount={PAD_BETWEEN_ITEMS} />

<SettingOrData
onPress={this.shareAPILog}
title="Share API Log"
subtitle="Downloads logs for the last hour from node and shares as text file"
rightSide={sharingAPILog ? 'spinner' : 'copy'}
/>
</ScrollViewContainer>
</>
)
}
}

const styles = {
container: [CSS.styles.flex],
}

const mapStateToProps = (state: Store.State): StateProps => {
const host = Store.selectHost(state)

try {
return {
chatsAmt: Object.keys(state.chat.contacts).length,
deviceID: state.connection.deviceId,
feedPostsAmt: Store.getPostsFromFollowed(state).length,
followsAmt: Store.getFollowedPublicKeys(state).length,
ownPostsAmt: Store.getOwnPosts(state).length,
receivedReqsAmt: -1,
sentReqsAmt: -1,
token: state.auth.token,
online: Store.isOnline(state),
debugModeEnabled: state.debug.enabled,
err: '',
host,
}
} catch (e) {
// @ts-expect-error
Expand All @@ -229,8 +211,6 @@ const mapStateToProps = (state: Store.State): StateProps => {
const mapDispatch = {
disableDebug: Store.disableDebug,
enableDebug: Store.enableDebug,
tokenDidInvalidate: Store.tokenDidInvalidate,
hostWasSet: Store.hostWasSet,
}

export default connect(
Expand Down
Loading

0 comments on commit 50e80ab

Please sign in to comment.