Skip to content

Commit

Permalink
Adds styles
Browse files Browse the repository at this point in the history
  • Loading branch information
jorbuedo committed Aug 1, 2023
1 parent 725ef67 commit f243337
Show file tree
Hide file tree
Showing 2 changed files with 87 additions and 96 deletions.
80 changes: 43 additions & 37 deletions apps/wallet-mobile/src/components/Analytics/Analytics.tsx
Original file line number Diff line number Diff line change
@@ -1,10 +1,10 @@
import React from 'react'
import {defineMessages, useIntl} from 'react-intl'
import {ScrollView, StyleSheet, Switch, View} from 'react-native'
import {Linking, ScrollView, StyleSheet, Switch, TouchableOpacity, View} from 'react-native'

import {Button, Text} from '../../components'
import {useMetrics} from '../../metrics/metricsManager'
import {spacing} from '../../theme'
import {COLORS, spacing} from '../../theme'
import {AnalyticsImage} from './AnalyticsImage'

type Props = {
Expand All @@ -18,30 +18,34 @@ export const Analytics = ({type, onClose}: Props) => {

return (
<ScrollView style={styles.scrollView}>
<View style={styles.content}>
<View style={styles.heading}>
<Text style={styles.title}>{strings.title}</Text>
<View style={styles.centered}>
{type === 'notice' && <Text style={styles.title}>{strings.header}</Text>}

<AnalyticsImage />
</View>
<AnalyticsImage />
</View>

<Text style={styles.paragraph}>{strings.header}</Text>
<View style={styles.centered}>
{type === 'settings' && <Text style={styles.paragraph} bold>{strings.header}</Text>}

<Text style={styles.paragraph}>{strings.description}</Text>
<Text style={styles.paragraph} bold={type === 'notice'}>
{strings.description}
</Text>
</View>

<View style={styles.list}>
{list.map(({style, icon, key}) => (
<Text style={styles.text} key={key}>
<Text style={style}>{icon}</Text>
<View style={styles.list}>
{list.map(({style, icon, key}) => (
<View key={key} style={styles.item}>
<Text style={style}>{icon}</Text>

{strings[key]}
</Text>
))}
</View>

<Text>{strings.more}</Text>
<Text style={styles.text}>{strings[key]}</Text>
</View>
))}
</View>

<TouchableOpacity onPress={() => Linking.openURL('')}>
<Text style={styles.link}>{strings.more}</Text>
</TouchableOpacity>

{type === 'notice' && (
<View style={styles.buttons}>
<Button
Expand All @@ -52,7 +56,7 @@ export const Analytics = ({type, onClose}: Props) => {
onClose?.()
}}
title={strings.skip}
style={styles.button}
style={styles.skip}
/>

<Button
Expand All @@ -63,7 +67,6 @@ export const Analytics = ({type, onClose}: Props) => {
onClose?.()
}}
title={strings.accept}
style={styles.button}
/>
</View>
)}
Expand All @@ -84,7 +87,7 @@ export const Analytics = ({type, onClose}: Props) => {

const styles = StyleSheet.create({
scrollView: {
paddingRight: 10,
marginHorizontal: 10,
},
text: {
fontSize: 14,
Expand All @@ -93,16 +96,23 @@ const styles = StyleSheet.create({
list: {
marginBottom: spacing.paragraphBottomMargin,
},
item: {
display: 'flex',
flexDirection: 'row',
alignItems: 'baseline',
},
paragraph: {
marginBottom: spacing.paragraphBottomMargin,
fontSize: 14,
lineHeight: 22,
textAlign: 'center',
},
content: {
flex: 1,
marginBottom: 24,
link: {
color: COLORS.BLUE_LIGHTER,
textAlign: 'center',
marginBottom: spacing.paragraphBottomMargin,
},
heading: {
centered: {
alignItems: 'center',
justifyContent: 'center',
marginBottom: spacing.paragraphBottomMargin,
Expand All @@ -115,18 +125,19 @@ const styles = StyleSheet.create({
},
buttons: {
flexDirection: 'column',
gap: 8,
marginTop: 12,
},
button: {
marginHorizontal: 10,
skip: {
borderWidth: 0,
},
tick: {
color: 'blue',
marginRight: 12,
color: COLORS.DARK_BLUE,
marginRight: 8,
},
cross: {
color: 'red',
marginRight: 12,
color: COLORS.RED,
marginRight: 8,
},
})

Expand All @@ -143,7 +154,6 @@ const bold = {b: (text) => <Text bold>{text}</Text>}
const useStrings = () => {
const intl = useIntl()
return {
title: intl.formatMessage(messages.title),
header: intl.formatMessage(messages.header),
description: intl.formatMessage(messages.description),
anonymous: intl.formatMessage(messages.anonymous),
Expand All @@ -159,10 +169,6 @@ const useStrings = () => {
}

const messages = defineMessages({
title: {
id: 'components.analytics.title',
defaultMessage: '!!!User insights',
},
header: {
id: 'components.analytics.header',
defaultMessage: '!!!Join the journey to improve Yoroi',
Expand Down
Original file line number Diff line number Diff line change
@@ -1,182 +1,167 @@
[
{
"id": "components.analytics.title",
"defaultMessage": "!!!User insights",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 162,
"column": 9,
"index": 4077
},
"end": {
"line": 165,
"column": 3,
"index": 4160
}
},
{
"id": "components.analytics.header",
"defaultMessage": "!!!Join the journey to improve Yoroi",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 166,
"line": 172,
"column": 10,
"index": 4172
"index": 4452
},
"end": {
"line": 169,
"line": 175,
"column": 3,
"index": 4276
"index": 4556
}
},
{
"id": "components.analytics.description",
"defaultMessage": "!!!Share user insights to help us fine tune Yoroi to better serve your needs.",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 170,
"line": 176,
"column": 15,
"index": 4293
"index": 4573
},
"end": {
"line": 173,
"line": 179,
"column": 3,
"index": 4443
"index": 4723
}
},
{
"id": "components.analytics.anonymous",
"defaultMessage": "!!!Anonymous analytics data",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 174,
"line": 180,
"column": 13,
"index": 4458
"index": 4738
},
"end": {
"line": 177,
"line": 183,
"column": 3,
"index": 4556
"index": 4836
}
},
{
"id": "components.analytics.optout",
"defaultMessage": "!!!You can always opt-out via Settings",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 178,
"line": 184,
"column": 10,
"index": 4568
"index": 4848
},
"end": {
"line": 181,
"line": 187,
"column": 3,
"index": 4674
"index": 4954
}
},
{
"id": "components.analytics.private",
"defaultMessage": "!!!We <b>cannot</b> access private keys",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 182,
"line": 188,
"column": 11,
"index": 4687
"index": 4967
},
"end": {
"line": 185,
"line": 191,
"column": 3,
"index": 4795
"index": 5075
}
},
{
"id": "components.analytics.noip",
"defaultMessage": "!!!We <b>are not</b> recording IP addresses",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 186,
"line": 192,
"column": 8,
"index": 4805
"index": 5085
},
"end": {
"line": 189,
"line": 195,
"column": 3,
"index": 4914
"index": 5194
}
},
{
"id": "components.analytics.nosell",
"defaultMessage": "!!!We <b>do not</b> sell data",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 190,
"line": 196,
"column": 10,
"index": 4926
"index": 5206
},
"end": {
"line": 193,
"line": 199,
"column": 3,
"index": 5023
"index": 5303
}
},
{
"id": "components.analytics.more",
"defaultMessage": "!!!Learn more about user insights",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 194,
"line": 200,
"column": 8,
"index": 5033
"index": 5313
},
"end": {
"line": 197,
"line": 203,
"column": 3,
"index": 5132
"index": 5412
}
},
{
"id": "components.analytics.skip",
"defaultMessage": "!!!Skip",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 198,
"line": 204,
"column": 8,
"index": 5142
"index": 5422
},
"end": {
"line": 201,
"line": 207,
"column": 3,
"index": 5215
"index": 5495
}
},
{
"id": "components.analytics.accept",
"defaultMessage": "!!!Accept",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 202,
"line": 208,
"column": 10,
"index": 5227
"index": 5507
},
"end": {
"line": 205,
"line": 211,
"column": 3,
"index": 5304
"index": 5584
}
},
{
"id": "components.analytics.toggle",
"defaultMessage": "!!!Allow Yoroi analytics",
"file": "src/components/Analytics/Analytics.tsx",
"start": {
"line": 206,
"line": 212,
"column": 10,
"index": 5316
"index": 5596
},
"end": {
"line": 209,
"line": 215,
"column": 3,
"index": 5408
"index": 5688
}
}
]

0 comments on commit f243337

Please sign in to comment.