Skip to content

Commit

Permalink
Merge pull request #2231 from kaloudis/navigation-redux
Browse files Browse the repository at this point in the history 
Navigation: new Menu/Settings/Tools
  • Loading branch information
@kaloudis
kaloudis authored Jun 10, 2024
2 parents 10f2e35 + 67c77cf commit 80e81a5
Show file tree
Hide file tree
Showing 14 changed files with 1,257 additions and 840 deletions.
11 changes: 11 additions & 0 deletions App.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -163,6 +163,9 @@ import CustodialWalletWarning from './views/Settings/CustodialWalletWarning';
import PSBT from './views/PSBT';
import TxHex from './views/TxHex';

import Menu from './views/Menu';
import Tools from './views/Tools';

import { isLightTheme, themeColor } from './utils/ThemeUtils';

export default class App extends React.PureComponent {
Expand Down Expand Up @@ -321,10 +324,18 @@ export default class App extends React.PureComponent {
name="EditFee"
component={EditFee}
/>
<Stack.Screen
name="Menu"
component={Menu}
/>
<Stack.Screen
name="Settings"
component={Settings}
/>
<Stack.Screen
name="Tools"
component={Tools}
/>
<Stack.Screen
name="NodeConfiguration"
component={
Expand Down
10 changes: 5 additions & 5 deletions assets/images/SVG/Menu.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
17 changes: 17 additions & 0 deletions assets/images/SVG/Wrench.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
2 changes: 1 addition & 1 deletion components/Header.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -73,7 +73,7 @@ function ZeusHeader(props: HeaderProps) {
fill={themeColor('text')}
width="30"
height="30"
style={{ alignSelf: 'center' }}
style={{ alignSelf: 'center', marginLeft: 5 }}
/>
</TouchableOpacity>
);
Expand Down
97 changes: 55 additions & 42 deletions components/WalletHeader.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,8 +38,9 @@ import { themeColor } from '../utils/ThemeUtils';

import Add from '../assets/images/SVG/Add.svg';
import Alert from '../assets/images/SVG/Alert.svg';
import CaretUp from '../assets/images/SVG/Caret Up.svg';
import ClipboardSVG from '../assets/images/SVG/Clipboard.svg';
import Gear from '../assets/images/SVG/Gear.svg';
import Menu from '../assets/images/SVG/Menu.svg';
import Hourglass from '../assets/images/SVG/Hourglass.svg';
import POS from '../assets/images/SVG/POS.svg';
import Search from '../assets/images/SVG/Search.svg';
Expand Down Expand Up @@ -93,18 +94,17 @@ const ActivityButton = ({
}: {
navigation: StackNavigationProp<any, any>;
}) => (
<View style={{ width: 80 }}>
<Button
icon={{
name: 'list',
size: 40,
color: themeColor('text')
}}
containerStyle={{ top: -7 }}
iconOnly
onPress={() => navigation.navigate('Activity')}
<TouchableOpacity
onPress={() =>
navigation.navigate('Activity', { animation: 'slide_from_bottom' })
}
>
<CaretUp
fill={themeColor('text')}
width={45}
style={{ marginRight: 15, alignSelf: 'center' }}
/>
</View>
</TouchableOpacity>
);

const TempleButton = ({
Expand All @@ -117,25 +117,28 @@ const TempleButton = ({
>
<Temple
fill={themeColor('text')}
width={20.17}
height={22}
style={{ top: -8, alignSelf: 'center' }}
width={30}
height={35}
style={{ alignSelf: 'center' }}
/>
</TouchableOpacity>
);

const SettingsBadge = ({
const MenuBadge = ({
navigation
}: {
navigation: StackNavigationProp<any, any>;
}) => (
<TouchableOpacity
onPress={() =>
navigation.navigate('Settings', { animation: 'slide_from_left' })
protectedNavigation(navigation, 'Menu', undefined, {
animation: 'fade'
})
}
accessibilityLabel={localeString('views.Settings.title')}
style={{ left: 4 }}
>
<Gear fill={themeColor('text')} width={33} height={33} />
<Menu fill={themeColor('text')} width={38} height={38} />
</TouchableOpacity>
);

Expand Down Expand Up @@ -187,7 +190,7 @@ const POSBadge = ({
setPosStatus('active');
}}
>
<POS stroke={themeColor('text')} width="23" height="30" />
<POS stroke={themeColor('text')} width="30" height="35" />
</TouchableOpacity>
);

Expand Down Expand Up @@ -298,7 +301,7 @@ export default class WalletHeader extends React.Component<
) : (
<NodeIdenticon
selectedNode={selectedNode}
width={35}
width={36}
rounded
/>
)}
Expand Down Expand Up @@ -488,8 +491,8 @@ export default class WalletHeader extends React.Component<
<Header
leftComponent={
loading ? undefined : (
<Row>
<SettingsBadge navigation={navigation} />
<Row style={{ flex: 1 }}>
<MenuBadge navigation={navigation} />
{paid && paid.length > 0 && (
<TouchableOpacity
onPress={() =>
Expand All @@ -498,7 +501,7 @@ export default class WalletHeader extends React.Component<
{ skipStatus: true }
)
}
style={{ left: 18 }}
style={{ left: 10 }}
>
{redeemingAll ? (
<MailboxAnimated />
Expand All @@ -512,17 +515,20 @@ export default class WalletHeader extends React.Component<
}
centerComponent={
title ? (
<View style={{ top: 5 }}>
<View style={{ flex: 1 }}>
{toggle ? (
<View
style={{ top: -9, width: '100%' }}
style={{ flex: 1, width: '100%' }}
accessibilityLiveRegion="polite"
>
<Button
onPress={() => toggle()}
title={title}
noUppercase
buttonStyle={{ alignSelf: 'center' }}
buttonStyle={{
alignSelf: 'center',
height: 40
}}
icon={
filteredPendingChannels?.length > 0
? {
Expand All @@ -542,7 +548,7 @@ export default class WalletHeader extends React.Component<
)}
</View>
) : settings.display && settings.display.displayNickname ? (
<View style={{ top: 5 }}>
<View style={{ top: 0 }}>
<Row>
<Text
style={{
Expand All @@ -563,15 +569,19 @@ export default class WalletHeader extends React.Component<
</View>
) : (
<Row style={{ alignItems: 'center', flexGrow: 1 }}>
<StatusBadges />
{!loading && <StatusBadges />}
</Row>
)
}
rightComponent={
posStatus === 'active' ? (
<Row>
<ActivityButton navigation={navigation} />
<TempleButton navigation={navigation} />
{!loading && (
<>
<ActivityButton navigation={navigation} />
<TempleButton navigation={navigation} />
</>
)}
</Row>
) : channels ? (
<Row style={{ marginTop: 1 }}>
Expand All @@ -581,18 +591,19 @@ export default class WalletHeader extends React.Component<
) : (
<View
style={{
flexGrow: 1,
flexDirection: 'row',
alignItems: 'center'
}}
>
{(stores.balanceStore.loadingBlockchainBalance ||
stores.balanceStore.loadingLightningBalance ||
laLoading) && (
<View style={{ paddingRight: 15 }}>
<LoadingIndicator size={32} />
</View>
)}
{!loading &&
(stores.balanceStore.loadingBlockchainBalance ||
stores.balanceStore
.loadingLightningBalance ||
laLoading) && (
<View style={{ paddingRight: 15 }}>
<LoadingIndicator size={32} />
</View>
)}
{!!clipboard && (
<View style={{ marginRight: 15 }}>
<ClipboardBadge
Expand All @@ -619,10 +630,12 @@ export default class WalletHeader extends React.Component<
</View>
)}
{AlertStore.hasError && <AlertButton />}
<View>
<NodeButton />
</View>
{posEnabled !== PosEnabled.Disabled && (
{posEnabled === PosEnabled.Disabled && (
<View>
<NodeButton />
</View>
)}
{!loading && posEnabled !== PosEnabled.Disabled && (
<View
style={{
marginLeft: 15
Expand Down
1 change: 1 addition & 0 deletions locales/en.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -656,6 +656,7 @@
"views.ContactDetails.saveToContacts": "Save to Contacts",
"views.ContactDetails.editAndSaveContact": "Edit and Save Contact",
"views.ContactInfo.title": "Contact Info",
"views.Tools.title": "Tools",
"views.Settings.title": "Settings",
"views.Settings.enabled": "Enabled",
"views.Settings.disabled": "Disabled",
Expand Down
2 changes: 1 addition & 1 deletion views/Activity/Activity.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -228,7 +228,7 @@ export default class Activity extends React.PureComponent<
return (
<Screen>
<Header
leftComponent="Back"
leftComponent="Close"
centerComponent={{
text: localeString('general.activity'),
style: {
Expand Down
Loading

0 comments on commit 80e81a5

Please sign in to comment.