Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Privacy: Lurker mode: fix toggle behavior #1386

Merged
merged 3 commits into from
Mar 18, 2023
Merged

Privacy: Lurker mode: fix toggle behavior #1386

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
6dc42ac
Privacy: Lurker mode: fix toggle behavior
kaloudis Mar 17, 2023
5421c8d
Privacy: Lurker mode: make Channels pane toggleable
kaloudis Mar 17, 2023
290e8a7
Privacy: Lurker mode: make KeyValue component toggleable
kaloudis Mar 18, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 2 additions & 14 deletions components/Amount.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -181,12 +181,7 @@ export default class Amount extends React.Component<AmountProps, {}> {
<TouchableOpacity
onPress={() => UnitsStore.changeUnits()}
onLongPress={() => {
if (lurkerMode) {
SettingsStore.toggleLurker();
}
}}
onPressOut={() => {
if (!lurkerMode && lurkerExposed) {
if (!lurkerExposed && lurkerMode) {
SettingsStore.toggleLurker();
}
}}
Expand Down Expand Up @@ -240,17 +235,10 @@ export default class Amount extends React.Component<AmountProps, {}> {
<TouchableOpacity
onPress={() => UnitsStore.changeUnits()}
onLongPress={() => {
if (lurkerMode) {
if (!lurkerExposed && lurkerMode) {
SettingsStore.toggleLurker();
}
}}
onPressOut={() => {
if (!lurkerMode && lurkerExposed) {
setTimeout(() => {
SettingsStore.toggleLurker();
}, 3000);
}
}}
>
<AmountDisplay
{...unformattedAmount}
Expand Down
2 changes: 1 addition & 1 deletion components/Channels/ChannelsHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -32,7 +32,7 @@ function TotalRow({
{/* TODO: localize */}
<Body secondary>Total {kind}</Body>
</Row>
<Amount sats={amount} sensitive />
<Amount sats={amount} sensitive toggleable />
</Row>
);
}
Expand Down
135 changes: 72 additions & 63 deletions components/KeyValue.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,88 +7,97 @@ import {
View
} from 'react-native';
import Clipboard from '@react-native-clipboard/clipboard';
import { inject, observer } from 'mobx-react';

import { Body } from './text/Body';
import { Row } from './layout/Row';

import { themeColor } from './../utils/ThemeUtils';
import PrivacyUtils from './../utils/PrivacyUtils';
import { themeColor } from '../utils/ThemeUtils';
import PrivacyUtils from '../utils/PrivacyUtils';
import SettingsStore from '../stores/SettingsStore';

export default function KeyValue({
keyValue,
value,
color,
sensitive
}: {
interface KeyValueProps {
keyValue: string;
value?: any;
color?: string;
sensitive?: boolean;
}) {
{
/* TODO: rig up RTL */
}
const isCopyable = typeof value === 'string' || typeof value === 'number';
const rtl = false;
const Key = (
<Body>
SettingsStore: SettingsStore;
}

@inject('SettingsStore')
@observer
export default class KeyValue extends React.Component<KeyValueProps, {}> {
render() {
const { keyValue, value, color, sensitive, SettingsStore } = this.props;

const { lurkerMode } = SettingsStore?.settings?.privacy;

{
/* TODO: rig up RTL */
}
const isCopyable =
typeof value === 'string' || typeof value === 'number';
const rtl = false;
const Key = (
<Body>
<Text
style={{
color:
value !== undefined
? themeColor('secondaryText')
: themeColor('text')
}}
>
{keyValue}
</Text>
</Body>
);
const Value = isCopyable ? (
<Text
style={{
color:
value !== undefined
? themeColor('secondaryText')
: themeColor('text')
color: color || themeColor('text'),
fontFamily: 'Lato-Regular'
}}
>
{keyValue}
{sensitive ? PrivacyUtils.sensitiveValue(value) : value}
</Text>
</Body>
);
const Value = isCopyable ? (
<Text
style={{
color: color || themeColor('text'),
fontFamily: 'Lato-Regular'
}}
>
{sensitive ? PrivacyUtils.sensitiveValue(value) : value}
</Text>
) : (
value
);
) : (
value
);

const copyText = () => {
Clipboard.setString(value);
Vibration.vibrate(50);
};
const copyText = () => {
Clipboard.setString(value);
Vibration.vibrate(50);
};

const KeyValueRow = () => (
<Row justify="space-between">
<View style={rtl ? styles.rtlValue : styles.key}>
<Text style={{ color: themeColor('secondaryText') }}>
{rtl ? Value : Key}
</Text>
</View>
<View style={rtl ? styles.rtlKey : styles.value}>
{rtl ? Key : Value}
</View>
</Row>
);
const KeyValueRow = () => (
<Row justify="space-between">
<View style={rtl ? styles.rtlValue : styles.key}>
<Text style={{ color: themeColor('secondaryText') }}>
{rtl ? Value : Key}
</Text>
</View>
<View style={rtl ? styles.rtlKey : styles.value}>
{rtl ? Key : Value}
</View>
</Row>
);

const InteractiveKeyValueRow = () =>
isCopyable ? (
<TouchableOpacity onLongPress={() => copyText()}>
const InteractiveKeyValueRow = () =>
!!lurkerMode && isCopyable ? (
<TouchableOpacity onLongPress={() => copyText()}>
<KeyValueRow />
</TouchableOpacity>
) : (
<KeyValueRow />
</TouchableOpacity>
) : (
<KeyValueRow />
);
);

return (
<View style={{ paddingTop: 10, paddingBottom: 10 }}>
<InteractiveKeyValueRow />
</View>
);
return (
<View style={{ paddingTop: 10, paddingBottom: 10 }}>
<InteractiveKeyValueRow />
</View>
);
}
}

const styles = StyleSheet.create({
Expand Down
11 changes: 6 additions & 5 deletions stores/SettingsStore.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -676,12 +676,13 @@ export default class SettingsStore {

@action
public toggleLurker = () => {
if (this.settings.privacy.lurkerMode) {
this.lurkerExposed = true;
} else {
this.lurkerExposed = true;
this.settings.privacy.lurkerMode = false;

setTimeout(() => {
this.lurkerExposed = false;
}
this.settings.privacy.lurkerMode = !this.settings.privacy.lurkerMode;
this.settings.privacy.lurkerMode = true;
}, 3000);
};

@action
Expand Down
10 changes: 7 additions & 3 deletions views/Channels/ChannelsPane.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -137,6 +137,10 @@ export default class ChannelsPane extends React.PureComponent<ChannelsProps> {
closedChannels
} = ChannelsStore;

// trigger channelPane update when lurkerMode status changes
// this allows us to redraw the channel balance bars
const { lurkerMode } = SettingsStore.settings.privacy;

let headerString;
let channelsData;
switch (channelsType) {
Expand Down Expand Up @@ -174,9 +178,9 @@ export default class ChannelsPane extends React.PureComponent<ChannelsProps> {
}
/>
<ChannelsHeader
totalInbound={totalInbound}
totalOutbound={totalOutbound}
totalOffline={totalOffline}
totalInbound={!!lurkerMode && totalInbound}
totalOutbound={!!lurkerMode && totalOutbound}
totalOffline={!!lurkerMode && totalOffline}
/>
{loading ? (
<View style={{ top: 40 }}>
Expand Down