From 8af7ab1dc5bff5724ddea2f728c4875d089de908 Mon Sep 17 00:00:00 2001 From: balzack Date: Sat, 14 Sep 2024 23:01:32 -0700 Subject: [PATCH] formatting --- app/client/mobile/src/access/Access.tsx | 42 +++--- .../mobile/src/access/useAccess.hook.ts | 8 +- app/client/mobile/src/channels/Channels.tsx | 10 +- app/client/mobile/src/contacts/Contacts.tsx | 10 +- .../mobile/src/context/useAppContext.hook.ts | 2 +- .../src/context/useDisplayContext.hook.ts | 4 +- app/client/mobile/src/details/Details.tsx | 2 +- app/client/mobile/src/profile/Profile.tsx | 2 +- app/client/mobile/src/registry/Registry.tsx | 3 +- .../mobile/src/session/Session.styled.ts | 1 - app/client/mobile/src/session/Session.tsx | 106 ++++++++------ app/client/mobile/src/settings/Settings.tsx | 12 +- app/client/mobile/src/utils/InputCode.tsx | 133 ++++++++++++++---- 13 files changed, 224 insertions(+), 111 deletions(-) diff --git a/app/client/mobile/src/access/Access.tsx b/app/client/mobile/src/access/Access.tsx index 9cf618ff..58fd3411 100644 --- a/app/client/mobile/src/access/Access.tsx +++ b/app/client/mobile/src/access/Access.tsx @@ -6,14 +6,21 @@ import { View, Image, } from 'react-native'; -import { KeyboardAwareScrollView } from 'react-native-keyboard-aware-scroll-view' +import {KeyboardAwareScrollView} from 'react-native-keyboard-aware-scroll-view'; import {useAccess} from './useAccess.hook'; import {styles} from './Access.styled'; import left from '../images/login.png'; -import {IconButton, Modal, Surface, Text, TextInput, Button} from 'react-native-paper'; +import { + IconButton, + Modal, + Surface, + Text, + TextInput, + Button, +} from 'react-native-paper'; import {SafeAreaView} from 'react-native-safe-area-context'; -import { BlurView } from "@react-native-community/blur"; -import { InputCode } from '../utils/InputCode'; +import {BlurView} from '@react-native-community/blur'; +import {InputCode} from '../utils/InputCode'; export function Access() { const [text, setText] = useState(''); @@ -64,7 +71,9 @@ export function Access() { {state.layout === 'large' && ( )} - + @@ -92,9 +101,7 @@ export function Access() { {state.mode === 'account' && ( - - {state.strings.accountLogin} - + {state.strings.accountLogin} - - {state.strings.accessAccount} - + {state.strings.accessAccount} - - {state.strings.createAccount} - + {state.strings.createAccount} {!state.available && ( {(alert || otp) && ( - + )} setOtp(false)}> - {state.strings.cancel} + {state.strings.cancel} - + diff --git a/app/client/mobile/src/access/useAccess.hook.ts b/app/client/mobile/src/access/useAccess.hook.ts index 2e8d790a..7b635ee9 100644 --- a/app/client/mobile/src/access/useAccess.hook.ts +++ b/app/client/mobile/src/access/useAccess.hook.ts @@ -47,8 +47,7 @@ export function useAccess() { if (node) { const available = await app.actions.getAvailable(node, secure); updateState({available}); - } - else { + } else { updateState({available: 0}); } } catch (err) { @@ -76,9 +75,8 @@ export function useAccess() { secure, ); updateState({taken: !available}); - } - else { - updateState({ taken: false }); + } else { + updateState({taken: false}); } } catch (err) { console.log(err); diff --git a/app/client/mobile/src/channels/Channels.tsx b/app/client/mobile/src/channels/Channels.tsx index f6f157cd..01f49829 100644 --- a/app/client/mobile/src/channels/Channels.tsx +++ b/app/client/mobile/src/channels/Channels.tsx @@ -1,9 +1,11 @@ -import { useContext } from 'react'; -import { Text, Button } from 'react-native-paper'; -import { SafeAreaView } from 'react-native'; +import {useContext} from 'react'; +import {Text, Button} from 'react-native-paper'; +import {SafeAreaView} from 'react-native'; export function Channels() { return ( - CHANNELS + + CHANNELS + ); } diff --git a/app/client/mobile/src/contacts/Contacts.tsx b/app/client/mobile/src/contacts/Contacts.tsx index 5e0d0ef8..3f5c3365 100644 --- a/app/client/mobile/src/contacts/Contacts.tsx +++ b/app/client/mobile/src/contacts/Contacts.tsx @@ -1,9 +1,11 @@ -import { useContext } from 'react'; -import { Text, Button } from 'react-native-paper'; -import { SafeAreaView } from 'react-native'; +import {useContext} from 'react'; +import {Text, Button} from 'react-native-paper'; +import {SafeAreaView} from 'react-native'; export function Contacts() { return ( - Contacts + + Contacts + ); } diff --git a/app/client/mobile/src/context/useAppContext.hook.ts b/app/client/mobile/src/context/useAppContext.hook.ts index 2e2e76b1..8183a8a6 100644 --- a/app/client/mobile/src/context/useAppContext.hook.ts +++ b/app/client/mobile/src/context/useAppContext.hook.ts @@ -47,7 +47,7 @@ export function useAppContext() { appName: 'databag', }; -console.log("SDK LOGIN:", username, password, node, secure); + console.log('SDK LOGIN:', username, password, node, secure); const login = await sdk.current.login( username, diff --git a/app/client/mobile/src/context/useDisplayContext.hook.ts b/app/client/mobile/src/context/useDisplayContext.hook.ts index 26294e9f..f6c517cb 100644 --- a/app/client/mobile/src/context/useDisplayContext.hook.ts +++ b/app/client/mobile/src/context/useDisplayContext.hook.ts @@ -16,8 +16,8 @@ export function useDisplayContext() { }; useEffect(() => { - const layout = dim.width < SMALL_LARGE ? 'small' : 'large' - updateState({ layout }); + const layout = dim.width < SMALL_LARGE ? 'small' : 'large'; + updateState({layout}); }, [dim.width]); const actions = {}; diff --git a/app/client/mobile/src/details/Details.tsx b/app/client/mobile/src/details/Details.tsx index d9818a71..77b80518 100644 --- a/app/client/mobile/src/details/Details.tsx +++ b/app/client/mobile/src/details/Details.tsx @@ -1,5 +1,5 @@ import {Text} from 'react-native-paper'; export function Details() { - return DETAILS + return DETAILS; } diff --git a/app/client/mobile/src/profile/Profile.tsx b/app/client/mobile/src/profile/Profile.tsx index 0d23907c..2d773ee2 100644 --- a/app/client/mobile/src/profile/Profile.tsx +++ b/app/client/mobile/src/profile/Profile.tsx @@ -1,3 +1,3 @@ export function Profile() { - return <> + return <>; } diff --git a/app/client/mobile/src/registry/Registry.tsx b/app/client/mobile/src/registry/Registry.tsx index 9d99fb17..ca050d53 100644 --- a/app/client/mobile/src/registry/Registry.tsx +++ b/app/client/mobile/src/registry/Registry.tsx @@ -1,4 +1,3 @@ export function Registry() { - return <> + return <>; } - diff --git a/app/client/mobile/src/session/Session.styled.ts b/app/client/mobile/src/session/Session.styled.ts index a25f53b2..cc25ef48 100644 --- a/app/client/mobile/src/session/Session.styled.ts +++ b/app/client/mobile/src/session/Session.styled.ts @@ -21,4 +21,3 @@ export const styles = StyleSheet.create({ flexGrow: 1, }, }); - diff --git a/app/client/mobile/src/session/Session.tsx b/app/client/mobile/src/session/Session.tsx index 73794364..42b99fed 100644 --- a/app/client/mobile/src/session/Session.tsx +++ b/app/client/mobile/src/session/Session.tsx @@ -1,17 +1,17 @@ -import { useState, useContext } from 'react'; -import { View, SafeAreaView } from 'react-native'; +import {useState, useContext} from 'react'; +import {View, SafeAreaView} from 'react-native'; import {styles} from './Session.styled'; -import { BottomNavigation, Button, Text } from 'react-native-paper'; -import { DisplayContext } from '../context/DisplayContext'; -import { Settings } from '../settings/Settings'; -import { Channels } from '../channels/Channels'; -import { Contacts } from '../contacts/Contacts'; -import { Registry } from '../registry/Registry'; -import { Profile } from '../profile/Profile'; -import { Details } from '../details/Details'; +import {BottomNavigation, Button, Text} from 'react-native-paper'; +import {DisplayContext} from '../context/DisplayContext'; +import {Settings} from '../settings/Settings'; +import {Channels} from '../channels/Channels'; +import {Contacts} from '../contacts/Contacts'; +import {Registry} from '../registry/Registry'; +import {Profile} from '../profile/Profile'; +import {Details} from '../details/Details'; -import { NavigationContainer } from '@react-navigation/native'; -import { createDrawerNavigator } from '@react-navigation/drawer'; +import {NavigationContainer} from '@react-navigation/native'; +import {createDrawerNavigator} from '@react-navigation/drawer'; const ChannelsRoute = () => ; const ContactsRoute = () => ; @@ -27,11 +27,26 @@ export function Session() { const display = useContext(DisplayContext); const [index, setIndex] = useState(0); const [routes] = useState([ - { key: 'channels', title: 'Channels', focusedIcon: 'comment-multiple', unfocusedIcon: 'comment-multiple-outline' }, - { key: 'contacts', title: 'Contacts', focusedIcon: 'contacts', unfocusedIcon: 'contacts-outline' }, - { key: 'settings', title: 'Settings', focusedIcon: 'cog', unfocusedIcon: 'cog-outline' }, + { + key: 'channels', + title: 'Channels', + focusedIcon: 'comment-multiple', + unfocusedIcon: 'comment-multiple-outline', + }, + { + key: 'contacts', + title: 'Contacts', + focusedIcon: 'contacts', + unfocusedIcon: 'contacts-outline', + }, + { + key: 'settings', + title: 'Settings', + focusedIcon: 'cog', + unfocusedIcon: 'cog-outline', + }, ]); - const sessionNav = { settings: null }; + const sessionNav = {settings: null}; const renderScene = BottomNavigation.SceneMap({ channels: ChannelsRoute, @@ -44,7 +59,7 @@ export function Session() { {display.state.layout !== 'large' && ( @@ -56,9 +71,9 @@ export function Session() { )} ); -}; +} -function DetailsScreen({ nav }) { +function DetailsScreen({nav}) { return ( + }}> - {({ navigation }) => } + {({navigation}) => ( + + )} - ) + ); } -function ProfileScreen({ nav }) { +function ProfileScreen({nav}) { return ( + }}> - {({ navigation }) => } + {({navigation}) => ( + + )} - ) + ); } -function RegistryScreen({ nav }) { +function RegistryScreen({nav}) { return ( + }}> - {({ navigation }) => } + {({navigation}) => ( + + )} - ) + ); } -function ContactsScreen({ nav }) { +function ContactsScreen({nav}) { return ( + }}> - {({ navigation }) => } + {({navigation}) => ( + + )} - ) + ); } -function SettingsScreen({ nav }) { +function SettingsScreen({nav}) { return ( + }}> - {({ navigation }) => } + {({navigation}) => } - ) + ); } -function HomeScreen({ nav }) { +function HomeScreen({nav}) { return ( diff --git a/app/client/mobile/src/settings/Settings.tsx b/app/client/mobile/src/settings/Settings.tsx index 83bff639..5ba3f28b 100644 --- a/app/client/mobile/src/settings/Settings.tsx +++ b/app/client/mobile/src/settings/Settings.tsx @@ -1,14 +1,16 @@ -import { useContext } from 'react'; -import { AppContext } from '../context/AppContext'; -import { Text, Button } from 'react-native-paper'; -import { SafeAreaView } from 'react-native'; +import {useContext} from 'react'; +import {AppContext} from '../context/AppContext'; +import {Text, Button} from 'react-native-paper'; +import {SafeAreaView} from 'react-native'; export function Settings() { const app = useContext(AppContext); return ( - + ); } diff --git a/app/client/mobile/src/utils/InputCode.tsx b/app/client/mobile/src/utils/InputCode.tsx index be995aa4..59fbf64d 100644 --- a/app/client/mobile/src/utils/InputCode.tsx +++ b/app/client/mobile/src/utils/InputCode.tsx @@ -1,50 +1,135 @@ -import { TextInput, Text, View, TouchableOpacity } from 'react-native'; -import { useState, useRef } from 'react'; - -export function InputCode({ onChangeText, style }) { +import {TextInput, Text, View, TouchableOpacity} from 'react-native'; +import {useState, useRef} from 'react'; +export function InputCode({onChangeText, style}) { const [code, setCode] = useState(''); const ref = useRef(); - const updateCode = (value) => { + const updateCode = value => { if (value.length >= 6) { onChangeText(value.slice(0, 6)); if (ref.current) { ref.current.blur(); } - } - else { + } else { onChangeText(''); } setCode(value.slice(0, 6)); - } + }; return ( - - - - { code.charAt(0) } + + + + {code.charAt(0)} - - { code.charAt(1) } + + {code.charAt(1)} - - { code.charAt(2) } + + {code.charAt(2)} - - { code.charAt(3) } + + {code.charAt(3)} - - { code.charAt(4) } + + {code.charAt(4)} - - { code.charAt(5) } + + {code.charAt(5)} - + ); } -