From ade09a090619c2edacf9ca23f461c401f90589a9 Mon Sep 17 00:00:00 2001 From: nodirbek75 Date: Tue, 9 Sep 2025 10:42:36 +0500 Subject: [PATCH 1/7] start implementing favorites card screens and components --- app/components/cards/Favorites.tsx | 13 +++++++++++++ app/screens/favorites-card/FavoritesCardDetails.tsx | 13 +++++++++++++ app/screens/favorites-card/FavoritesCardList.tsx | 13 +++++++++++++ app/screens/favorites-card/index.ts | 4 ++++ app/screens/index.ts | 1 + 5 files changed, 44 insertions(+) create mode 100644 app/components/cards/Favorites.tsx create mode 100644 app/screens/favorites-card/FavoritesCardDetails.tsx create mode 100644 app/screens/favorites-card/FavoritesCardList.tsx create mode 100644 app/screens/favorites-card/index.ts diff --git a/app/components/cards/Favorites.tsx b/app/components/cards/Favorites.tsx new file mode 100644 index 000000000..aa1057a81 --- /dev/null +++ b/app/components/cards/Favorites.tsx @@ -0,0 +1,13 @@ +import { makeStyles } from "@rneui/themed" +import React from "react" +import { View } from "react-native" + +const Favorites = () => { + return +} + +export default Favorites + +const useStyles = makeStyles(() => ({ + wrapper: {}, +})) diff --git a/app/screens/favorites-card/FavoritesCardDetails.tsx b/app/screens/favorites-card/FavoritesCardDetails.tsx new file mode 100644 index 000000000..05868f13c --- /dev/null +++ b/app/screens/favorites-card/FavoritesCardDetails.tsx @@ -0,0 +1,13 @@ +import React from "react" +import { makeStyles } from "@rneui/themed" + +// components +import { Screen } from "@app/components/screen" + +const FavoritesCardDetails = () => { + return +} + +export default FavoritesCardDetails + +const useStyles = makeStyles(() => ({})) diff --git a/app/screens/favorites-card/FavoritesCardList.tsx b/app/screens/favorites-card/FavoritesCardList.tsx new file mode 100644 index 000000000..fa66500d6 --- /dev/null +++ b/app/screens/favorites-card/FavoritesCardList.tsx @@ -0,0 +1,13 @@ +import React from "react" +import { makeStyles } from "@rneui/themed" + +// components +import { Screen } from "@app/components/screen" + +const FavoritesCardList = () => { + return +} + +export default FavoritesCardList + +const useStyles = makeStyles(() => ({})) diff --git a/app/screens/favorites-card/index.ts b/app/screens/favorites-card/index.ts new file mode 100644 index 000000000..7c48ed25f --- /dev/null +++ b/app/screens/favorites-card/index.ts @@ -0,0 +1,4 @@ +import FavoritesCardList from "./FavoritesCardList" +import FavoritesCardDetails from "./FavoritesCardDetails" + +export { FavoritesCardList, FavoritesCardDetails } diff --git a/app/screens/index.ts b/app/screens/index.ts index 35a694751..70cccc27e 100644 --- a/app/screens/index.ts +++ b/app/screens/index.ts @@ -1,3 +1,4 @@ export * from "./backup-screen" export * from "./import-wallet-screen" export * from "./transaction-history" +export * from "./favorites-card" From a4bea4071fa83ef503ca6537a8b409757463609d Mon Sep 17 00:00:00 2001 From: nodirbek75 Date: Mon, 15 Sep 2025 12:14:02 +0500 Subject: [PATCH 2/7] illustrations for event, discount and reward types are added for favorites card --- app/assets/illustrations/discount.svg | 9 +++++++++ app/assets/illustrations/event.svg | 9 +++++++++ app/assets/illustrations/reward.svg | 9 +++++++++ 3 files changed, 27 insertions(+) create mode 100644 app/assets/illustrations/discount.svg create mode 100644 app/assets/illustrations/event.svg create mode 100644 app/assets/illustrations/reward.svg diff --git a/app/assets/illustrations/discount.svg b/app/assets/illustrations/discount.svg new file mode 100644 index 000000000..d99b34f3e --- /dev/null +++ b/app/assets/illustrations/discount.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/app/assets/illustrations/event.svg b/app/assets/illustrations/event.svg new file mode 100644 index 000000000..555ac5075 --- /dev/null +++ b/app/assets/illustrations/event.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/app/assets/illustrations/reward.svg b/app/assets/illustrations/reward.svg new file mode 100644 index 000000000..4b590a089 --- /dev/null +++ b/app/assets/illustrations/reward.svg @@ -0,0 +1,9 @@ + + + + + + + + + From 6feda797d4c74b2b2fe78bd51f56fb726948b205 Mon Sep 17 00:00:00 2001 From: nodirbek75 Date: Mon, 15 Sep 2025 13:00:07 +0500 Subject: [PATCH 3/7] implement Favorites card component to use on the Favorites List screen --- app/components/cards/Favorites.tsx | 90 ++++++++++++++++++++++++++++-- app/components/cards/index.ts | 3 +- 2 files changed, 87 insertions(+), 6 deletions(-) diff --git a/app/components/cards/Favorites.tsx b/app/components/cards/Favorites.tsx index aa1057a81..a313224d5 100644 --- a/app/components/cards/Favorites.tsx +++ b/app/components/cards/Favorites.tsx @@ -1,13 +1,93 @@ -import { makeStyles } from "@rneui/themed" import React from "react" import { View } from "react-native" +import { makeStyles, Text, useTheme } from "@rneui/themed" +import moment from "moment" -const Favorites = () => { - return +// assets +import Event from "@app/assets/illustrations/event.svg" +import Reward from "@app/assets/illustrations/reward.svg" +import Discount from "@app/assets/illustrations/discount.svg" + +type Props = { + title: string + description: string + starts: number + ends: number + type: "event" | "reward" | "discount" +} + +const Favorites: React.FC = ({ title, description, starts, ends, type }) => { + const styles = useStyles() + const { colors } = useTheme().theme + + const date = `${moment(new Date(starts)).format("MMM Do")} ~ ${moment( + new Date(ends), + ).format("MMM Do")}` + const time = new Date().getTime() + const status = time > ends ? "expired" : time < starts ? "coming" : "active" + + const Image = type === "event" ? Event : type === "reward" ? Reward : Discount + return ( + + + + + + {date} + + + + {status.charAt(0).toUpperCase() + status.slice(1)} + + + + + {title} + + + {description} + + + + ) } export default Favorites -const useStyles = makeStyles(() => ({ - wrapper: {}, +const useStyles = makeStyles(({ colors }) => ({ + wrapper: { + flexDirection: "row", + alignItems: "center", + borderWidth: 1, + borderRadius: 20, + marginVertical: 10, + padding: 10, + borderColor: colors.grey3, + backgroundColor: colors.background, + }, + details: { + flex: 1, + marginLeft: 10, + gap: 5, + }, + header: { + flexDirection: "row", + alignItems: "center", + justifyContent: "space-between", + }, + status: { + backgroundColor: "green", + paddingVertical: 3, + paddingHorizontal: 8, + borderRadius: 10, + }, + expired: { + backgroundColor: "gray", + }, + active: { + backgroundColor: "green", + }, + coming: { + backgroundColor: "blue", + }, })) diff --git a/app/components/cards/index.ts b/app/components/cards/index.ts index 77229cbd7..71bd61bfc 100644 --- a/app/components/cards/index.ts +++ b/app/components/cards/index.ts @@ -1,3 +1,4 @@ import Balance from "./Balance" +import Favorites from "./Favorites" -export { Balance } +export { Balance, Favorites } From e2715e6dae443ec75bacc8245e14dc3ac5956c20 Mon Sep 17 00:00:00 2001 From: nodirbek75 Date: Tue, 16 Sep 2025 09:50:21 +0500 Subject: [PATCH 4/7] FavoritesCardList screen implemented and added in root navigation --- app/navigation/root-navigator.tsx | 6 +++ app/navigation/stack-param-lists.ts | 1 + .../favorites-card/FavoritesCardList.tsx | 39 ++++++++++++++++++- 3 files changed, 45 insertions(+), 1 deletion(-) diff --git a/app/navigation/root-navigator.tsx b/app/navigation/root-navigator.tsx index 5ccb6108e..f47855526 100644 --- a/app/navigation/root-navigator.tsx +++ b/app/navigation/root-navigator.tsx @@ -87,6 +87,7 @@ import { TransactionHistoryTabs, USDTransactionHistory, SignInViaQRCode, + FavoritesCardList, } from "@app/screens" import { usePersistentStateContext } from "@app/store/persistent-state" import { NotificationSettingsScreen } from "@app/screens/settings-screen/notifications-screen" @@ -575,6 +576,11 @@ export const RootStack = () => { cardStyleInterpolator: CardStyleInterpolators.forHorizontalIOS, }} /> + ) } diff --git a/app/navigation/stack-param-lists.ts b/app/navigation/stack-param-lists.ts index 5ae5a4785..66d7f4d10 100644 --- a/app/navigation/stack-param-lists.ts +++ b/app/navigation/stack-param-lists.ts @@ -151,6 +151,7 @@ export type RootStackParamList = { EditNostrProfile: undefined NostrSettingsScreen: undefined SignInViaQRCode: undefined + FavoritesCardList: undefined } export type ChatStackParamList = { diff --git a/app/screens/favorites-card/FavoritesCardList.tsx b/app/screens/favorites-card/FavoritesCardList.tsx index fa66500d6..530d8194e 100644 --- a/app/screens/favorites-card/FavoritesCardList.tsx +++ b/app/screens/favorites-card/FavoritesCardList.tsx @@ -1,11 +1,48 @@ import React from "react" +import { FlatList } from "react-native" import { makeStyles } from "@rneui/themed" // components import { Screen } from "@app/components/screen" +import { Favorites } from "@app/components/cards" + +const data = [ + { + title: "Favorite card", + description: + "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is", + starts: 1757211118472, + ends: 1757711118472, + type: "event", + }, + { + title: "Favorite card", + description: + "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is", + starts: 1757711118472, + ends: 1758711118472, + type: "reward", + }, + { + title: "Favorite card", + description: + "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is", + starts: 1758711118472, + ends: 1759999118472, + type: "discount", + }, +] const FavoritesCardList = () => { - return + return ( + + } + contentContainerStyle={{ paddingHorizontal: 20 }} + /> + + ) } export default FavoritesCardList From e986e0cf52c67541a785b8cc3efb9c92e3e20043 Mon Sep 17 00:00:00 2001 From: nodirbek75 Date: Tue, 16 Sep 2025 09:56:16 +0500 Subject: [PATCH 5/7] fix type error --- app/components/cards/Favorites.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/app/components/cards/Favorites.tsx b/app/components/cards/Favorites.tsx index a313224d5..5de45fec0 100644 --- a/app/components/cards/Favorites.tsx +++ b/app/components/cards/Favorites.tsx @@ -13,7 +13,7 @@ type Props = { description: string starts: number ends: number - type: "event" | "reward" | "discount" + type: string } const Favorites: React.FC = ({ title, description, starts, ends, type }) => { @@ -26,7 +26,7 @@ const Favorites: React.FC = ({ title, description, starts, ends, type }) const time = new Date().getTime() const status = time > ends ? "expired" : time < starts ? "coming" : "active" - const Image = type === "event" ? Event : type === "reward" ? Reward : Discount + const Image = type === "event" ? Event : type === "discount" ? Discount : Reward return ( From 3c5763c80fd43e40a3471a255879069fe7994a66 Mon Sep 17 00:00:00 2001 From: nodirbek75 Date: Tue, 16 Sep 2025 10:13:19 +0500 Subject: [PATCH 6/7] quick start button is added for flash favorites that navigates to the list screen --- app/components/home-screen/QuickStart.tsx | 8 ++++++++ app/i18n/en/index.ts | 5 ++++- app/i18n/i18n-types.ts | 17 +++++++++++++++++ app/i18n/raw-i18n/source/en.json | 4 +++- 4 files changed, 32 insertions(+), 2 deletions(-) diff --git a/app/components/home-screen/QuickStart.tsx b/app/components/home-screen/QuickStart.tsx index 129de243d..efe80fc67 100644 --- a/app/components/home-screen/QuickStart.tsx +++ b/app/components/home-screen/QuickStart.tsx @@ -13,6 +13,7 @@ import Flashcard from "@app/assets/icons/empty-flashcard.svg" import NonCustodialWallet from "@app/assets/illustrations/non-custodial-wallet.svg" import GoldWallet from "@app/assets/illustrations/gold-wallet.svg" import SecureWallet from "@app/assets/illustrations/secure-wallet.svg" +import Reward from "@app/assets/illustrations/reward.svg" // components import { UpgradeAccountModal } from "../upgrade-account-modal" @@ -64,6 +65,13 @@ const QuickStart = () => { } let carouselData = [ + { + type: "favorites", + title: LL.HomeScreen.favoritesTitle(), + description: LL.HomeScreen.favoritesDesc(), + image: Reward, + onPress: () => navigation.navigate("FavoritesCardList"), + }, { type: "upgrade", title: LL.HomeScreen.upgradeTitle(), diff --git a/app/i18n/en/index.ts b/app/i18n/en/index.ts index e627b6aca..cb7b95ddc 100644 --- a/app/i18n/en/index.ts +++ b/app/i18n/en/index.ts @@ -563,7 +563,10 @@ const en: BaseTranslation = { btcWalletTitle: "Enable BTC wallet", btcWalletDesc: "Easily transfer larger amounts in Bitcoin.", backupTitle: "Backup your BTC wallet", - backupDesc: "Backup and secure your Bitcoin wallet using recovery phrase." + backupDesc: "Backup and secure your Bitcoin wallet using recovery phrase.", + favoritesTitle: "Flash favorites", + favoritesDesc: "Discover hand-picked deals, exclusive events, and special rewards all in one place." + }, PinScreen: { attemptsRemaining: "Incorrect PIN. {attemptsRemaining: number} attempts remaining.", diff --git a/app/i18n/i18n-types.ts b/app/i18n/i18n-types.ts index 67d0e2ca8..ebf38b859 100644 --- a/app/i18n/i18n-types.ts +++ b/app/i18n/i18n-types.ts @@ -1776,6 +1776,14 @@ type RootTranslation = { * B​a​c​k​u​p​ ​a​n​d​ ​s​e​c​u​r​e​ ​y​o​u​r​ ​B​i​t​c​o​i​n​ ​w​a​l​l​e​t​ ​u​s​i​n​g​ ​r​e​c​o​v​e​r​y​ ​p​h​r​a​s​e​. */ backupDesc: string + /** + * Flash favorites + */ + favoritesTitle: string + /** + * Discover hand-picked deals, exclusive events, and special rewards all in one place. + */ + favoritesDesc: string } PinScreen: { /** @@ -6508,6 +6516,14 @@ export type TranslationFunctions = { * Backup and secure your Bitcoin wallet using recovery phrase. */ backupDesc: () => LocalizedString + /** + * Flash favorites + */ + favoritesTitle: () => LocalizedString + /** + * Discover hand-picked deals, exclusive events, and special rewards all in one place. + */ + favoritesDesc: () => LocalizedString } PinScreen: { /** @@ -9430,6 +9446,7 @@ export type TranslationFunctions = { copied: () => LocalizedString } } + } export type Formatters = { diff --git a/app/i18n/raw-i18n/source/en.json b/app/i18n/raw-i18n/source/en.json index 1416165e3..a227fe71b 100644 --- a/app/i18n/raw-i18n/source/en.json +++ b/app/i18n/raw-i18n/source/en.json @@ -532,7 +532,9 @@ "btcWalletTitle": "Enable BTC wallet", "btcWalletDesc": "Easily transfer larger amounts in Bitcoin.", "backupTitle": "Backup your BTC wallet", - "backupDesc": "Backup and secure your Bitcoin wallet using recovery phrase." + "backupDesc": "Backup and secure your Bitcoin wallet using recovery phrase.", + "favoritesTitle": "Flash favorites", + "favoritesDesc": "Discover hand-picked deals, exclusive events, and special rewards all in one place." }, "PinScreen": { "attemptsRemaining": "Incorrect PIN. {attemptsRemaining: number} attempts remaining.", From a29b73db24268042acc9e839f4f007850c4be2ee Mon Sep 17 00:00:00 2001 From: nodirbek75 Date: Tue, 16 Sep 2025 10:17:23 +0500 Subject: [PATCH 7/7] rename screens --- app/components/home-screen/QuickStart.tsx | 2 +- app/navigation/root-navigator.tsx | 8 ++++---- app/navigation/stack-param-lists.ts | 2 +- app/screens/favorites-card/index.ts | 4 ---- .../FlashFavoriteDetails.tsx} | 4 ++-- .../FlashFavoritesList.tsx} | 10 +++++----- app/screens/flash-favorites/index.ts | 4 ++++ app/screens/index.ts | 2 +- 8 files changed, 18 insertions(+), 18 deletions(-) delete mode 100644 app/screens/favorites-card/index.ts rename app/screens/{favorites-card/FavoritesCardDetails.tsx => flash-favorites/FlashFavoriteDetails.tsx} (73%) rename app/screens/{favorites-card/FavoritesCardList.tsx => flash-favorites/FlashFavoritesList.tsx} (88%) create mode 100644 app/screens/flash-favorites/index.ts diff --git a/app/components/home-screen/QuickStart.tsx b/app/components/home-screen/QuickStart.tsx index efe80fc67..7c7455c89 100644 --- a/app/components/home-screen/QuickStart.tsx +++ b/app/components/home-screen/QuickStart.tsx @@ -70,7 +70,7 @@ const QuickStart = () => { title: LL.HomeScreen.favoritesTitle(), description: LL.HomeScreen.favoritesDesc(), image: Reward, - onPress: () => navigation.navigate("FavoritesCardList"), + onPress: () => navigation.navigate("FlashFavoritesList"), }, { type: "upgrade", diff --git a/app/navigation/root-navigator.tsx b/app/navigation/root-navigator.tsx index f47855526..d40a95bbe 100644 --- a/app/navigation/root-navigator.tsx +++ b/app/navigation/root-navigator.tsx @@ -87,7 +87,7 @@ import { TransactionHistoryTabs, USDTransactionHistory, SignInViaQRCode, - FavoritesCardList, + FlashFavoritesList, } from "@app/screens" import { usePersistentStateContext } from "@app/store/persistent-state" import { NotificationSettingsScreen } from "@app/screens/settings-screen/notifications-screen" @@ -577,9 +577,9 @@ export const RootStack = () => { }} /> ) diff --git a/app/navigation/stack-param-lists.ts b/app/navigation/stack-param-lists.ts index 66d7f4d10..05756009f 100644 --- a/app/navigation/stack-param-lists.ts +++ b/app/navigation/stack-param-lists.ts @@ -151,7 +151,7 @@ export type RootStackParamList = { EditNostrProfile: undefined NostrSettingsScreen: undefined SignInViaQRCode: undefined - FavoritesCardList: undefined + FlashFavoritesList: undefined } export type ChatStackParamList = { diff --git a/app/screens/favorites-card/index.ts b/app/screens/favorites-card/index.ts deleted file mode 100644 index 7c48ed25f..000000000 --- a/app/screens/favorites-card/index.ts +++ /dev/null @@ -1,4 +0,0 @@ -import FavoritesCardList from "./FavoritesCardList" -import FavoritesCardDetails from "./FavoritesCardDetails" - -export { FavoritesCardList, FavoritesCardDetails } diff --git a/app/screens/favorites-card/FavoritesCardDetails.tsx b/app/screens/flash-favorites/FlashFavoriteDetails.tsx similarity index 73% rename from app/screens/favorites-card/FavoritesCardDetails.tsx rename to app/screens/flash-favorites/FlashFavoriteDetails.tsx index 05868f13c..a2e47c917 100644 --- a/app/screens/favorites-card/FavoritesCardDetails.tsx +++ b/app/screens/flash-favorites/FlashFavoriteDetails.tsx @@ -4,10 +4,10 @@ import { makeStyles } from "@rneui/themed" // components import { Screen } from "@app/components/screen" -const FavoritesCardDetails = () => { +const FlashFavoriteDetails = () => { return } -export default FavoritesCardDetails +export default FlashFavoriteDetails const useStyles = makeStyles(() => ({})) diff --git a/app/screens/favorites-card/FavoritesCardList.tsx b/app/screens/flash-favorites/FlashFavoritesList.tsx similarity index 88% rename from app/screens/favorites-card/FavoritesCardList.tsx rename to app/screens/flash-favorites/FlashFavoritesList.tsx index 530d8194e..8ad0ddcf7 100644 --- a/app/screens/favorites-card/FavoritesCardList.tsx +++ b/app/screens/flash-favorites/FlashFavoritesList.tsx @@ -8,7 +8,7 @@ import { Favorites } from "@app/components/cards" const data = [ { - title: "Favorite card", + title: "Event Favorite card", description: "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is", starts: 1757211118472, @@ -16,7 +16,7 @@ const data = [ type: "event", }, { - title: "Favorite card", + title: "Reward Favorite card", description: "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is", starts: 1757711118472, @@ -24,7 +24,7 @@ const data = [ type: "reward", }, { - title: "Favorite card", + title: "Discount Favorite card", description: "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is", starts: 1758711118472, @@ -33,7 +33,7 @@ const data = [ }, ] -const FavoritesCardList = () => { +const FlashFavoritesList = () => { return ( { ) } -export default FavoritesCardList +export default FlashFavoritesList const useStyles = makeStyles(() => ({})) diff --git a/app/screens/flash-favorites/index.ts b/app/screens/flash-favorites/index.ts new file mode 100644 index 000000000..328087023 --- /dev/null +++ b/app/screens/flash-favorites/index.ts @@ -0,0 +1,4 @@ +import FlashFavoritesList from "./FlashFavoritesList" +import FlashFavoriteDetails from "./FlashFavoriteDetails" + +export { FlashFavoritesList, FlashFavoriteDetails } diff --git a/app/screens/index.ts b/app/screens/index.ts index 70cccc27e..d7338f0ea 100644 --- a/app/screens/index.ts +++ b/app/screens/index.ts @@ -1,4 +1,4 @@ export * from "./backup-screen" export * from "./import-wallet-screen" export * from "./transaction-history" -export * from "./favorites-card" +export * from "./flash-favorites"