diff --git a/app/client/mobile/App.tsx b/app/client/mobile/App.tsx index 5e34dcfb..fd09a453 100644 --- a/app/client/mobile/App.tsx +++ b/app/client/mobile/App.tsx @@ -1,103 +1,102 @@ -import React, { useState } from 'react'; -import { AppContextProvider } from './src/context/AppContext'; -import { SettingsContextProvider } from './src/context/SettingsContext'; -import { styles } from './App.styled'; +import React, {useState} from 'react'; +import {AppContextProvider} from './src/context/AppContext'; +import {SettingsContextProvider} from './src/context/SettingsContext'; +import {styles} from './App.styled'; +import {SafeAreaView, StyleSheet, useColorScheme, View} from 'react-native'; import { - SafeAreaView, - StyleSheet, - useColorScheme, - View, -} from 'react-native'; -import { - MD3LightTheme, MD3DarkTheme, TextInput, PaperProvider } from 'react-native-paper'; + MD3LightTheme, + MD3DarkTheme, + TextInput, + PaperProvider, +} from 'react-native-paper'; const databagColors = { - "light": { - "primary": "rgb(0, 108, 71)", - "onPrimary": "rgb(255, 255, 255)", - "primaryContainer": "rgb(142, 247, 193)", - "onPrimaryContainer": "rgb(0, 33, 19)", - "secondary": "rgb(121, 89, 0)", - "onSecondary": "rgb(255, 255, 255)", - "secondaryContainer": "rgb(255, 223, 160)", - "onSecondaryContainer": "rgb(38, 26, 0)", - "tertiary": "rgb(60, 100, 114)", - "onTertiary": "rgb(255, 255, 255)", - "tertiaryContainer": "rgb(192, 233, 250)", - "onTertiaryContainer": "rgb(0, 31, 40)", - "error": "rgb(186, 26, 26)", - "onError": "rgb(255, 255, 255)", - "errorContainer": "rgb(255, 218, 214)", - "onErrorContainer": "rgb(65, 0, 2)", - "background": "rgb(251, 253, 248)", - "onBackground": "rgb(25, 28, 26)", - "surface": "rgb(251, 253, 248)", - "onSurface": "rgb(25, 28, 26)", - "surfaceVariant": "rgb(220, 229, 220)", - "onSurfaceVariant": "rgb(64, 73, 67)", - "outline": "rgb(112, 121, 114)", - "outlineVariant": "rgb(192, 201, 193)", - "shadow": "rgb(0, 0, 0)", - "scrim": "rgb(0, 0, 0)", - "inverseSurface": "rgb(46, 49, 46)", - "inverseOnSurface": "rgb(239, 241, 237)", - "inversePrimary": "rgb(113, 218, 166)", - "elevation": { - "level0": "transparent", - "level1": "rgb(238, 246, 239)", - "level2": "rgb(231, 241, 234)", - "level3": "rgb(223, 237, 229)", - "level4": "rgb(221, 236, 227)", - "level5": "rgb(216, 233, 223)" + light: { + primary: 'rgb(0, 108, 71)', + onPrimary: 'rgb(255, 255, 255)', + primaryContainer: 'rgb(142, 247, 193)', + onPrimaryContainer: 'rgb(0, 33, 19)', + secondary: 'rgb(121, 89, 0)', + onSecondary: 'rgb(255, 255, 255)', + secondaryContainer: 'rgb(255, 223, 160)', + onSecondaryContainer: 'rgb(38, 26, 0)', + tertiary: 'rgb(60, 100, 114)', + onTertiary: 'rgb(255, 255, 255)', + tertiaryContainer: 'rgb(192, 233, 250)', + onTertiaryContainer: 'rgb(0, 31, 40)', + error: 'rgb(186, 26, 26)', + onError: 'rgb(255, 255, 255)', + errorContainer: 'rgb(255, 218, 214)', + onErrorContainer: 'rgb(65, 0, 2)', + background: 'rgb(251, 253, 248)', + onBackground: 'rgb(25, 28, 26)', + surface: 'rgb(251, 253, 248)', + onSurface: 'rgb(25, 28, 26)', + surfaceVariant: 'rgb(220, 229, 220)', + onSurfaceVariant: 'rgb(64, 73, 67)', + outline: 'rgb(112, 121, 114)', + outlineVariant: 'rgb(192, 201, 193)', + shadow: 'rgb(0, 0, 0)', + scrim: 'rgb(0, 0, 0)', + inverseSurface: 'rgb(46, 49, 46)', + inverseOnSurface: 'rgb(239, 241, 237)', + inversePrimary: 'rgb(113, 218, 166)', + elevation: { + level0: 'transparent', + level1: 'rgb(238, 246, 239)', + level2: 'rgb(231, 241, 234)', + level3: 'rgb(223, 237, 229)', + level4: 'rgb(221, 236, 227)', + level5: 'rgb(216, 233, 223)', }, - "surfaceDisabled": "rgba(25, 28, 26, 0.12)", - "onSurfaceDisabled": "rgba(25, 28, 26, 0.38)", - "backdrop": "rgba(42, 50, 45, 0.4)" + surfaceDisabled: 'rgba(25, 28, 26, 0.12)', + onSurfaceDisabled: 'rgba(25, 28, 26, 0.38)', + backdrop: 'rgba(42, 50, 45, 0.4)', }, - "dark": { - "primary": "rgb(113, 218, 166)", - "onPrimary": "rgb(0, 56, 35)", - "primaryContainer": "rgb(0, 82, 52)", - "onPrimaryContainer": "rgb(142, 247, 193)", - "secondary": "rgb(248, 189, 42)", - "onSecondary": "rgb(64, 45, 0)", - "secondaryContainer": "rgb(92, 67, 0)", - "onSecondaryContainer": "rgb(255, 223, 160)", - "tertiary": "rgb(164, 205, 221)", - "onTertiary": "rgb(5, 53, 66)", - "tertiaryContainer": "rgb(35, 76, 89)", - "onTertiaryContainer": "rgb(192, 233, 250)", - "error": "rgb(255, 180, 171)", - "onError": "rgb(105, 0, 5)", - "errorContainer": "rgb(147, 0, 10)", - "onErrorContainer": "rgb(255, 180, 171)", - "background": "rgb(25, 28, 26)", - "onBackground": "rgb(225, 227, 223)", - "surface": "rgb(25, 28, 26)", - "onSurface": "rgb(225, 227, 223)", - "surfaceVariant": "rgb(64, 73, 67)", - "onSurfaceVariant": "rgb(192, 201, 193)", - "outline": "rgb(138, 147, 140)", - "outlineVariant": "rgb(64, 73, 67)", - "shadow": "rgb(0, 0, 0)", - "scrim": "rgb(0, 0, 0)", - "inverseSurface": "rgb(225, 227, 223)", - "inverseOnSurface": "rgb(46, 49, 46)", - "inversePrimary": "rgb(0, 108, 71)", - "elevation": { - "level0": "transparent", - "level1": "rgb(29, 38, 33)", - "level2": "rgb(32, 43, 37)", - "level3": "rgb(35, 49, 41)", - "level4": "rgb(36, 51, 43)", - "level5": "rgb(37, 55, 46)" + dark: { + primary: 'rgb(113, 218, 166)', + onPrimary: 'rgb(0, 56, 35)', + primaryContainer: 'rgb(0, 82, 52)', + onPrimaryContainer: 'rgb(142, 247, 193)', + secondary: 'rgb(248, 189, 42)', + onSecondary: 'rgb(64, 45, 0)', + secondaryContainer: 'rgb(92, 67, 0)', + onSecondaryContainer: 'rgb(255, 223, 160)', + tertiary: 'rgb(164, 205, 221)', + onTertiary: 'rgb(5, 53, 66)', + tertiaryContainer: 'rgb(35, 76, 89)', + onTertiaryContainer: 'rgb(192, 233, 250)', + error: 'rgb(255, 180, 171)', + onError: 'rgb(105, 0, 5)', + errorContainer: 'rgb(147, 0, 10)', + onErrorContainer: 'rgb(255, 180, 171)', + background: 'rgb(25, 28, 26)', + onBackground: 'rgb(225, 227, 223)', + surface: 'rgb(25, 28, 26)', + onSurface: 'rgb(225, 227, 223)', + surfaceVariant: 'rgb(64, 73, 67)', + onSurfaceVariant: 'rgb(192, 201, 193)', + outline: 'rgb(138, 147, 140)', + outlineVariant: 'rgb(64, 73, 67)', + shadow: 'rgb(0, 0, 0)', + scrim: 'rgb(0, 0, 0)', + inverseSurface: 'rgb(225, 227, 223)', + inverseOnSurface: 'rgb(46, 49, 46)', + inversePrimary: 'rgb(0, 108, 71)', + elevation: { + level0: 'transparent', + level1: 'rgb(29, 38, 33)', + level2: 'rgb(32, 43, 37)', + level3: 'rgb(35, 49, 41)', + level4: 'rgb(36, 51, 43)', + level5: 'rgb(37, 55, 46)', }, - "surfaceDisabled": "rgba(225, 227, 223, 0.12)", - "onSurfaceDisabled": "rgba(225, 227, 223, 0.38)", - "backdrop": "rgba(42, 50, 45, 0.4)" - } -} + surfaceDisabled: 'rgba(225, 227, 223, 0.12)', + onSurfaceDisabled: 'rgba(225, 227, 223, 0.38)', + backdrop: 'rgba(42, 50, 45, 0.4)', + }, +}; function App(): React.JSX.Element { const colorScheme = useColorScheme(); @@ -105,14 +104,14 @@ function App(): React.JSX.Element { const theme = colorScheme === 'dark' - ? { ...MD3DarkTheme, colors: databagColors.dark } - : { ...MD3LightTheme, colors: databagColors.light }; + ? {...MD3DarkTheme, colors: databagColors.dark} + : {...MD3LightTheme, colors: databagColors.light}; return ( - + + {children} ); } - diff --git a/app/client/mobile/src/context/SettingsContext.tsx b/app/client/mobile/src/context/SettingsContext.tsx index 97924e75..ec06796f 100644 --- a/app/client/mobile/src/context/SettingsContext.tsx +++ b/app/client/mobile/src/context/SettingsContext.tsx @@ -1,14 +1,13 @@ -import { createContext } from 'react'; -import { useSettingsContext } from './useSettingsContext.hook'; +import {createContext} from 'react'; +import {useSettingsContext} from './useSettingsContext.hook'; export const SettingsContext = createContext({}); -export function SettingsContextProvider({ children }) { - const { state, actions } = useSettingsContext(); +export function SettingsContextProvider({children}) { + const {state, actions} = useSettingsContext(); return ( - + {children} ); } - diff --git a/app/client/mobile/src/context/useAppContext.hook.ts b/app/client/mobile/src/context/useAppContext.hook.ts index 5af34713..9810cc6e 100644 --- a/app/client/mobile/src/context/useAppContext.hook.ts +++ b/app/client/mobile/src/context/useAppContext.hook.ts @@ -1,11 +1,10 @@ -import { useState, useEffect } from 'react'; -import { DatabagSDK, SqlStore, Session } from 'databag-client-sdk'; -import SQLite from "react-native-sqlite-storage"; +import {useState, useEffect} from 'react'; +import {DatabagSDK, SqlStore, Session} from 'databag-client-sdk'; +import SQLite from 'react-native-sqlite-storage'; const DATABAG_DB = 'db_v200.db'; class Store implements SqlStore { - - private db: any = null; + private db: any = null; constructor() { SQLite.DEBUG(false); @@ -13,14 +12,20 @@ class Store implements SqlStore { } public async open(path: string) { - this.db = await SQLite.openDatabase({ name: path, location: "default" }); + this.db = await SQLite.openDatabase({name: path, location: 'default'}); } - public async set(stmt: string, params: (string | number | null)[]): Promise { + public async set( + stmt: string, + params: (string | number | null)[], + ): Promise { await this.db.executeSql(stmt, params); } - public async get(stmt: string, params: (string | number | null)[]): Promise { + public async get( + stmt: string, + params: (string | number | null)[], + ): Promise { const res = await this.db.executeSql(stmt, params); const rows = []; if (res[0] && res[0].rows && res[0].rows > 1) { @@ -30,21 +35,23 @@ class Store implements SqlStore { } return rows; } -}; +} export function useAppContext() { const [state, setState] = useState({ - accountMfa: boolean = false, - accountSet: boolean = false, - adminMfa: boolean = false, - adminSet: boolean = false, + accountMfa: (boolean = false), + accountSet: (boolean = false), + adminMfa: (boolean = false), + adminSet: (boolean = false), }); const updateState = (value: any) => { - setState((s) => ({ ...s, ...value })) - } + setState(s => ({...s, ...value})); + }; - useEffect(() => { init() }, []); + useEffect(() => { + init(); + }, []); const init = async () => { const sdk = new DatabagSDK(null); @@ -52,8 +59,8 @@ export function useAppContext() { await store.open(DATABAG_DB); const session = await sdk.initOfflineStore(store); if (session) { - console.log("init session"); - updateState({ accountSet: true, sdk, session }); + console.log('init session'); + updateState({accountSet: true, sdk, session}); } else { const params = { topicBatch: 16, @@ -61,38 +68,50 @@ export function useAppContext() { channelTypes: ['test'], pushType: 'fcm', deviceToken: 'aabbcc', - notifications: [{ event: 'msg', messageTitle: 'msgd' }], + notifications: [{event: 'msg', messageTitle: 'msgd'}], deviceId: '0011', version: '0.0.1', appName: 'databag', - } - console.log('-----> SDK LOGIN') + }; + console.log('-----> SDK LOGIN'); try { - const login = await sdk.login('asdf', 'asdf', 'https://balzack.coredb.org', null, params) - console.log(login) - updateState({ accountSet: true, sdk, session: login }) - } - catch (err) { - console.log("ERR:", err); + const login = await sdk.login( + 'asdf', + 'asdf', + 'https://balzack.coredb.org', + null, + params, + ); + console.log(login); + updateState({accountSet: true, sdk, session: login}); + } catch (err) { + console.log('ERR:', err); } } }; const actions = { - loginAccount: async (handle: string, password: string, url: string, mfaCode: string | null) => { - }, - accessAccount: async (url: string, token: string) => { - }, - createAccount: async (handle: string, password: string, url: string, token: string | null) => { - }, - logoutAccount: async () => { - }, - loginAdmin: async (token: string, url: string, mfaCode: string | null) => { - }, - logoutAdmin: async () => { - }, - } + loginAccount: async ( + handle: string, + password: string, + url: string, + mfaCode: string | null, + ) => {}, + accessAccount: async (url: string, token: string) => {}, + createAccount: async ( + handle: string, + password: string, + url: string, + token: string | null, + ) => {}, + logoutAccount: async () => {}, + loginAdmin: async ( + token: string, + url: string, + mfaCode: string | null, + ) => {}, + logoutAdmin: async () => {}, + }; - return { state, actions } + return {state, actions}; } - diff --git a/app/client/mobile/src/context/useSettingsContext.hook.ts b/app/client/mobile/src/context/useSettingsContext.hook.ts index a6374de1..145ee14d 100644 --- a/app/client/mobile/src/context/useSettingsContext.hook.ts +++ b/app/client/mobile/src/context/useSettingsContext.hook.ts @@ -1,6 +1,6 @@ -import { useEffect, useContext, useState, useRef } from 'react'; -import { getLanguageStrings } from '../constants/Strings'; -import { useWindowDimensions } from 'react-native'; +import {useEffect, useContext, useState, useRef} from 'react'; +import {getLanguageStrings} from '../constants/Strings'; +import {useWindowDimensions} from 'react-native'; export function useSettingsContext() { const dim = useWindowDimensions(); @@ -10,20 +10,18 @@ export function useSettingsContext() { splt: null, }); - const updateState = (value) => { - setState((s) => ({ ...s, ...value })) - } + const updateState = value => { + setState(s => ({...s, ...value})); + }; useEffect(() => { const strings = getLanguageStrings(); const wide = dim.width > dim.height; const split = dim.width > 650; - updateState({ strings, wide, split }); + updateState({strings, wide, split}); }, []); - const actions = { - }; + const actions = {}; - return { state, actions } + return {state, actions}; } -