Fixes #133

cashubtc · Aug 19, 2023 · fd29dc0 · fd29dc0
1 parent 9e721f8
commit fd29dc0
Show file tree

Hide file tree

Showing 3 changed files with 93 additions and 30 deletions.
diff --git a/src/components/InputAndLabel.tsx b/src/components/InputAndLabel.tsx
@@ -0,0 +1,60 @@
+import { useThemeContext } from '@src/context/Theme'
+import { useTranslation } from 'react-i18next'
+import { type KeyboardTypeOptions, StyleSheet, View } from 'react-native'
+
+import { TxtButton } from './Button'
+import TxtInput from './TxtInput'
+
+interface IInputAndLabelProps {
+	keyboardType?: KeyboardTypeOptions
+	placeholder: string
+	setInput: (txt: string) => void
+	value: string
+	handleInput: () => void
+	handleLabel: () => void
+	isEmptyInput?: boolean
+}
+
+export default function InputAndLabel({
+	keyboardType,
+	placeholder,
+	setInput,
+	value,
+	handleInput,
+	handleLabel,
+	isEmptyInput
+}: IInputAndLabelProps) {
+	const { t } = useTranslation()
+	const { color } = useThemeContext()
+	return (
+		<View style={styles.wrap}>
+			<TxtInput
+				keyboardType={keyboardType}
+				placeholder={placeholder}
+				value={value}
+				onChangeText={setInput}
+				onSubmitEditing={handleInput}
+			/>
+			{/* Paste / Clear Input */}
+			<TxtButton
+				txt={t(isEmptyInput ? 'paste' : 'clear')}
+				onPress={handleLabel}
+				style={[styles.pasteInputTxtWrap, { backgroundColor: color.INPUT_BG }]}
+			/>
+		</View>
+	)
+}
+
+const styles = StyleSheet.create({
+	wrap: {
+		position: 'relative',
+		width: '100%'
+	},
+	pasteInputTxtWrap: {
+		position: 'absolute',
+		right: 10,
+		top: 10,
+		paddingTop: 10,
+		marginHorizontal: 10
+	},
+})
diff --git a/src/screens/Addressbook/index.tsx b/src/screens/Addressbook/index.tsx
@@ -1,7 +1,7 @@
 import Button, { TxtButton } from '@comps/Button'
+import InputAndLabel from '@comps/InputAndLabel'
 import MyModal from '@comps/modal'
 import Separator from '@comps/Separator'
-import TxtInput from '@comps/TxtInput'
 import { isIOS } from '@consts'
 import { getMintsBalances } from '@db'
 import { l } from '@log'
@@ -177,7 +177,7 @@ export default function AddressbookPage({ navigation, route }: TAddressBookPageP
 	// Paste/Clear input for LNURL/LN invoice
 	const handleInputLabelPress = async () => {
 		// clear input
-		if (pubKey.encoded.length > 0) {
+		if (pubKey.encoded.length) {
 			setPubKey({ encoded: '', hex: '' })
 			return
 		}
@@ -355,20 +355,14 @@ export default function AddressbookPage({ navigation, route }: TAddressBookPageP
 				<Text style={globals(color).modalHeader}>
 					{t('yourProfile', { ns: NS.addrBook })}
 				</Text>
-				<View style={{ position: 'relative', width: '100%' }}>
-					<TxtInput
-						placeholder='NPUB/HEX'
-						onChangeText={text => setPubKey(prev => ({ ...prev, encoded: text }))}
-						value={pubKey.encoded}
-						onSubmitEditing={() => void handleNewNpub()}
-					/>
-					{/* Paste / Clear Input */}
-					<TxtButton
-						txt={!pubKey.encoded.length ? t('paste') : t('clear')}
-						onPress={() => void handleInputLabelPress()}
-						style={[styles.pasteInputTxtWrap, { backgroundColor: color.INPUT_BG }]}
-					/>
-				</View>
+				<InputAndLabel
+					placeholder='NPUB/HEX'
+					setInput={text => setPubKey(prev => ({ ...prev, encoded: text }))}
+					value={pubKey.encoded}
+					handleInput={() => void handleNewNpub()}
+					handleLabel={() => void handleInputLabelPress()}
+					isEmptyInput={pubKey.encoded.length < 1}
+				/>
 				<Button
 					txt={t('save')}
 					onPress={() => void handleNewNpub()}
@@ -416,12 +410,6 @@ const styles = StyleSheet.create({
 		marginTop: 25,
 		marginBottom: 10
 	},
-	pasteInputTxtWrap: {
-		position: 'absolute',
-		right: 10,
-		top: 10,
-		padding: 10
-	},
 	contactsWrap: {
 		flex: 1,
 		paddingHorizontal: 0,

diff --git a/src/screens/Mints/index.tsx b/src/screens/Mints/index.tsx
@@ -1,9 +1,9 @@
 import ActionButtons from '@comps/ActionButtons'
 import Button, { IconBtn } from '@comps/Button'
 import { CheckCircleIcon, ChevronRightIcon, MintBoardIcon, PlusIcon, ZapIcon } from '@comps/Icons'
+import InputAndLabel from '@comps/InputAndLabel'
 import Separator from '@comps/Separator'
 import Txt from '@comps/Txt'
-import TxtInput from '@comps/TxtInput'
 import { _testmintUrl, defaultMints, isIOS } from '@consts'
 import { addMint, getMintsBalances, getMintsUrls } from '@db'
 import { l } from '@log'
@@ -18,7 +18,7 @@ import { useThemeContext } from '@src/context/Theme'
 import { NS } from '@src/i18n'
 import { getCustomMintNames, getDefaultMint } from '@store/mintStore'
 import { globals, highlight as hi, mainColors } from '@styles'
-import { formatInt, formatMintUrl, isErr, isUrl } from '@util'
+import { formatInt, formatMintUrl, getStrFromClipboard, isErr, isUrl } from '@util'
 import { useEffect, useState } from 'react'
 import { useTranslation } from 'react-i18next'
 import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'
@@ -52,19 +52,21 @@ export default function Mints({ navigation }: TMintsPageProps) {
 
 	// adds a mint via input
 	const handleMintInput = async () => {
-		if (!isUrl(input)) {
+		// Allow user to submit URL without "https://" and add it ourself if not available
+		const submitted = input.startsWith('https://') ? input : `https://${input}`
+		if (!isUrl(submitted)) {
 			openPromptAutoClose({ msg: t('invalidUrl', { ns: NS.mints }), ms: 1500 })
 			return
 		}
 		try {
 			// check if mint is already in db
 			const mints = await getMintsUrls(true)
-			if (mints.some(m => m.mintUrl === input)) {
+			if (mints.some(m => m.mintUrl === submitted)) {
 				openPromptAutoClose({ msg: t('mntAlreadyAdded', { ns: NS.mints }), ms: 1500 })
 				return
 			}
 			// add mint url to db
-			await addMint(input)
+			await addMint(submitted)
 		} catch (e) {
 			openPromptAutoClose({ msg: isErr(e) ? e.message : t('mintConnectionFail', { ns: NS.mints }), ms: 2000 })
 			return
@@ -114,6 +116,16 @@ export default function Mints({ navigation }: TMintsPageProps) {
 		setUserMints(await getCustomMintNames(mintsBal))
 	}
 
+	const handleInputLabelPress = async () => {
+		if (input.length) {
+			setInput('')
+			return
+		}
+		const clipboard = await getStrFromClipboard()
+		setInput(clipboard ?? '')
+		await handleMintInput()
+	}
+
 	// Show user mints with balances and default mint icon
 	useEffect(() => {
 		void (async () => {
@@ -206,11 +218,14 @@ export default function Mints({ navigation }: TMintsPageProps) {
 				<Text style={globals(color).modalHeader}>
 					{t('addNewMint', { ns: NS.mints })}
 				</Text>
-				<TxtInput
+				<InputAndLabel
 					keyboardType='url'
 					placeholder='Mint URL'
-					onChangeText={setInput}
-					onSubmitEditing={() => { void handleMintInput() }}
+					setInput={text => setInput(text)}
+					handleInput={() => void handleMintInput()}
+					value={input}
+					handleLabel={() => void handleInputLabelPress()}
+					isEmptyInput={input.length < 1}
 				/>
 				<Button
 					txt={t('addMintBtn', { ns: NS.mints })}