diff --git a/.vscode/settings.json b/.vscode/settings.json index e70c45bce..a73ba2544 100644 --- a/.vscode/settings.json +++ b/.vscode/settings.json @@ -9,5 +9,6 @@ "prettier.bracketSameLine": true, "prettier.arrowParens": "avoid", "javascript.updateImportsOnFileMove.enabled": "always", - "typescript.updateImportsOnFileMove.enabled": "always" + "typescript.updateImportsOnFileMove.enabled": "always", + "java.configuration.updateBuildConfiguration": "disabled" } diff --git a/App.tsx b/App.tsx index f038b929d..ee7376c61 100644 --- a/App.tsx +++ b/App.tsx @@ -1,4 +1,3 @@ -import * as Sentry from '@sentry/react-native'; import { LogBox, Platform, UIManager } from 'react-native'; import React, { ReactElement, useEffect } from 'react'; import { GestureHandlerRootView } from 'react-native-gesture-handler'; @@ -16,6 +15,7 @@ import { customTheme } from './src/navigation/themes'; import Navigator from './src/navigation/Navigator'; import { persistor, store } from './src/store/store'; import NotificationHandler from 'src/hooks/useNotificationHandler'; +import { SentryWrapper } from 'src/services/sentry'; LogBox.ignoreLogs([ "[react-native-gesture-handler] Seems like you're using an old API with gesture components, check out new Gestures system!", @@ -74,6 +74,6 @@ function AppWrapper() { ); } -const SentryApp = Sentry.wrap(AppWrapper); +const SentryApp = SentryWrapper(AppWrapper); export default withIAPContext(SentryApp); diff --git a/android/app/build.gradle b/android/app/build.gradle index 94c1977e8..6787c2242 100644 --- a/android/app/build.gradle +++ b/android/app/build.gradle @@ -86,8 +86,8 @@ android { applicationId "io.hexawallet.keeper" minSdkVersion rootProject.ext.minSdkVersion targetSdkVersion rootProject.ext.targetSdkVersion - versionCode 421 - versionName "1.2.20" + versionCode 428 + versionName "1.3.0" missingDimensionStrategy 'react-native-camera', 'general' missingDimensionStrategy 'store', 'play' multiDexEnabled true diff --git a/android/app/src/development/res/values/strings.xml b/android/app/src/development/res/values/strings.xml index f5f603995..129863658 100644 --- a/android/app/src/development/res/values/strings.xml +++ b/android/app/src/development/res/values/strings.xml @@ -1,4 +1,5 @@ Keeper keeperdev + /app/dev diff --git a/android/app/src/main/AndroidManifest.xml b/android/app/src/main/AndroidManifest.xml index ca4b197f2..a5aff960c 100644 --- a/android/app/src/main/AndroidManifest.xml +++ b/android/app/src/main/AndroidManifest.xml @@ -64,7 +64,7 @@ - + diff --git a/android/app/src/main/res/values/strings.xml b/android/app/src/main/res/values/strings.xml index 2531426ef..605276a5e 100644 --- a/android/app/src/main/res/values/strings.xml +++ b/android/app/src/main/res/values/strings.xml @@ -3,4 +3,5 @@ keeper Backup with Keeper aiddescription + /app/prod diff --git a/index.js b/index.js index ffe148ea8..3fd5bc308 100644 --- a/index.js +++ b/index.js @@ -10,7 +10,9 @@ import { Text, Input } from 'native-base'; import App from './App'; import { name as appName } from './app.json'; import { enableAndroidFontFix } from './AndroidFontFix'; +import { initSentrySDK } from 'src/services/sentry'; +initSentrySDK(); enableAndroidFontFix(); Text.defaultProps = Text.defaultProps || {}; diff --git a/ios/hexa_keeper.xcodeproj/project.pbxproj b/ios/hexa_keeper.xcodeproj/project.pbxproj index 9662128d7..48aa4ad4d 100644 --- a/ios/hexa_keeper.xcodeproj/project.pbxproj +++ b/ios/hexa_keeper.xcodeproj/project.pbxproj @@ -791,7 +791,7 @@ CODE_SIGN_ENTITLEMENTS = hexa_keeper/hexa_keeper.entitlements; CODE_SIGN_IDENTITY = "Apple Development"; CODE_SIGN_STYLE = Automatic; - CURRENT_PROJECT_VERSION = 421; + CURRENT_PROJECT_VERSION = 428; DEVELOPMENT_TEAM = Y5TCB759QL; ENABLE_BITCODE = NO; HEADER_SEARCH_PATHS = ( @@ -892,7 +892,7 @@ "$(inherited)", "\"$(SRCROOT)\"", ); - MARKETING_VERSION = 1.2.20; + MARKETING_VERSION = 1.3.0; OTHER_LDFLAGS = ( "$(inherited)", "-ObjC", @@ -916,7 +916,7 @@ CLANG_ENABLE_MODULES = YES; CODE_SIGN_ENTITLEMENTS = hexa_keeper/hexa_keeper.entitlements; CODE_SIGN_IDENTITY = "Apple Distribution: Bithyve UK Ltd (Y5TCB759QL)"; - CURRENT_PROJECT_VERSION = 421; + CURRENT_PROJECT_VERSION = 428; DEVELOPMENT_TEAM = Y5TCB759QL; "DEVELOPMENT_TEAM[sdk=iphoneos*]" = Y5TCB759QL; HEADER_SEARCH_PATHS = ( @@ -1017,7 +1017,7 @@ "$(inherited)", "\"$(SRCROOT)\"", ); - MARKETING_VERSION = 1.2.20; + MARKETING_VERSION = 1.3.0; OTHER_LDFLAGS = ( "$(inherited)", "-ObjC", @@ -1172,7 +1172,7 @@ CODE_SIGN_ENTITLEMENTS = hexa_keeper_dev.entitlements; CODE_SIGN_IDENTITY = "Apple Development"; CODE_SIGN_STYLE = Automatic; - CURRENT_PROJECT_VERSION = 421; + CURRENT_PROJECT_VERSION = 428; DEVELOPMENT_TEAM = Y5TCB759QL; ENABLE_BITCODE = NO; HEADER_SEARCH_PATHS = ( @@ -1274,7 +1274,7 @@ "$(PROJECT_DIR)", "\"$(SRCROOT)\"", ); - MARKETING_VERSION = 1.2.20; + MARKETING_VERSION = 1.3.0; OTHER_LDFLAGS = ( "$(inherited)", "-ObjC", @@ -1300,7 +1300,7 @@ CODE_SIGN_ENTITLEMENTS = hexa_keeper_dev.entitlements; CODE_SIGN_IDENTITY = "Apple Distribution"; "CODE_SIGN_IDENTITY[sdk=iphoneos*]" = "iPhone Distribution"; - CURRENT_PROJECT_VERSION = 421; + CURRENT_PROJECT_VERSION = 428; DEVELOPMENT_TEAM = Y5TCB759QL; "DEVELOPMENT_TEAM[sdk=iphoneos*]" = Y5TCB759QL; HEADER_SEARCH_PATHS = ( @@ -1402,7 +1402,7 @@ "$(PROJECT_DIR)", "\"$(SRCROOT)\"", ); - MARKETING_VERSION = 1.2.20; + MARKETING_VERSION = 1.3.0; OTHER_LDFLAGS = ( "$(inherited)", "-ObjC", diff --git a/ios/hexa_keeper/Info.plist b/ios/hexa_keeper/Info.plist index b65cded97..158536b82 100644 --- a/ios/hexa_keeper/Info.plist +++ b/ios/hexa_keeper/Info.plist @@ -36,7 +36,7 @@ CFBundleVersion - 421 + 428 LSRequiresIPhoneOS NFCReaderUsageDescription diff --git a/ios/hexa_keeperTests/Info.plist b/ios/hexa_keeperTests/Info.plist index 4dbcab613..5b06d92b3 100644 --- a/ios/hexa_keeperTests/Info.plist +++ b/ios/hexa_keeperTests/Info.plist @@ -19,6 +19,6 @@ CFBundleSignature ???? CFBundleVersion - 421 + 428 diff --git a/ios/hexa_keeper_dev-Info.plist b/ios/hexa_keeper_dev-Info.plist index 02a7dfc4c..3b3e74b19 100644 --- a/ios/hexa_keeper_dev-Info.plist +++ b/ios/hexa_keeper_dev-Info.plist @@ -36,7 +36,7 @@ CFBundleVersion - 421 + 428 LSRequiresIPhoneOS NFCReaderUsageDescription diff --git a/package.json b/package.json index 0c4c63705..86a804368 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "hexa_keeper", - "version": "1.2.20", + "version": "1.3.0", "private": true, "scripts": { "ios": "react-native run-ios", @@ -24,27 +24,23 @@ "release ios prod": "cd ios && ENVFILE=.env.production bundle exec fastlane live --env production" }, "dependencies": { + "@bitcoinerlab/miniscript": "1.4.0", "@ngraveio/bc-ur": "1.1.6", "@noble/secp256k1": "1.6.3", "@react-native-community/clipboard": "1.5.1", "@react-native-firebase/app": "14.11.1", "@react-native-firebase/messaging": "14.11.1", - "@react-navigation/bottom-tabs": "6.5.7", - "@react-navigation/drawer": "6.6.6", "@react-navigation/native": "6.0.8", "@react-navigation/native-stack": "6.5.0", "@realm/react": "0.5.2", - "@redux-devtools/extension": "3.2.2", "@reduxjs/toolkit": "1.8.2", "@sentry/react-native": "5.33.1", - "@shipt/segmented-arc-for-react-native": "^1.0.1", + "@shipt/segmented-arc-for-react-native": "1.2.1", "@testing-library/react-native": "11.0.0", - "@types/crypto-js": "4.1.1", "assert": "2.0.0", "axios": "1.6.8", - "base58check": "^2.0.0", + "base58check": "2.0.0", "bip21": "2.0.3", - "bip32-path": "0.4.2", "bip39": "3.0.4", "bitcoinjs-lib": "6.1.5", "bitcoinjs-message": "2.2.0", @@ -57,7 +53,7 @@ "crypto-js": "4.2.0", "deprecated-react-native-prop-types": "4.2.1", "ecpair": "2.0.1", - "electrum-client": "git+https://github.com/bithyve/rn-electrum-client.git", + "electrum-client": "git+https://github.com/bithyve/rn-electrum-client.git#76c0ea35e1a50c47f3a7f818d529ebd100161496", "events": "1.0.0", "idx": "2.5.6", "lodash": "4.17.21", @@ -75,20 +71,20 @@ "react-native-blob-util": "0.18.3", "react-native-camera": "4.2.1", "react-native-config": "1.4.6", - "react-native-contacts": "^7.0.8", + "react-native-contacts": "7.0.8", "react-native-crypto": "2.2.0", "react-native-device-info": "10.0.2", "react-native-document-picker": "8.2.2", "react-native-fs": "2.20.0", "react-native-gesture-handler": "2.14.0", "react-native-get-random-values": "1.8.0", - "react-native-gifted-charts": "^1.4.7", + "react-native-gifted-charts": "1.4.15", "react-native-hce": "0.2.0", "react-native-html-to-pdf": "0.12.0", "react-native-iap": "12.15.2", "react-native-image-picker": "4.10.3", "react-native-keychain": "8.1.2", - "react-native-linear-gradient": "^2.8.3", + "react-native-linear-gradient": "2.8.3", "react-native-localize": "2.2.2", "react-native-mmkv": "2.11.0", "react-native-modal": "13.0.1", @@ -99,7 +95,7 @@ "react-native-randombytes": "3.6.1", "react-native-reanimated": "3.6.1", "react-native-responsive-screen": "1.4.2", - "react-native-rsa-native": "^2.0.5", + "react-native-rsa-native": "2.0.5", "react-native-safe-area-context": "4.7.2", "react-native-screens": "3.25.0", "react-native-send-intent": "1.3.0", @@ -124,45 +120,45 @@ "libportal-react-native": "git+https://github.com/bithyve/libportal-react-native.git#3f9373785265f3e18218eefb8958109feec8f7c3" }, "devDependencies": { - "@babel/core": "^7.20.0", - "@babel/preset-env": "^7.20.0", - "@babel/runtime": "^7.20.0", - "@react-native/eslint-config": "^0.72.2", - "@react-native/metro-config": "^0.72.0", - "@testing-library/jest-native": "^5.3.0", - "@tsconfig/react-native": "^3.0.0", - "@types/jest": "^29.2.1", - "@types/react": "^18.0.24", - "@types/react-native": "^0.66.15", - "@types/react-test-renderer": "^18.0.0", - "@typescript-eslint/eslint-plugin": "^5.15.0", - "@typescript-eslint/parser": "^5.15.0", - "babel-jest": "^29.2.1", - "babel-plugin-module-resolver": "^4.1.0", - "babel-plugin-transform-remove-console": "^6.9.4", - "eslint": "^8.19.0", - "eslint-config-airbnb": "^19.0.4", - "eslint-config-prettier": "^8.5.0", - "eslint-import-resolver-typescript": "^3.5.2", - "eslint-plugin-import": "^2.25.4", - "eslint-plugin-jsx-a11y": "^6.5.1", - "eslint-plugin-react": "^7.29.4", - "eslint-plugin-react-hooks": "^4.3.0", - "eslint-plugin-react-native": "^4.0.0", - "husky": "^8.0.2", - "jest": "^29.2.1", - "lint-staged": "^13.0.4", - "metro-react-native-babel-preset": "^0.76.5", - "prettier": "^2.4.1", - "react-native-codegen": "^0.70.7", - "react-native-svg-transformer": "^1.1.0", - "react-test-renderer": "18.2.0", - "redux-mock-store": "^1.5.4", - "rn-nodeify": "github:tradle/rn-nodeify", + "@babel/core": "7.26.0", + "@babel/preset-env": "7.26.0", + "@babel/runtime": "7.26.0", + "@react-native/eslint-config": "0.72.2", + "@react-native/metro-config": "0.72.12", + "@testing-library/jest-native": "5.4.3", + "@tsconfig/react-native": "3.0.5", + "@types/jest": "29.5.14", + "@types/react": "18.3.12", + "@types/react-native": "0.66.34", + "@types/react-test-renderer": "18.3.0", + "@typescript-eslint/eslint-plugin": "5.62.0", + "@typescript-eslint/parser": "5.62.0", + "babel-jest": "29.7.0", + "babel-plugin-module-resolver": "4.1.0", + "babel-plugin-transform-remove-console": "6.9.4", + "eslint": "8.57.1", + "eslint-config-airbnb": "19.0.4", + "eslint-config-prettier": "8.10.0", + "eslint-import-resolver-typescript": "3.6.3", + "eslint-plugin-import": "2.31.0", + "eslint-plugin-jsx-a11y": "6.10.2", + "eslint-plugin-react": "7.37.2", + "eslint-plugin-react-hooks": "4.6.2", + "eslint-plugin-react-native": "4.1.0", + "husky": "8.0.3", + "jest": "29.7.0", + "lint-staged": "13.3.0", + "metro-react-native-babel-preset": "0.76.9", + "prettier": "2.8.8", + "react-native-codegen": "0.70.7", + "react-native-svg-transformer": "1.5.0", + "react-test-renderer": "18.3.0", + "redux-mock-store": "1.5.5", + "rn-nodeify": "github:tradle/rn-nodeify#338d8d6ba8438403093e9409e9a9d88ad884926f", "typescript": "4.8.4" }, "resolutions": { - "@types/react": "^17" + "@types/react": "18.3.12" }, "react-native": { "crypto": "react-native-crypto", diff --git a/src/assets/images/add-circle-light.svg b/src/assets/images/add-circle-light.svg new file mode 100644 index 000000000..bcb98a3b7 --- /dev/null +++ b/src/assets/images/add-circle-light.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/assisted-vault-disabled-icon.svg b/src/assets/images/assisted-vault-disabled-icon.svg new file mode 100644 index 000000000..adb954389 --- /dev/null +++ b/src/assets/images/assisted-vault-disabled-icon.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/assets/images/assisted-vault-hexa.svg b/src/assets/images/assisted-vault-hexa.svg new file mode 100644 index 000000000..4c1ef171a --- /dev/null +++ b/src/assets/images/assisted-vault-hexa.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/assisted-vault-icon.svg b/src/assets/images/assisted-vault-icon.svg new file mode 100644 index 000000000..49dc74220 --- /dev/null +++ b/src/assets/images/assisted-vault-icon.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/assets/images/assisted-vault-white-icon.svg b/src/assets/images/assisted-vault-white-icon.svg new file mode 100644 index 000000000..13616bb6b --- /dev/null +++ b/src/assets/images/assisted-vault-white-icon.svg @@ -0,0 +1,12 @@ + + + + + + + + + + + + diff --git a/src/assets/images/bell-white-icon.svg b/src/assets/images/bell-white-icon.svg new file mode 100644 index 000000000..178dd51c7 --- /dev/null +++ b/src/assets/images/bell-white-icon.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/assets/images/calendar-disabled.svg b/src/assets/images/calendar-disabled.svg new file mode 100644 index 000000000..5c36d55ea --- /dev/null +++ b/src/assets/images/calendar-disabled.svg @@ -0,0 +1,8 @@ + + + + + + + + diff --git a/src/assets/images/change-arrow-light.svg b/src/assets/images/change-arrow-light.svg new file mode 100644 index 000000000..0a36c0eb4 --- /dev/null +++ b/src/assets/images/change-arrow-light.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/configure-circle.svg b/src/assets/images/configure-circle.svg new file mode 100644 index 000000000..1d4cc7187 --- /dev/null +++ b/src/assets/images/configure-circle.svg @@ -0,0 +1,14 @@ + + + + + + + + + + + + + + diff --git a/src/assets/images/dashed-arrow-center.svg b/src/assets/images/dashed-arrow-center.svg new file mode 100644 index 000000000..0080baaf7 --- /dev/null +++ b/src/assets/images/dashed-arrow-center.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/dashed-arrow-left.svg b/src/assets/images/dashed-arrow-left.svg new file mode 100644 index 000000000..669bdeea7 --- /dev/null +++ b/src/assets/images/dashed-arrow-left.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/dashed-arrow-right.svg b/src/assets/images/dashed-arrow-right.svg new file mode 100644 index 000000000..fc6a2dd08 --- /dev/null +++ b/src/assets/images/dashed-arrow-right.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/iks-horizontal-dark.svg b/src/assets/images/iks-horizontal-dark.svg new file mode 100644 index 000000000..6ec0150f2 --- /dev/null +++ b/src/assets/images/iks-horizontal-dark.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/iks-horizontal-light.svg b/src/assets/images/iks-horizontal-light.svg new file mode 100644 index 000000000..80c1baed9 --- /dev/null +++ b/src/assets/images/iks-horizontal-light.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/iks-timer.svg b/src/assets/images/iks-timer.svg new file mode 100644 index 000000000..3b191fcd8 --- /dev/null +++ b/src/assets/images/iks-timer.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/assets/images/info-icon.svg b/src/assets/images/info-icon.svg new file mode 100644 index 000000000..d0843d210 --- /dev/null +++ b/src/assets/images/info-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/inheritance-key-circle.svg b/src/assets/images/inheritance-key-circle.svg new file mode 100644 index 000000000..a3a276b2e --- /dev/null +++ b/src/assets/images/inheritance-key-circle.svg @@ -0,0 +1,13 @@ + + + + + + + + + + + + + diff --git a/src/assets/images/keeper-name-icon-dark.svg b/src/assets/images/keeper-name-icon-dark.svg new file mode 100644 index 000000000..51f08f0fa --- /dev/null +++ b/src/assets/images/keeper-name-icon-dark.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/assets/images/personalize-circle.svg b/src/assets/images/personalize-circle.svg new file mode 100644 index 000000000..23410f79e --- /dev/null +++ b/src/assets/images/personalize-circle.svg @@ -0,0 +1,15 @@ + + + + + + + + + + + + + + + diff --git a/src/assets/images/remote-share-icon.svg b/src/assets/images/remote-share-icon.svg new file mode 100644 index 000000000..b51f668d9 --- /dev/null +++ b/src/assets/images/remote-share-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/reserve-key-illustration-light.svg b/src/assets/images/reserve-key-illustration-light.svg new file mode 100644 index 000000000..353d6ddbd --- /dev/null +++ b/src/assets/images/reserve-key-illustration-light.svg @@ -0,0 +1,37 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/signer-empty.svg b/src/assets/images/signer-empty.svg new file mode 100644 index 000000000..421473b9a --- /dev/null +++ b/src/assets/images/signer-empty.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/single-key-white-icon.svg b/src/assets/images/single-key-white-icon.svg new file mode 100644 index 000000000..b25dddb5b --- /dev/null +++ b/src/assets/images/single-key-white-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/timer-icon.svg b/src/assets/images/timer-icon.svg new file mode 100644 index 000000000..2cd08c028 --- /dev/null +++ b/src/assets/images/timer-icon.svg @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/timer-outline.svg b/src/assets/images/timer-outline.svg new file mode 100644 index 000000000..920f5aa55 --- /dev/null +++ b/src/assets/images/timer-outline.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/assets/images/upload-icon.svg b/src/assets/images/upload-icon.svg new file mode 100644 index 000000000..02df60838 --- /dev/null +++ b/src/assets/images/upload-icon.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/images/wallet-white-icon.svg b/src/assets/images/wallet-white-icon.svg new file mode 100644 index 000000000..66491b891 --- /dev/null +++ b/src/assets/images/wallet-white-icon.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/components/Carousel/ChoosePlanCarouselItem.tsx b/src/components/Carousel/ChoosePlanCarouselItem.tsx index 89d4946b7..841ca65f7 100644 --- a/src/components/Carousel/ChoosePlanCarouselItem.tsx +++ b/src/components/Carousel/ChoosePlanCarouselItem.tsx @@ -9,6 +9,7 @@ import PlebIcon from 'src/assets/images/pleb_white.svg'; import HodlerIcon from 'src/assets/images/hodler.svg'; import DiamondIcon from 'src/assets/images/diamond_hands.svg'; import PlanCheckMarkSelected from 'src/assets/images/planCheckMarkSelected.svg'; +import { calculateMonthlyCost } from 'src/utils/utilities'; const styles = StyleSheet.create({ wrapperView: { @@ -67,7 +68,8 @@ function ChoosePlanCarouselItem({ const getAmt = useMemo(() => { try { if (item.productType === 'free') return 'Free'; - return item.monthlyPlanDetails.price; + if (isMonthly) return item.monthlyPlanDetails.price; + else return calculateMonthlyCost(item.yearlyPlanDetails.price); } catch (error) { return ''; } diff --git a/src/components/Dropdown.tsx b/src/components/Dropdown.tsx index 846d99410..ba2703177 100644 --- a/src/components/Dropdown.tsx +++ b/src/components/Dropdown.tsx @@ -1,32 +1,53 @@ -import { Box, useColorMode } from 'native-base'; +import { Box, useColorMode, Pressable } from 'native-base'; import { StyleSheet, TouchableOpacity } from 'react-native'; import Text from './KeeperText'; import RightArrowIcon from 'src/assets/images/icon_arrow.svg'; +import TickIcon from 'src/assets/images/icon_check.svg'; import { hp } from 'src/constants/responsive'; -import { useState } from 'react'; +import { useState, useEffect } from 'react'; type Props = { label: string; options: string[]; - onOptionSelect: any; + selectedOption: string | null; + onOptionSelect: (option: string) => void; }; -function Dropdown({ label, options, onOptionSelect }: Props) { +function Dropdown({ label, options, selectedOption, onOptionSelect }: Props) { const { colorMode } = useColorMode(); - const [isOpen, setIsOpen] = useState(false); + const [internalSelectedOption, setInternalSelectedOption] = useState( + selectedOption + ); const handlePress = () => { setIsOpen(!isOpen); }; + const handleOptionSelect = (option: string) => { + setInternalSelectedOption(option); + onOptionSelect(option); + setIsOpen(false); + }; + + useEffect(() => { + if (selectedOption) { + setInternalSelectedOption(selectedOption); + } + }, [selectedOption]); + return ( - + - - {label} + + {internalSelectedOption || label} + - - - {isOpen && ( - - {options.map((option) => ( - { - onOptionSelect(option); - setIsOpen(false); - }} + + {isOpen && ( + + {options.map((option, index) => ( + handleOptionSelect(option)}> + - {option} - - ))} - - )} - + + {option} + + {internalSelectedOption === option && } + + + ))} + + )} ); } @@ -81,8 +109,15 @@ const styles = StyleSheet.create({ gap: 20, }, labelText: { + fontSize: 14, + lineHeight: 24, + letterSpacing: 0.39, + }, + optionText: { fontSize: 13, letterSpacing: 0.39, + paddingBottom: 10, + paddingTop: 5, }, emptyView: { height: hp(23), @@ -95,13 +130,19 @@ const styles = StyleSheet.create({ }, optionsContainer: { width: '95%', - position: 'absolute', alignSelf: 'center', - top: 10, zIndex: 999, - borderRadius: 10, + marginTop: 10, + borderBottomLeftRadius: 10, + borderBottomRightRadius: 10, paddingHorizontal: 20, paddingVertical: 10, gap: 10, }, + optionContainer: { + flexDirection: 'row', + justifyContent: 'space-between', + alignItems: 'center', + borderColor: 'rgba(0, 0, 0, 0.1)', + }, }); diff --git a/src/components/HorizontalAddCard.tsx b/src/components/HorizontalAddCard.tsx new file mode 100644 index 000000000..7089a487c --- /dev/null +++ b/src/components/HorizontalAddCard.tsx @@ -0,0 +1,93 @@ +import React from 'react'; +import { Box, useColorMode } from 'native-base'; +import { ActivityIndicator, StyleSheet, TouchableOpacity, ViewStyle } from 'react-native'; +import AddCardIcon from 'src/assets/images/add_white.svg'; +import Colors from 'src/theme/Colors'; +import { hp, wp } from 'src/constants/responsive'; +import Text from './KeeperText'; +import HexagonIcon from './HexagonIcon'; + +type AddSignerCardProps = { + name: string; + callback?: (param: any) => void; + cardStyles?: ViewStyle; + iconWidth?: number; + iconHeight?: number; + loading?: boolean; + borderColor?: string; + nameColor?: string; + icon?: any; + KeyIcon?: any; + isAddWallet?: boolean; +}; + +function HorizontalAddCard({ + name, + callback, + cardStyles, + iconWidth = 40, + iconHeight = 34, + loading = false, + borderColor, + nameColor, + isAddWallet, + KeyIcon, + icon = , +}: AddSignerCardProps) { + const { colorMode } = useColorMode(); + return ( + callback(name)} + > + + + + {KeyIcon ? : null} + + {name} + + + {loading ? : null} + + + + + ); +} + +const styles = StyleSheet.create({ + AddCardContainer: { + width: '100%', + padding: wp(20), + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'space-between', + borderRadius: 10, + borderWidth: 1.5, + borderStyle: 'dashed', + }, + nameStyle: { + fontSize: 14, + lineHeight: 20, + textAlign: 'left', + }, + detailContainer: { + flexDirection: 'row', + alignItems: 'center', + justifyContent: 'space-between', + width: '100%', + }, +}); + +export default HorizontalAddCard; diff --git a/src/components/KeeperHeader.tsx b/src/components/KeeperHeader.tsx index 5c9255faf..6278b9dc3 100644 --- a/src/components/KeeperHeader.tsx +++ b/src/components/KeeperHeader.tsx @@ -35,15 +35,17 @@ type Props = { topRightComponent?: Element; }; -const BackButton = ({ onPress, colorMode, contrastScreen, styles }: any) => ( - - - {colorMode === 'light' && !contrastScreen ? : } - - -); +function BackButton({ onPress, colorMode, contrastScreen, styles }: any) { + return ( + + + {colorMode === 'light' && !contrastScreen ? : } + + + ); +} -const LearnMoreButton = ({ +function LearnMoreButton({ onPress, learnBackgroundColor, learnTextColor, @@ -51,32 +53,37 @@ const LearnMoreButton = ({ colorMode, common, styles, -}: any) => ( - - - - - {common.learnMore} - - - - -); +}: any) { + return ( + + + + + {common.learnMore} + + + + + ); +} -const HeaderInfo = ({ +function HeaderInfo({ title, subtitle, titleColor, @@ -86,36 +93,38 @@ const HeaderInfo = ({ icon, colorMode, styles, -}: any) => ( - - {icon && icon} - - {title && ( - - {title} - - )} - {subtitle ? ( - - {subtitle} - - ) : ( - - )} +}: any) { + return ( + + {icon && icon} + + {title && ( + + {title} + + )} + {subtitle ? ( + + {subtitle} + + ) : ( + + )} + - -); + ); +} -const KeeperHeader = ({ +function KeeperHeader({ title = '', subtitle = '', titleColor, @@ -139,7 +148,7 @@ const KeeperHeader = ({ headerInfoPadding = 8, simple = false, topRightComponent = null, -}: Props) => { +}: Props) { const { colorMode } = useColorMode(); const navigation = useNavigation(); const { translations } = useContext(LocalizationContext); @@ -182,7 +191,7 @@ const KeeperHeader = ({ {rightComponent ? ( {rightComponent} ) : ( - + )} ); @@ -229,7 +238,7 @@ const KeeperHeader = ({ {availableBalance && {availableBalance}} ); -}; +} const getStyles = ( rightComponentPadding: number | `${number}%`, diff --git a/src/components/KeeperTextInput.tsx b/src/components/KeeperTextInput.tsx index a0fd16e49..9e93625c2 100644 --- a/src/components/KeeperTextInput.tsx +++ b/src/components/KeeperTextInput.tsx @@ -1,8 +1,8 @@ import { StyleSheet } from 'react-native'; import React from 'react'; import { Input, useColorMode, Box } from 'native-base'; -import KeeperText from './KeeperText'; import Colors from 'src/theme/Colors'; +import KeeperText from './KeeperText'; function KeeperTextInput({ placeholder, @@ -30,7 +30,7 @@ function KeeperTextInput({ borderColor={inpuBorderColor || `${colorMode}.greyBorder`} > { +function KeyAddedModal({ visible, close, signer }) { const navigation = useNavigation(); const { colorMode } = useColorMode(); @@ -30,27 +31,33 @@ const KeyAddedModal = ({ visible, close, signer }) => { const { buttonText, buttonCallback, secondaryButtonText, content } = defaultConfig; return ( - ( - - - {content} - - )} - /> + signer && ( + ( + + + {content} + + )} + /> + ) ); -}; +} const styles = StyleSheet.create({ externalKeyModal: { diff --git a/src/components/MessagePreview.tsx b/src/components/MessagePreview.tsx index bed9aa7b6..3934a5a14 100644 --- a/src/components/MessagePreview.tsx +++ b/src/components/MessagePreview.tsx @@ -4,6 +4,7 @@ import { Box, useColorMode } from 'native-base'; import Text from 'src/components/KeeperText'; import KeeperIcon from 'src/assets/images/keeper-icon.svg'; import KeeperNameIcon from 'src/assets/images/keeper-name-icon.svg'; +import KeeperNameIconDark from 'src/assets/images/keeper-name-icon-dark.svg'; import { hp, wp } from 'src/constants/responsive'; type MessagePreviewProps = { @@ -25,7 +26,7 @@ function MessagePreview({ title, description, link }: MessagePreviewProps) { - + {colorMode === 'light' ? : } {link} diff --git a/src/components/OptionDropdown.tsx b/src/components/OptionDropdown.tsx new file mode 100644 index 000000000..e90d848aa --- /dev/null +++ b/src/components/OptionDropdown.tsx @@ -0,0 +1,169 @@ +import { Box, Pressable, useColorMode } from 'native-base'; +import { StyleSheet, TouchableOpacity } from 'react-native'; +import RightArrowIcon from 'src/assets/images/icon_arrow.svg'; +import { hp, wp } from 'src/constants/responsive'; +import { useEffect, useState } from 'react'; +import Text from 'src/components/KeeperText'; +import TickIcon from 'src/assets/images/icon_check.svg'; + +type Option = { + label: string; + value: string | number; +}; + +type Props = { + label: string; + options: Option[]; + selectedOption: Option | null; + onOptionSelect: (option: Option) => void; +}; + +function OptionDropdown({ label, options, selectedOption, onOptionSelect }: Props) { + const { colorMode } = useColorMode(); + const [isOpen, setIsOpen] = useState(false); + const [internalSelectedOption, setInternalSelectedOption] = useState