0.2.0-beta

package.json

@@ -152,7 +152,7 @@
 		"blind-signatures",
 		"lightning-network"
 	],
-	"version": "0.1.2",
+	"version": "0.2.0",
 	"license": "AGPL-3.0-only",
 	"bugs": {
 		"url": "https://github.com/cashubtc/eNuts/issues"

src/components/App.tsx

@@ -14,6 +14,7 @@ import { NostrProvider } from '@src/context/Nostr'
 import { PinCtx } from '@src/context/Pin'
 import { PrivacyProvider } from '@src/context/Privacy'
 import { PromptProvider } from '@src/context/Prompt'
+import { ReleaseProvider } from '@src/context/Release'
 import { ThemeProvider, useThemeContext } from '@src/context/Theme'
 import { NS } from '@src/i18n'
 import { secureStore, store } from '@store'
@@ -201,25 +202,27 @@ function _App() {
 			<PinCtx.Provider value={pinData}>
 				<PrivacyProvider>
 					<MenuProvider>
-						<NostrProvider>
-							<NavContainer>
-								<FocusClaimProvider >
-									<PromptProvider>
-										<KeyboardProvider>
-											<Navigator
-												shouldOnboard={shouldOnboard}
-												pinHash={auth.pinHash}
-												bgAuth={bgAuth}
-												setBgAuth={setBgAuth}
-											/>
-											<StatusBar style="auto" />
-											<ClipboardModal />
-											<Toaster />
-										</KeyboardProvider>
-									</PromptProvider>
-								</FocusClaimProvider>
-							</NavContainer>
-						</NostrProvider>
+						<ReleaseProvider>
+							<NostrProvider>
+								<NavContainer>
+									<FocusClaimProvider >
+										<PromptProvider>
+											<KeyboardProvider>
+												<Navigator
+													shouldOnboard={shouldOnboard}
+													pinHash={auth.pinHash}
+													bgAuth={bgAuth}
+													setBgAuth={setBgAuth}
+												/>
+												<StatusBar style="auto" />
+												<ClipboardModal />
+												<Toaster />
+											</KeyboardProvider>
+										</PromptProvider>
+									</FocusClaimProvider>
+								</NavContainer>
+							</NostrProvider>
+						</ReleaseProvider>
 					</MenuProvider>
 				</PrivacyProvider>
 			</PinCtx.Provider>

src/components/Backup.tsx

@@ -1,13 +1,17 @@
 import { useThemeContext } from '@src/context/Theme'
 import { NS } from '@src/i18n'
-import { globals } from '@styles'
+import { store } from '@store'
+import { STORE_KEYS } from '@store/consts'
+import { highlight as hi, mainColors } from '@styles/colors'
 import { formatMintUrl, share } from '@util'
 import { useTranslation } from 'react-i18next'
-import { Text } from 'react-native'
-import { ScaledSheet } from 'react-native-size-matters'
+import { TouchableOpacity, View } from 'react-native'
+import { s, ScaledSheet, vs } from 'react-native-size-matters'
 
-import ActionButtons from './ActionButtons'
+import Button from './Button'
 import useCopy from './hooks/Copy'
+import { CheckmarkIcon, CopyIcon, FlagIcon, ShareIcon } from './Icons'
+import Txt from './Txt'
 
 interface IBackupSuccessProps {
 	token: string
@@ -16,41 +20,79 @@ interface IBackupSuccessProps {
 
 export default function BackupSuccess({ token, mint }: IBackupSuccessProps) {
 	const { t } = useTranslation([NS.common])
-	const { color } = useThemeContext()
+	const { color, highlight } = useThemeContext()
 	const { copied, copy } = useCopy()
-
+	const handleCopy = async () => {
+		await copy(token)
+		// we can save the created backup here to avoid foreground prompts of self-created backup tokens
+		await store.set(STORE_KEYS.createdToken, token)
+	}
 	return (
 		<>
-			<Text style={[globals(color).navTxt, styles.subTxt]}>
-				{t('copyBackup', { ns: NS.backup })}
-			</Text>
-			<Text style={[styles.token, { color: color.TEXT }]}>
-				{t('backup', { ns: NS.topNav })}: {token.substring(0, 25)}...
-			</Text>
-			{mint &&
-				<Text style={[styles.token, { color: color.TEXT }]}>
-					Mint: {formatMintUrl(mint)}
-				</Text>
-			}
-			<ActionButtons
-				absolutePos
-				topBtnTxt={t('share')}
-				topBtnAction={() => void share(token, `cashu://${token}`)}
-				bottomBtnTxt={copied ? t('copied') : t('copyToken')}
-				bottomBtnAction={() => void copy(token)}
-			/>
+			<View style={styles.container}>
+				<Txt
+					txt={t('backupQ')}
+					bold
+					styles={[styles.header]}
+				/>
+				<Txt
+					txt={t('backupHint')}
+					styles={[styles.header, { color: color.TEXT_SECONDARY, marginBottom: !mint ? 0 : vs(10) }]}
+				/>
+				{!mint &&
+					<Txt
+						txt={t('singleBackupHint')}
+						styles={[styles.header, { color: mainColors.WARN }]}
+					/>
+				}
+				{mint &&
+					<Txt bold txt={`Mint: ${formatMintUrl(mint)}`} />
+				}
+				<TouchableOpacity
+					style={[styles.tokenWrap, { backgroundColor: color.INPUT_BG }]}
+					onPress={() => void handleCopy()}
+				>
+					<View style={styles.backupTxtWrap}>
+						<FlagIcon color={color.TEXT} />
+						<Txt txt={`${token.substring(0, 20)}...`} bold styles={[{ marginLeft: s(10) }]} />
+					</View>
+					{copied ? <CheckmarkIcon color={mainColors.VALID} /> : <CopyIcon color={color.TEXT} />}
+				</TouchableOpacity>
+			</View>
+			<View style={styles.action}>
+				<Button
+					outlined
+					txt={t('share')}
+					onPress={() => void share(token, `cashu://${token}`)}
+					icon={<ShareIcon width={20} height={20} color={hi[highlight]} />}
+				/>
+			</View>
 		</>
 	)
 }
 
 const styles = ScaledSheet.create({
-	subTxt: {
-		marginTop: '20@vs',
+	container: {
+		flex: 1,
 		paddingHorizontal: '20@s',
 	},
-	token: {
-		marginTop: '20@vs',
-		fontSize: '14@vs',
-		paddingHorizontal: '20@s',
+	header: {
+		marginBottom: '10@vs',
+	},
+	tokenWrap: {
+		paddingVertical: '15@vs',
+		paddingHorizontal: '10@s',
+		borderRadius: '5@s',
+		marginVertical: '5@vs',
+		flexDirection: 'row',
+		alignItems: 'center',
+		justifyContent: 'space-between',
+	},
+	backupTxtWrap: {
+		flexDirection: 'row',
+		alignItems: 'center',
 	},
+	action: {
+		padding: '20@s',
+	}
 })

src/components/Balance.tsx

@@ -159,8 +159,8 @@ function HistoryEntry({ icon, txType, isSwap, timestamp, amount, onPress }: IHis
 					{icon}
 				</View>
 				<View>
-					<Txt txt={txType} styles={[{ color: getColor(highlight, color) }]} />
-					<Text style={{ color: getColor(highlight, color), paddingBottom: vs(3), fontSize: vs(12) }}>
+					<Txt txt={txType} styles={[{ color: getColor(highlight, color), marginBottom: vs(2) }]} />
+					<Text style={{ color: getColor(highlight, color), fontSize: vs(12) }}>
 						<EntryTime from={timestamp * 1000} fallback={t('justNow')} />
 					</Text>
 				</View>
@@ -175,13 +175,14 @@ const styles = ScaledSheet.create({
 		borderBottomLeftRadius: 50,
 		borderBottomRightRadius: 50,
 		paddingHorizontal: '30@s',
-		paddingVertical: '60@vs',
+		paddingTop: '40@vs',
+		paddingBottom: '50@vs',
 		minHeight: '50%'
 	},
 	balanceWrap: {
 		alignItems: 'center',
 		marginHorizontal: '-20@s',
-		marginBottom: '10@vs',
+		marginBottom: '5@vs',
 	},
 	balAmount: {
 		alignItems: 'center',
@@ -205,7 +206,7 @@ const styles = ScaledSheet.create({
 		flexDirection: 'row',
 		alignItems: 'center',
 		justifyContent: 'space-between',
-		paddingBottom: '5@vs',
+		paddingBottom: '6@vs',
 	},
 	wrap: {
 		flexDirection: 'row',

src/components/Button.tsx

@@ -28,10 +28,10 @@ export default function Button({ txt, onPress, border, outlined, filled, disable
 				disabled={disabled}
 				style={[
 					styles.touchableOpacity,
-					{ backgroundColor: hi[highlight], paddingHorizontal: s(18), paddingVertical: vs(18) },
+					{ backgroundColor: hi[highlight], paddingHorizontal: vs(18), paddingVertical: vs(18) },
 					border ? { borderWidth: 1, borderColor: mainColors.WHITE } : {},
 					filled ? { backgroundColor: mainColors.WHITE } : {},
-					outlined ? { backgroundColor: 'transparent', paddingHorizontal: s(16), paddingVertical: vs(16), borderWidth: 1, borderColor: hi[highlight] } : {},
+					outlined ? { backgroundColor: 'transparent', paddingHorizontal: vs(18), paddingVertical: vs(18), borderWidth: 1, borderColor: hi[highlight] } : {},
 					disabled ? { opacity: .3 } : {}
 				]}
 				onPress={onPress}

src/components/Icons.tsx

@@ -553,6 +553,36 @@ export function ImageIcon({ width, height, color }: TIconProps) {
 		</Svg>
 	)
 }
+export function DownloadIcon({ width, height, color }: TIconProps) {
+	return (
+		<Svg width={width || 24} height={height || 24} viewBox="0 0 24 24" fill="none">
+			<Path d="M11.375 3.5C9.03603 3.5 7.08074 5.14772 6.60867 7.3461L6.55282 7.60622L6.30587 7.70522C5.24663 8.12985 4.5 9.16584 4.5 10.375C4.5 11.9628 5.78718 13.25 7.375 13.25C7.92278 13.25 8.43337 13.0973 8.86823 12.8324L9.09569 12.6938L9.33758 12.8053C9.70275 12.9735 10.0924 13.098 10.5 13.1718V14.1852C10.0323 14.1153 9.58224 13.9902 9.15697 13.8167C8.62312 14.0936 8.01674 14.25 7.375 14.25C5.2349 14.25 3.5 12.5151 3.5 10.375C3.5 8.83769 4.39506 7.51051 5.69093 6.88423C6.3509 4.36158 8.64501 2.5 11.375 2.5C13.1366 2.5 14.7174 3.27587 15.7935 4.50286C18.4079 4.59165 20.5 6.739 20.5 9.375C20.5 12.0674 18.3174 14.25 15.625 14.25C14.9048 14.25 14.22 14.0935 13.6037 13.8124C13.5693 13.8265 13.5347 13.8403 13.5 13.8538V12.765L13.6287 12.706L13.8455 12.8182C14.3778 13.094 14.9825 13.25 15.625 13.25C17.7651 13.25 19.5 11.5151 19.5 9.375C19.5 7.2349 17.7651 5.5 15.625 5.5C15.6054 5.5 15.5859 5.50015 15.5663 5.50043L15.3229 5.50404L15.1699 5.31463C14.2755 4.20699 12.908 3.5 11.375 3.5Z" fill={color} />
+			<Path d="M12.5001 9.5V19.7928L14.6251 17.6679L15.3322 18.375L12.0001 21.7071L8.66797 18.375L9.37508 17.6679L11.5001 19.7929V9.5H12.5001Z" fill={color} />
+		</Svg>
+
+	)
+}
+export function AppleIcon({ width, height, color }: TIconProps) {
+	return (
+		<Svg width={width || 24} height={height || 24} viewBox="0 0 24 24" fill="none">
+			<Path d="M15.5 21C16.189 21 17.383 19.542 18.87 16.639C17.635 15.604 17 14.384 17 13C17 11.644 17.609 10.445 18.797 9.424C17.963 8.464 17.037 8 16 8C14.906 8 14.059 8.149 13.459 8.437C12.82 8.744 12.081 8.765 11.425 8.495C10.629 8.167 9.654 8 8.5 8C6.434 8 5 10.086 5 13C5 15.711 7.833 21 9 21C9.429 21 9.918 20.842 10.466 20.514C11.652 19.804 13.14 19.836 14.294 20.595C14.71 20.868 15.109 21 15.5 21ZM19.8 16.1C19.993 16.245 20.056 16.508 19.947 16.724C18.187 20.246 16.783 22 15.5 22C14.903 22 14.316 21.807 13.744 21.431C12.911 20.882 11.836 20.859 10.98 21.371C10.287 21.786 9.627 22 9 22C7.113 22 4 16.189 4 13C4 9.596 5.785 7 8.5 7C9.777 7 10.88 7.188 11.806 7.57C12.199 7.732 12.643 7.72 13.026 7.536C13.778 7.175 14.769 7 16 7C17.502 7 18.811 7.748 19.9 9.2C20.065 9.421 20.021 9.734 19.8 9.9C18.585 10.811 18 11.835 18 13C18 14.165 18.585 15.189 19.8 16.1ZM12.4995 6C12.2235 6 11.9995 5.776 11.9995 5.5C11.9995 3.567 13.5675 2 15.4995 2C15.7765 2 15.9995 2.224 15.9995 2.5C15.9995 4.433 14.4325 6 12.4995 6ZM14.9365 3.064C14.0075 3.278 13.2775 4.008 13.0635 4.936C13.9925 4.722 14.7225 3.992 14.9365 3.064Z" fill={color} />
+		</Svg>
+	)
+}
+export function VerifiedFilledIcon({ width, height, color }: TIconProps) {
+	return (
+		<Svg width={width || 24} height={height || 24} viewBox="0 0 24 24" fill="none">
+			<Path d="M19.965 8.521C19.988 8.347 20 8.173 20 8C20 5.621 17.857 3.712 15.479 4.035C14.786 2.802 13.466 2 12 2C10.534 2 9.214 2.802 8.521 4.035C6.138 3.712 4 5.621 4 8C4 8.173 4.012 8.347 4.035 8.521C2.802 9.215 2 10.535 2 12C2 13.465 2.802 14.785 4.035 15.479C4.01193 15.6517 4.00024 15.8258 4 16C4 18.379 6.138 20.283 8.521 19.965C9.214 21.198 10.534 22 12 22C13.466 22 14.786 21.198 15.479 19.965C17.857 20.283 20 18.379 20 16C20 15.827 19.988 15.653 19.965 15.479C21.198 14.785 22 13.465 22 12C22 10.535 21.198 9.215 19.965 8.521ZM10.955 16.416L7.288 12.702L8.712 11.298L10.969 13.584L15.296 9.29L16.704 10.71L10.955 16.416Z" fill={color} />
+		</Svg>
+	)
+}
+export function ReleaseTagIcon({ width, height, color }: TIconProps) {
+	return (
+		<Svg width={width || 24} height={height || 24} viewBox="0 0 24 24" fill="none">
+			<Path d="M3 5.5C3 4.11929 4.11929 3 5.5 3H11.5C11.6326 3 11.7598 3.05268 11.8536 3.14645L20.1565 11.4494C21.289 12.5819 21.289 14.4181 20.1565 15.5506L15.5506 20.1565C14.4181 21.289 12.5819 21.289 11.4494 20.1565L3.14645 11.8536C3.05268 11.7598 3 11.6326 3 11.5V5.5ZM11.2929 4H5.5C4.67157 4 4 4.67157 4 5.5V11.2929L12.1565 19.4494C12.8985 20.1914 14.1015 20.1914 14.8435 19.4494L19.4494 14.8435C20.1914 14.1015 20.1914 12.8985 19.4494 12.1565L11.2929 4ZM8 7C7.44772 7 7 7.44772 7 8C7 8.55228 7.44772 9 8 9C8.55228 9 9 8.55228 9 8C9 7.44772 8.55228 7 8 7ZM8 6C9.10457 6 10 6.89543 10 8C10 9.10457 9.10457 10 8 10C6.89543 10 6 9.10457 6 8C6 6.89543 6.89543 6 8 6Z" fill={color} />
+		</Svg>
+	)
+}
 const styles = StyleSheet.create({
 	nostrIcon: {
 		marginLeft: -5

src/components/Logo.tsx

@@ -1,3 +1,4 @@
+import { useThemeContext } from '@src/context/Theme'
 import { Image, type ImageStyle, type StyleProp, StyleSheet, View } from 'react-native'
 
 interface ILogoProps {
@@ -7,8 +8,15 @@ interface ILogoProps {
 }
 
 export default function Logo({ size, success, style }: ILogoProps) {
+	const { highlight, theme } = useThemeContext()
 	// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
-	const src = success ? require('@assets/icon_transparent_success.png') : require('@assets/icon_transparent.png')
+	const src = success ?
+		require('@assets/icon_transparent_success.png')
+		:
+		theme === 'Dark' && (highlight === 'Zap' || highlight === 'Azyre' || highlight === 'Rosy') ?
+			require('@assets/icon_transparent_dark.png')
+			:
+			require('@assets/icon_transparent.png')
 	return (
 		<View style={styles.imgWrap}>
 			<Image