martin/databag
1
0
Fork 0
mirror of https://github.com/balzack/databag.git synced 2025-02-14 20:49:16 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

preparing admin dashboard modals

Browse Source
This commit is contained in:
Roland Osborne 2022-10-13 11:22:14 -07:00
parent 4cc6d7fce5
commit 9c24064c4e
3 changed files with 31 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
app/mobile/src/dashboard/Dashboard.jsx
View File

@ -16,10 +16,10 @@ export function Dashboard(props) {
<SafeAreaView style={styles.container}> <SafeAreaView style={styles.container}>
<View style={styles.header}> <View style={styles.header}>
<Text style={styles.headerLabel}>Accounts</Text> <Text style={styles.headerLabel}>Accounts</Text>
<Ionicons style={styles.icon} name={'reload1'} size={24} /> <Ionicons style={styles.icon} name={'reload1'} size={20} />
<Ionicons style={styles.icon} name={'setting'} size={24} /> <Ionicons style={styles.icon} name={'setting'} size={20} />
<TouchableOpacity onPress={actions.logout}> <TouchableOpacity onPress={actions.logout}>
<Ionicons style={styles.icon} name={'logout'} size={24} /> <Ionicons style={styles.icon} name={'logout'} size={20} />
</TouchableOpacity> </TouchableOpacity>
<View style={styles.end}> <View style={styles.end}>
<Ionicons style={styles.icon} name={'adduser'} size={24} /> <Ionicons style={styles.icon} name={'adduser'} size={24} />
@ -31,7 +31,7 @@ export function Dashboard(props) {
keyExtractor={item => item.accountId} keyExtractor={item => item.accountId}
renderItem={({ item }) => ( renderItem={({ item }) => (
<View style={styles.account}> <View style={styles.account}>
<Logo src={item.logo} width={48} height={48} radius={6} /> <Logo src={item.logo} width={32} height={32} radius={4} />
<View style={styles.details}> <View style={styles.details}>
<Text style={styles.name}>{ item.name }</Text> <Text style={styles.name}>{ item.name }</Text>
<Text style={styles.handle}>{ item.handle }</Text> <Text style={styles.handle}>{ item.handle }</Text>

10
app/mobile/src/dashboard/Dashboard.styled.js
View File

@ -20,7 +20,7 @@ export const styles = StyleSheet.create({
}, },
headerLabel: { headerLabel: {
paddingLeft: 16, paddingLeft: 16,
fontSize: 24, fontSize: 20,
color: Colors.text, color: Colors.text,
}, },
icon: { icon: {
@ -43,12 +43,14 @@ export const styles = StyleSheet.create({
}, },
account: { account: {
width: '100%', width: '100%',
height: 64, height: 48,
display: 'flex', display: 'flex',
flexDirection: 'row', flexDirection: 'row',
paddingLeft: 24, paddingLeft: 24,
paddingRight: 24, paddingRight: 24,
alignItems: 'center', alignItems: 'center',
borderBottomWidth: 1,
borderColor: Colors.divider,
}, },
details: { details: {
paddingLeft: 16, paddingLeft: 16,
@ -59,11 +61,11 @@ export const styles = StyleSheet.create({
paddingTop: 8, paddingTop: 8,
}, },
name: { name: {
fontSize: 16, fontSize: 14,
color: Colors.text, color: Colors.text,
}, },
handle: { handle: {
fontSize: 16, fontSize: 14,
color: Colors.text, color: Colors.text,
}, },
control: { control: {

21
app/mobile/src/dashboard/useDashboard.hook.js
View File

@ -12,6 +12,9 @@ export function useDashboard(config, server, token) {
const [state, setState] = useState({ const [state, setState] = useState({
config: null, config: null,
accounts: [], accounts: [],
editConfig: false,
addUser: false,
accessUser: false,
}); });
const navigate = useNavigate(); const navigate = useNavigate();
@ -46,6 +49,24 @@ export function useDashboard(config, server, token) {
logout: () => { logout: () => {
navigate('/admin'); navigate('/admin');
}, },
showEditConfig: () => {
updateState({ editConfig: true });
},
hideEditConfig: () => {
updateState({ editConfig: false });
},
showAddUser: () => {
updateState({ addUser: true });
},
hideAddUser: () => {
updateState({ addUser: false });
},
showAccessUser: () => {
updateState({ accessUser: true });
},
hideAccessUser: () => {
updateState({ accessUser: false });
},
}; };
return { state, actions }; return { state, actions };