From 86424852e89714d0d5cbf6e338e417b5d8862cf0 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 10:31:49 +0700 Subject: [PATCH 01/10] chore: hide last carousel cards at first time mounting --- apps/wallet/src/features/Explorer/Highlights/Card.tsx | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/apps/wallet/src/features/Explorer/Highlights/Card.tsx b/apps/wallet/src/features/Explorer/Highlights/Card.tsx index 1108852f3..b2093b2b6 100644 --- a/apps/wallet/src/features/Explorer/Highlights/Card.tsx +++ b/apps/wallet/src/features/Explorer/Highlights/Card.tsx @@ -1,4 +1,5 @@ -import { type FC, useEffect } from 'react'; +import type { FC } from 'react'; +import { useEffect } from 'react'; import { StyleSheet } from 'react-native'; import type { SharedValue, WithTimingConfig } from 'react-native-reanimated'; import Animated, { @@ -46,8 +47,10 @@ const Card: FC = ({ [0.08, -0.08], ); + const isHidden = index - currentIndex > 2; + return { - opacity: opacity.value, + opacity: isHidden ? 0 : opacity.value, transform: [ { translateX: xOffset.value + addingTranslateX }, { scale: scale.value + addingScale }, From 256432d60795e4ed8f4966408ec917105bc6b587 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 11:06:44 +0700 Subject: [PATCH 02/10] chore: update text size, spacing of Walless quest tab --- .../src/features/Loyalty/ActionCard/index.tsx | 19 ++++++---- apps/wallet/src/features/Loyalty/Header.tsx | 35 ++++++++++--------- .../src/features/Loyalty/WallessTab/index.tsx | 2 +- apps/wallet/src/features/Loyalty/index.tsx | 6 ++-- apps/wallet/src/features/Loyalty/internal.tsx | 20 +++++------ 5 files changed, 45 insertions(+), 37 deletions(-) diff --git a/apps/wallet/src/features/Loyalty/ActionCard/index.tsx b/apps/wallet/src/features/Loyalty/ActionCard/index.tsx index bc5acf180..cb3a9916f 100644 --- a/apps/wallet/src/features/Loyalty/ActionCard/index.tsx +++ b/apps/wallet/src/features/Loyalty/ActionCard/index.tsx @@ -173,7 +173,7 @@ const ActionCard: FC = ({ style, action, canUserPerformAction }) => { return ( - + = ({ point, completedTask, style }) => { + + + + + + Ranking + Incoming + + + showHistory({ safeAreaInsets })} @@ -35,21 +45,11 @@ const Header: FC = ({ point, completedTask, style }) => { - + Completed Task {completedTask} - - - - - - - Ranking - Incoming - - ); @@ -57,11 +57,10 @@ const Header: FC = ({ point, completedTask, style }) => { const styles = StyleSheet.create({ container: { - alignItems: 'center', - justifyContent: 'center', borderRadius: 16, overflow: 'hidden', paddingVertical: 18, + paddingHorizontal: 18, gap: 10, backgroundColor: '#131C24', }, @@ -71,7 +70,7 @@ const styles = StyleSheet.create({ }, yourTotalPointsText: { color: '#CFCFCF', - fontSize: 12, + fontSize: 13, }, horizontalContainer: { flexDirection: 'row', @@ -98,16 +97,17 @@ const styles = StyleSheet.create({ }, bottomContainer: { flexDirection: 'row', - gap: 8, + gap: 10, alignItems: 'center', }, bottomItemContainer: { + flex: 1, flexDirection: 'row', gap: 8, alignItems: 'center', backgroundColor: '#19232C', paddingHorizontal: 12, - paddingVertical: 8, + paddingVertical: 10, borderRadius: 16, }, iconContainer: { @@ -117,6 +117,9 @@ const styles = StyleSheet.create({ justifyContent: 'center', alignItems: 'center', }, + bottomItemContentContainer: { + gap: 2, + }, checkBorder: { borderWidth: 1, borderColor: 'rgba(47, 200, 121, 0.3)', diff --git a/apps/wallet/src/features/Loyalty/WallessTab/index.tsx b/apps/wallet/src/features/Loyalty/WallessTab/index.tsx index 694cc9937..affa86bfe 100644 --- a/apps/wallet/src/features/Loyalty/WallessTab/index.tsx +++ b/apps/wallet/src/features/Loyalty/WallessTab/index.tsx @@ -36,7 +36,7 @@ const WallessTab = () => { const styles = StyleSheet.create({ container: { flex: 1, - gap: 8, + gap: 10, }, centerContainer: { flex: 1, diff --git a/apps/wallet/src/features/Loyalty/index.tsx b/apps/wallet/src/features/Loyalty/index.tsx index 0e460d1ac..418fa1f3e 100644 --- a/apps/wallet/src/features/Loyalty/index.tsx +++ b/apps/wallet/src/features/Loyalty/index.tsx @@ -133,17 +133,17 @@ const LoyaltyFeature = () => { const styles = StyleSheet.create({ container: { - paddingTop: 24, + paddingTop: 8, gap: 16, flexGrow: 1, }, pointCard: { - marginHorizontal: 12, + marginHorizontal: 16, }, bottomContainer: { backgroundColor: '#131C24', paddingVertical: 16, - paddingHorizontal: 12, + paddingHorizontal: 16, borderTopLeftRadius: 16, borderTopRightRadius: 16, flexGrow: 1, diff --git a/apps/wallet/src/features/Loyalty/internal.tsx b/apps/wallet/src/features/Loyalty/internal.tsx index 990bc12b6..ed4a15eb6 100644 --- a/apps/wallet/src/features/Loyalty/internal.tsx +++ b/apps/wallet/src/features/Loyalty/internal.tsx @@ -16,9 +16,9 @@ import { addWidgetToStorage } from 'utils/storage'; export const sharedStyles = StyleSheet.create({ tagContainer: { backgroundColor: '#2C353D', - height: 24, - borderRadius: 8, - paddingHorizontal: 4, + borderRadius: 6, + paddingVertical: 6, + paddingHorizontal: 6, justifyContent: 'center', alignItems: 'center', flexDirection: 'row', @@ -77,15 +77,15 @@ export const getActionLogo = (action: Action) => { action.type?.toLowerCase().includes('twitter') || action.type?.toLowerCase() === 'x' ) { - return ; + return ; } if (action.type?.toLowerCase().includes('discord')) { - return ; + return ; } if (action.type?.toLowerCase().includes('telegram')) { - return ; + return ; } if (action.type?.toLowerCase() === 'open chest') { @@ -93,8 +93,8 @@ export const getActionLogo = (action: Action) => { @@ -109,13 +109,13 @@ export const getActionLogo = (action: Action) => { return ( ); } - return ; + return ; }; export const navigateInternalByCta = (cta: string) => { From 8369da81ad44b77037a63b993d9cf810d8ab9908 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 11:10:41 +0700 Subject: [PATCH 03/10] chore: update spacing of partner quest tab --- apps/wallet/src/features/Loyalty/PartnerTab/PartnerFolder.tsx | 1 + 1 file changed, 1 insertion(+) diff --git a/apps/wallet/src/features/Loyalty/PartnerTab/PartnerFolder.tsx b/apps/wallet/src/features/Loyalty/PartnerTab/PartnerFolder.tsx index 31ed3b127..bfb96a02e 100644 --- a/apps/wallet/src/features/Loyalty/PartnerTab/PartnerFolder.tsx +++ b/apps/wallet/src/features/Loyalty/PartnerTab/PartnerFolder.tsx @@ -103,5 +103,6 @@ const styles = StyleSheet.create({ descText: { color: '#EBF0F6', fontSize: 13, + lineHeight: 16, }, }); From 420e0d1cd27896b3b5a90b6491e808fcd8669023 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 12:08:49 +0700 Subject: [PATCH 04/10] fix: use correct Text from @walless/gui --- apps/wallet/src/components/CheckedInput.tsx | 3 ++- .../components/DrawerNavigation/views/DrawerItem.tsx | 3 ++- apps/wallet/src/components/StackContainer/Header.tsx | 3 ++- apps/wallet/src/features/Explorer/Header.tsx | 4 ++-- .../features/Explorer/Highlights/HighlightItem.tsx | 3 ++- .../Explorer/Highlights/LoveAndActiveCount.tsx | 3 ++- .../wallet/src/features/Explorer/Highlights/index.tsx | 4 ++-- apps/wallet/src/features/Explorer/LoyaltyBar.tsx | 6 ++++-- .../src/features/Explorer/Missions/MissionItem.tsx | 3 ++- .../src/features/Explorer/Widgets/WidgetItem.tsx | 3 ++- apps/wallet/src/features/Explorer/Widgets/index.tsx | 3 ++- .../features/History/HistoryItem/SolanaUnknown.tsx | 3 ++- .../src/features/Loyalty/ActionCard/CompletedTag.tsx | 3 ++- .../src/features/Loyalty/ActionCard/CountDown.tsx | 3 ++- .../src/features/Loyalty/ActionCard/StreakBar.tsx | 3 ++- .../Loyalty/ActionCard/VerificationNeededTag.tsx | 3 ++- apps/wallet/src/features/Loyalty/Header.tsx | 3 ++- apps/wallet/src/features/Loyalty/History/Item.tsx | 3 ++- apps/wallet/src/features/Loyalty/PartnerTab/index.tsx | 3 ++- apps/wallet/src/features/Loyalty/WallessTab/index.tsx | 3 ++- .../src/features/Loyalty/components/ModalHeader.tsx | 3 ++- .../src/features/Loyalty/components/PointTag.tsx | 3 ++- apps/wallet/src/features/Setting/index.tsx | 3 ++- .../InformationDetails/NetworkDetails.tsx | 4 ++-- apps/wallet/src/modals/LogoutModal.tsx | 4 ++-- .../Authentication/Invitation/GetCodeStepCard.tsx | 3 ++- .../Authentication/Invitation/GetCodeStepNumber.tsx | 3 ++- .../Authentication/Invitation/InvitationGuide.tsx | 4 ++-- .../Dashboard/Browser/Navigator/UrlPreview.tsx | 4 ++-- apps/wallet/src/screens/Dashboard/Contact/index.tsx | 3 ++- .../Dashboard/Referral/GradientRankingCard.tsx | 3 ++- .../src/screens/Dashboard/Referral/ReferralStats.tsx | 11 +++++++---- apps/wallet/src/screens/Dashboard/Referral/index.tsx | 9 ++++----- apps/wallet/tsconfig.json | 1 + apps/wallet/vendor/web-webview.tsx | 3 ++- 35 files changed, 78 insertions(+), 48 deletions(-) diff --git a/apps/wallet/src/components/CheckedInput.tsx b/apps/wallet/src/components/CheckedInput.tsx index 62a2337d1..5e059fb8d 100644 --- a/apps/wallet/src/components/CheckedInput.tsx +++ b/apps/wallet/src/components/CheckedInput.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; import type { InputProps } from '@walless/gui'; +import { Text } from '@walless/gui'; import { Input } from '@walless/gui'; type Props = { diff --git a/apps/wallet/src/components/DrawerNavigation/views/DrawerItem.tsx b/apps/wallet/src/components/DrawerNavigation/views/DrawerItem.tsx index e5471690d..27e0128c6 100644 --- a/apps/wallet/src/components/DrawerNavigation/views/DrawerItem.tsx +++ b/apps/wallet/src/components/DrawerNavigation/views/DrawerItem.tsx @@ -1,9 +1,10 @@ import type { ComponentProps, ReactNode } from 'react'; import { Fragment } from 'react'; import type { StyleProp, TextStyle, ViewStyle } from 'react-native'; -import { Platform, StyleSheet, Text, View } from 'react-native'; +import { Platform, StyleSheet, View } from 'react-native'; import { PlatformPressable } from '@react-navigation/elements'; import { Link, useTheme } from '@react-navigation/native'; +import { Text } from '@walless/gui'; import Color from 'color'; type Props = { diff --git a/apps/wallet/src/components/StackContainer/Header.tsx b/apps/wallet/src/components/StackContainer/Header.tsx index 0af551d7c..2e907d98d 100644 --- a/apps/wallet/src/components/StackContainer/Header.tsx +++ b/apps/wallet/src/components/StackContainer/Header.tsx @@ -1,12 +1,13 @@ import type { FC } from 'react'; import type { Insets } from 'react-native'; -import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'; +import { StyleSheet, TouchableOpacity, View } from 'react-native'; import type { SharedValue } from 'react-native-reanimated'; import Animated, { interpolate, useAnimatedStyle, useSharedValue, } from 'react-native-reanimated'; +import { Text } from '@walless/gui'; import { ChevronLeft, Hamburger } from '@walless/icons'; export interface HeaderProps { diff --git a/apps/wallet/src/features/Explorer/Header.tsx b/apps/wallet/src/features/Explorer/Header.tsx index 9c12bc739..d2f37049c 100644 --- a/apps/wallet/src/features/Explorer/Header.tsx +++ b/apps/wallet/src/features/Explorer/Header.tsx @@ -1,7 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text } from 'react-native'; -import { Hoverable, View } from '@walless/gui'; +import { StyleSheet } from 'react-native'; +import { Hoverable, Text, View } from '@walless/gui'; import { Eye, EyeOff, Settings } from '@walless/icons'; import { appState } from 'state/app'; import { setPrivacy } from 'state/runtime/config'; diff --git a/apps/wallet/src/features/Explorer/Highlights/HighlightItem.tsx b/apps/wallet/src/features/Explorer/Highlights/HighlightItem.tsx index 21e42190d..70c66e10c 100644 --- a/apps/wallet/src/features/Explorer/Highlights/HighlightItem.tsx +++ b/apps/wallet/src/features/Explorer/Highlights/HighlightItem.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; -import { Image, StyleSheet, Text, TouchableOpacity, View } from 'react-native'; +import { Image, StyleSheet, TouchableOpacity, View } from 'react-native'; import { runtime } from '@walless/core'; +import { Text } from '@walless/gui'; import { ArrowTopRight, Plus } from '@walless/icons'; import type { WidgetDocument } from '@walless/store'; import assets from 'utils/assets'; diff --git a/apps/wallet/src/features/Explorer/Highlights/LoveAndActiveCount.tsx b/apps/wallet/src/features/Explorer/Highlights/LoveAndActiveCount.tsx index 63ba603a0..273c6372d 100644 --- a/apps/wallet/src/features/Explorer/Highlights/LoveAndActiveCount.tsx +++ b/apps/wallet/src/features/Explorer/Highlights/LoveAndActiveCount.tsx @@ -1,5 +1,6 @@ import type { FC } from 'react'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; import { Heart } from '@walless/icons'; interface LoveAndActiveCountProps { diff --git a/apps/wallet/src/features/Explorer/Highlights/index.tsx b/apps/wallet/src/features/Explorer/Highlights/index.tsx index 82b32c6ac..8b92dca92 100644 --- a/apps/wallet/src/features/Explorer/Highlights/index.tsx +++ b/apps/wallet/src/features/Explorer/Highlights/index.tsx @@ -1,6 +1,6 @@ import { useState } from 'react'; -import { StyleSheet, Text } from 'react-native'; -import { View } from '@walless/gui'; +import { StyleSheet } from 'react-native'; +import { Text, View } from '@walless/gui'; import { mockWidgets } from 'state/widget'; import CardCarousel from './CardCarousel'; diff --git a/apps/wallet/src/features/Explorer/LoyaltyBar.tsx b/apps/wallet/src/features/Explorer/LoyaltyBar.tsx index 4689f4750..3a8af8633 100644 --- a/apps/wallet/src/features/Explorer/LoyaltyBar.tsx +++ b/apps/wallet/src/features/Explorer/LoyaltyBar.tsx @@ -1,7 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { ImageBackground, StyleSheet, Text, View } from 'react-native'; -import { Button } from '@walless/gui'; +import { ImageBackground, StyleSheet, View } from 'react-native'; +import { Button, Text } from '@walless/gui'; import { BlingBling } from '@walless/icons'; import assets from 'utils/assets'; import { navigate } from 'utils/navigation'; @@ -68,9 +68,11 @@ const styles = StyleSheet.create({ highlightText: { fontSize: 14, fontWeight: '500', + color: '#222222', }, subText: { fontSize: 12, + color: '#222222', }, blingContainer: { backgroundColor: '#212F3C', diff --git a/apps/wallet/src/features/Explorer/Missions/MissionItem.tsx b/apps/wallet/src/features/Explorer/Missions/MissionItem.tsx index 89b796734..3ca31638e 100644 --- a/apps/wallet/src/features/Explorer/Missions/MissionItem.tsx +++ b/apps/wallet/src/features/Explorer/Missions/MissionItem.tsx @@ -1,8 +1,9 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'; +import { StyleSheet, TouchableOpacity, View } from 'react-native'; import LinearGradient from 'react-native-linear-gradient'; import Animated from 'react-native-reanimated'; +import { Text } from '@walless/gui'; import { Anchor } from '@walless/gui'; interface MissionProps { diff --git a/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx b/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx index 46735a3de..c782720d0 100644 --- a/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx +++ b/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx @@ -1,7 +1,8 @@ import type { FC } from 'react'; -import { Image, StyleSheet, Text, View } from 'react-native'; +import { Image, StyleSheet, View } from 'react-native'; import { TouchableOpacity } from 'react-native-gesture-handler'; import { runtime } from '@walless/core'; +import { Text } from '@walless/gui'; import { Heart } from '@walless/icons'; import type { WidgetDocument } from '@walless/store'; import assets from 'utils/assets'; diff --git a/apps/wallet/src/features/Explorer/Widgets/index.tsx b/apps/wallet/src/features/Explorer/Widgets/index.tsx index 5e6d7aa7f..340d3d719 100644 --- a/apps/wallet/src/features/Explorer/Widgets/index.tsx +++ b/apps/wallet/src/features/Explorer/Widgets/index.tsx @@ -1,6 +1,7 @@ import { useState } from 'react'; -import { ScrollView, StyleSheet, Text, View } from 'react-native'; +import { ScrollView, StyleSheet, View } from 'react-native'; import { WidgetType } from '@walless/core'; +import { Text } from '@walless/gui'; import type { WidgetDocument } from '@walless/store'; import { mockWidgets } from 'state/widget'; diff --git a/apps/wallet/src/features/History/HistoryItem/SolanaUnknown.tsx b/apps/wallet/src/features/History/HistoryItem/SolanaUnknown.tsx index b223bfa48..d9ba59a10 100644 --- a/apps/wallet/src/features/History/HistoryItem/SolanaUnknown.tsx +++ b/apps/wallet/src/features/History/HistoryItem/SolanaUnknown.tsx @@ -1,8 +1,9 @@ import type { FC } from 'react'; import type { ImageSourcePropType } from 'react-native'; -import { Linking, StyleSheet, Text, View } from 'react-native'; +import { Linking, StyleSheet, View } from 'react-native'; import type { SolanaUnknownHistory } from '@walless/core'; import { Networks, shortenAddress } from '@walless/core'; +import { Text } from '@walless/gui'; import type { HistoryDocument } from '@walless/store'; import assets from 'utils/assets'; import { getNetworkInfo } from 'utils/helper'; diff --git a/apps/wallet/src/features/Loyalty/ActionCard/CompletedTag.tsx b/apps/wallet/src/features/Loyalty/ActionCard/CompletedTag.tsx index 55c53adac..9f781ab09 100644 --- a/apps/wallet/src/features/Loyalty/ActionCard/CompletedTag.tsx +++ b/apps/wallet/src/features/Loyalty/ActionCard/CompletedTag.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; import { Check } from '@walless/icons'; import { sharedStyles } from '../internal'; diff --git a/apps/wallet/src/features/Loyalty/ActionCard/CountDown.tsx b/apps/wallet/src/features/Loyalty/ActionCard/CountDown.tsx index 7d1414b8a..29e8275ad 100644 --- a/apps/wallet/src/features/Loyalty/ActionCard/CountDown.tsx +++ b/apps/wallet/src/features/Loyalty/ActionCard/CountDown.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import { useEffect, useState } from 'react'; -import { StyleSheet, Text } from 'react-native'; +import { StyleSheet } from 'react-native'; +import { Text } from '@walless/gui'; import { formatCountdownTime } from '../internal'; diff --git a/apps/wallet/src/features/Loyalty/ActionCard/StreakBar.tsx b/apps/wallet/src/features/Loyalty/ActionCard/StreakBar.tsx index 87906938a..012f26288 100644 --- a/apps/wallet/src/features/Loyalty/ActionCard/StreakBar.tsx +++ b/apps/wallet/src/features/Loyalty/ActionCard/StreakBar.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; interface Props { style?: ViewStyle; diff --git a/apps/wallet/src/features/Loyalty/ActionCard/VerificationNeededTag.tsx b/apps/wallet/src/features/Loyalty/ActionCard/VerificationNeededTag.tsx index dcf61e81b..7c585db19 100644 --- a/apps/wallet/src/features/Loyalty/ActionCard/VerificationNeededTag.tsx +++ b/apps/wallet/src/features/Loyalty/ActionCard/VerificationNeededTag.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; import { Exclamation2 } from '@walless/icons'; import { sharedStyles } from '../internal'; diff --git a/apps/wallet/src/features/Loyalty/Header.tsx b/apps/wallet/src/features/Loyalty/Header.tsx index e1445eebe..5dd20f485 100644 --- a/apps/wallet/src/features/Loyalty/Header.tsx +++ b/apps/wallet/src/features/Loyalty/Header.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'; +import { StyleSheet, TouchableOpacity, View } from 'react-native'; +import { Text } from '@walless/gui'; import { BlingBling, Check, Ranking } from '@walless/icons'; import { useSafeAreaInsets } from 'utils/hooks'; diff --git a/apps/wallet/src/features/Loyalty/History/Item.tsx b/apps/wallet/src/features/Loyalty/History/Item.tsx index da703484d..9b3e6a33c 100644 --- a/apps/wallet/src/features/Loyalty/History/Item.tsx +++ b/apps/wallet/src/features/Loyalty/History/Item.tsx @@ -1,8 +1,9 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; import type { ActionMetadata } from '@walless/graphql'; import type { HistoryItem } from '@walless/graphql'; +import { Text } from '@walless/gui'; import { extractDataFromMetadata } from '../internal'; diff --git a/apps/wallet/src/features/Loyalty/PartnerTab/index.tsx b/apps/wallet/src/features/Loyalty/PartnerTab/index.tsx index ceb35aa35..bf88a1685 100644 --- a/apps/wallet/src/features/Loyalty/PartnerTab/index.tsx +++ b/apps/wallet/src/features/Loyalty/PartnerTab/index.tsx @@ -1,5 +1,6 @@ -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; import type { ActionMetadata } from '@walless/graphql'; +import { Text } from '@walless/gui'; import { loyaltyState } from 'state/loyalty'; import { useSnapshot } from 'utils/hooks'; diff --git a/apps/wallet/src/features/Loyalty/WallessTab/index.tsx b/apps/wallet/src/features/Loyalty/WallessTab/index.tsx index affa86bfe..434ebbe78 100644 --- a/apps/wallet/src/features/Loyalty/WallessTab/index.tsx +++ b/apps/wallet/src/features/Loyalty/WallessTab/index.tsx @@ -1,5 +1,6 @@ -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; import type { Action, UserProgress } from '@walless/graphql'; +import { Text } from '@walless/gui'; import { loyaltyState } from 'state/loyalty'; import { useSnapshot } from 'utils/hooks'; diff --git a/apps/wallet/src/features/Loyalty/components/ModalHeader.tsx b/apps/wallet/src/features/Loyalty/components/ModalHeader.tsx index 488661fed..495c67e07 100644 --- a/apps/wallet/src/features/Loyalty/components/ModalHeader.tsx +++ b/apps/wallet/src/features/Loyalty/components/ModalHeader.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, TouchableOpacity, View } from 'react-native'; +import { StyleSheet, TouchableOpacity, View } from 'react-native'; +import { Text } from '@walless/gui'; import { Times } from '@walless/icons'; interface Props { diff --git a/apps/wallet/src/features/Loyalty/components/PointTag.tsx b/apps/wallet/src/features/Loyalty/components/PointTag.tsx index e7a6f1e11..518af8f27 100644 --- a/apps/wallet/src/features/Loyalty/components/PointTag.tsx +++ b/apps/wallet/src/features/Loyalty/components/PointTag.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; import { BlingBling } from '@walless/icons'; import { sharedStyles } from '../internal'; diff --git a/apps/wallet/src/features/Setting/index.tsx b/apps/wallet/src/features/Setting/index.tsx index 1599714bb..caad904fa 100644 --- a/apps/wallet/src/features/Setting/index.tsx +++ b/apps/wallet/src/features/Setting/index.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { Image, Linking, StyleSheet, Text, View } from 'react-native'; +import { Image, Linking, StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; import { ArrowTopRight, Book, diff --git a/apps/wallet/src/features/TransactionDetail/InformationDetails/NetworkDetails.tsx b/apps/wallet/src/features/TransactionDetail/InformationDetails/NetworkDetails.tsx index 40dd87a50..b8791bbcf 100644 --- a/apps/wallet/src/features/TransactionDetail/InformationDetails/NetworkDetails.tsx +++ b/apps/wallet/src/features/TransactionDetail/InformationDetails/NetworkDetails.tsx @@ -1,6 +1,6 @@ import type { FC } from 'react'; -import { Image, StyleSheet, Text } from 'react-native'; -import { View } from '@walless/gui'; +import { Image, StyleSheet } from 'react-native'; +import { Text, View } from '@walless/gui'; import type { NetworkInfo } from 'utils/helper'; interface Props { diff --git a/apps/wallet/src/modals/LogoutModal.tsx b/apps/wallet/src/modals/LogoutModal.tsx index c9de509de..7b705895d 100644 --- a/apps/wallet/src/modals/LogoutModal.tsx +++ b/apps/wallet/src/modals/LogoutModal.tsx @@ -1,5 +1,5 @@ -import { StyleSheet, Text, View } from 'react-native'; -import { Button, modalActions } from '@walless/gui'; +import { StyleSheet, View } from 'react-native'; +import { Button, modalActions, Text } from '@walless/gui'; import { logout } from 'utils/auth'; import { resetRoute } from 'utils/navigation'; diff --git a/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepCard.tsx b/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepCard.tsx index c0c50e9c3..e5c8821c9 100644 --- a/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepCard.tsx +++ b/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepCard.tsx @@ -1,5 +1,6 @@ import type { FC } from 'react'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; import { InvitationCodeStepBackground } from '@walless/icons'; interface GetCodeStepCardProps { diff --git a/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepNumber.tsx b/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepNumber.tsx index 60353763f..b3a818fcb 100644 --- a/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepNumber.tsx +++ b/apps/wallet/src/screens/Authentication/Invitation/GetCodeStepNumber.tsx @@ -1,5 +1,6 @@ import type { FC } from 'react'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; interface GetCodeStepNumberProps { number: number; diff --git a/apps/wallet/src/screens/Authentication/Invitation/InvitationGuide.tsx b/apps/wallet/src/screens/Authentication/Invitation/InvitationGuide.tsx index 5cac5d489..7b49b1a11 100644 --- a/apps/wallet/src/screens/Authentication/Invitation/InvitationGuide.tsx +++ b/apps/wallet/src/screens/Authentication/Invitation/InvitationGuide.tsx @@ -1,5 +1,5 @@ -import { StyleSheet, Text, View } from 'react-native'; -import { Anchor } from '@walless/gui'; +import { StyleSheet, View } from 'react-native'; +import { Anchor, Text } from '@walless/gui'; import GetCodeStepCard from './GetCodeStepCard'; import GetCodeStepNumber from './GetCodeStepNumber'; diff --git a/apps/wallet/src/screens/Dashboard/Browser/Navigator/UrlPreview.tsx b/apps/wallet/src/screens/Dashboard/Browser/Navigator/UrlPreview.tsx index 02cf0f8ce..2f043cef0 100644 --- a/apps/wallet/src/screens/Dashboard/Browser/Navigator/UrlPreview.tsx +++ b/apps/wallet/src/screens/Dashboard/Browser/Navigator/UrlPreview.tsx @@ -1,12 +1,12 @@ import type { FC } from 'react'; import { useEffect, useMemo } from 'react'; -import { StyleSheet, Text } from 'react-native'; +import { StyleSheet } from 'react-native'; import { useAnimatedStyle, useSharedValue, withTiming, } from 'react-native-reanimated'; -import { AnimatedPressable } from '@walless/gui'; +import { AnimatedPressable, Text } from '@walless/gui'; import { Lock } from '@walless/icons'; interface Props { diff --git a/apps/wallet/src/screens/Dashboard/Contact/index.tsx b/apps/wallet/src/screens/Dashboard/Contact/index.tsx index 5ab971bf9..5166b1c22 100644 --- a/apps/wallet/src/screens/Dashboard/Contact/index.tsx +++ b/apps/wallet/src/screens/Dashboard/Contact/index.tsx @@ -1,5 +1,6 @@ import type { FC } from 'react'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; export const ContactScreen: FC = () => { return ( diff --git a/apps/wallet/src/screens/Dashboard/Referral/GradientRankingCard.tsx b/apps/wallet/src/screens/Dashboard/Referral/GradientRankingCard.tsx index 6e9ef20b6..1596dfb24 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/GradientRankingCard.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/GradientRankingCard.tsx @@ -1,6 +1,7 @@ import type { FC } from 'react'; import type { ViewStyle } from 'react-native'; -import { ImageBackground, StyleSheet, Text, View } from 'react-native'; +import { ImageBackground, StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; import assets from 'utils/assets'; interface Props { diff --git a/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx b/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx index da37946ca..723efa35f 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx @@ -28,7 +28,9 @@ const ReferralStats: FC = ({ currentPoints, goalPoints }) => { Your Influence Meter - Goal {goalPoints} points + + Goal {goalPoints} points + @@ -54,7 +56,6 @@ export default ReferralStats; const styles = StyleSheet.create({ container: { gap: 12, - padding: 12, }, titleContainer: { flexDirection: 'row', @@ -62,10 +63,12 @@ const styles = StyleSheet.create({ alignItems: 'flex-end', }, title: { - fontSize: 18, + fontSize: 16, + }, + goalText: { + fontSize: 12, }, text: { - fontSize: 10, color: '#ffffff', }, activeReferral: { diff --git a/apps/wallet/src/screens/Dashboard/Referral/index.tsx b/apps/wallet/src/screens/Dashboard/Referral/index.tsx index 7f9c24496..e5e6ac616 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/index.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/index.tsx @@ -157,8 +157,8 @@ export default ReferralScreen; const styles = StyleSheet.create({ container: { flex: 1, - gap: 12, - paddingTop: 16, + gap: 16, + paddingTop: 8, }, title: { fontSize: 20, @@ -173,10 +173,9 @@ const styles = StyleSheet.create({ summaryContainer: { backgroundColor: '#131C24', borderRadius: 16, - padding: 16, + padding: 18, gap: 12, - marginHorizontal: 12, - marginBottom: 12, + marginHorizontal: 16, }, infoDetailsContainer: { flexDirection: 'row', diff --git a/apps/wallet/tsconfig.json b/apps/wallet/tsconfig.json index 3bf9fe2b8..d3bb27a78 100644 --- a/apps/wallet/tsconfig.json +++ b/apps/wallet/tsconfig.json @@ -3,6 +3,7 @@ "include": [ "browser", "src", + "vendor", "test", "index*.js", "../../globals.d.ts" diff --git a/apps/wallet/vendor/web-webview.tsx b/apps/wallet/vendor/web-webview.tsx index daf5a598f..4410bbdfb 100644 --- a/apps/wallet/vendor/web-webview.tsx +++ b/apps/wallet/vendor/web-webview.tsx @@ -1,5 +1,6 @@ import { forwardRef } from 'react'; -import { StyleSheet, Text, View } from 'react-native'; +import { StyleSheet, View } from 'react-native'; +import { Text } from '@walless/gui'; export const WebView = forwardRef((_, ref) => { return ( From 838a4f20826c1d3686baa8470b18d94d3e46c761 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 12:21:57 +0700 Subject: [PATCH 05/10] chore: update referral styles --- apps/wallet/src/features/Explorer/LoyaltyBar.tsx | 7 ++++--- .../screens/Dashboard/Referral/InvitationCard.tsx | 4 ++-- .../screens/Dashboard/Referral/ReferralStats.tsx | 6 ++++-- .../wallet/src/screens/Dashboard/Referral/index.tsx | 13 ++++++------- 4 files changed, 16 insertions(+), 14 deletions(-) diff --git a/apps/wallet/src/features/Explorer/LoyaltyBar.tsx b/apps/wallet/src/features/Explorer/LoyaltyBar.tsx index 3a8af8633..597e90687 100644 --- a/apps/wallet/src/features/Explorer/LoyaltyBar.tsx +++ b/apps/wallet/src/features/Explorer/LoyaltyBar.tsx @@ -54,6 +54,7 @@ const styles = StyleSheet.create({ padding: 12, flexDirection: 'row', justifyContent: 'space-between', + alignItems: 'center', }, leftContainer: { flexDirection: 'row', @@ -61,9 +62,9 @@ const styles = StyleSheet.create({ gap: 8, }, leftTextContainer: { - height: '100%', justifyContent: 'space-between', paddingVertical: 3, + gap: 2, }, highlightText: { fontSize: 14, @@ -84,9 +85,9 @@ const styles = StyleSheet.create({ }, button: { backgroundColor: '#19232C', - borderRadius: 6, + borderRadius: 12, paddingHorizontal: 12, - paddingVertical: 2, + paddingVertical: 10, }, }); diff --git a/apps/wallet/src/screens/Dashboard/Referral/InvitationCard.tsx b/apps/wallet/src/screens/Dashboard/Referral/InvitationCard.tsx index 335a97260..adb1355cf 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/InvitationCard.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/InvitationCard.tsx @@ -25,7 +25,7 @@ const InvitationCard: FC = ({ code: code, points, isClaimed }) => { {points} Points ) : ( - + )} @@ -38,7 +38,7 @@ const styles = StyleSheet.create({ container: { flexDirection: 'row', padding: 16, - borderRadius: 8, + borderRadius: 12, backgroundColor: '#19232C', alignItems: 'center', justifyContent: 'space-between', diff --git a/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx b/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx index 723efa35f..4cde7e076 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/ReferralStats.tsx @@ -9,7 +9,7 @@ interface Props { goalPoints: number; } -const barHeight = 16; +const barHeight = 10; const ReferralStats: FC = ({ currentPoints, goalPoints }) => { const lengthBar = useSharedValue(0); @@ -81,7 +81,7 @@ const styles = StyleSheet.create({ flexDirection: 'row', height: barHeight, borderRadius: barHeight / 2, - backgroundColor: '#ffffff', + backgroundColor: '#1F2A34', overflow: 'hidden', }, levelContainer: { @@ -90,9 +90,11 @@ const styles = StyleSheet.create({ gap: 4, }, levelText: { + fontSize: 12, color: '#0694D3', }, leftPoint: { + fontSize: 12, color: '#798997', }, }); diff --git a/apps/wallet/src/screens/Dashboard/Referral/index.tsx b/apps/wallet/src/screens/Dashboard/Referral/index.tsx index e5e6ac616..e8c1146d8 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/index.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/index.tsx @@ -143,10 +143,11 @@ export const ReferralScreen: FC = () => { points={20} /> ))} - - More Invitation codes are awaiting, stay tuned! - + + + More Invitation codes are awaiting, stay tuned! + ); @@ -161,8 +162,7 @@ const styles = StyleSheet.create({ paddingTop: 8, }, title: { - fontSize: 20, - fontWeight: '700', + fontSize: 18, color: '#ffffff', textAlign: 'center', }, @@ -206,10 +206,9 @@ const styles = StyleSheet.create({ gap: 12, }, referralCodeList: { - flex: 1, gap: 12, }, titleContainer: { - gap: 12, + gap: 4, }, }); From bba266bf5f40cee9ab41a7fc5657cc6355a5c631 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 12:33:31 +0700 Subject: [PATCH 06/10] chore: correct Stack Header title style --- apps/wallet/src/components/StackContainer/Header.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/apps/wallet/src/components/StackContainer/Header.tsx b/apps/wallet/src/components/StackContainer/Header.tsx index 2e907d98d..49665ad2e 100644 --- a/apps/wallet/src/components/StackContainer/Header.tsx +++ b/apps/wallet/src/components/StackContainer/Header.tsx @@ -69,7 +69,7 @@ const styles = StyleSheet.create({ marginBottom: 12, flexDirection: 'row', alignItems: 'center', - gap: 12, + gap: 0, opacity: 0.8, }, burger: { @@ -79,7 +79,7 @@ const styles = StyleSheet.create({ text: { color: '#fff', fontSize: 16, - fontWeight: 'bold', + fontWeight: '500', }, }); From 07d95e78af4bd3f537893fbb59f72cf606ab4ca0 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 12:42:04 +0700 Subject: [PATCH 07/10] chore: expose strokeWidth prop of icons --- packages/icons/components/Check.tsx | 8 ++++++-- packages/icons/components/types.ts | 1 + 2 files changed, 7 insertions(+), 2 deletions(-) diff --git a/packages/icons/components/Check.tsx b/packages/icons/components/Check.tsx index 13ca86117..0b9ac8396 100644 --- a/packages/icons/components/Check.tsx +++ b/packages/icons/components/Check.tsx @@ -3,7 +3,11 @@ import { Polyline, Svg } from 'react-native-svg'; import type { IconProps } from './types'; -export const Check: FC = ({ size = 24, color = '#FFFFFF' }) => { +export const Check: FC = ({ + size = 24, + color = '#FFFFFF', + strokeWidth = '2', +}) => { return ( = ({ size = 24, color = '#FFFFFF' }) => { viewBox="0 0 24 24" fill="none" stroke={color} - strokeWidth="2" + strokeWidth={strokeWidth} strokeLinecap="round" strokeLinejoin="round" > diff --git a/packages/icons/components/types.ts b/packages/icons/components/types.ts index 982fc1058..e47870b42 100644 --- a/packages/icons/components/types.ts +++ b/packages/icons/components/types.ts @@ -2,4 +2,5 @@ export interface IconProps { size?: number; color?: string; colors?: string[]; + strokeWidth?: string; } From 8410bd92a35b72dd7005a48441d3b951ce4cefe7 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 12:43:03 +0700 Subject: [PATCH 08/10] chore: consistent styles of statistic box in both referral and quest --- apps/wallet/src/features/Loyalty/Header.tsx | 10 +++++----- .../screens/Dashboard/Referral/DetailsContainer.tsx | 5 +++-- apps/wallet/src/screens/Dashboard/Referral/index.tsx | 6 +++--- 3 files changed, 11 insertions(+), 10 deletions(-) diff --git a/apps/wallet/src/features/Loyalty/Header.tsx b/apps/wallet/src/features/Loyalty/Header.tsx index 5dd20f485..69bbbcec9 100644 --- a/apps/wallet/src/features/Loyalty/Header.tsx +++ b/apps/wallet/src/features/Loyalty/Header.tsx @@ -31,7 +31,7 @@ const Header: FC = ({ point, completedTask, style }) => { - + Ranking @@ -44,7 +44,7 @@ const Header: FC = ({ point, completedTask, style }) => { onPress={() => showHistory({ safeAreaInsets })} > - + Completed Task @@ -112,9 +112,9 @@ const styles = StyleSheet.create({ borderRadius: 16, }, iconContainer: { - width: 26, - height: 26, - borderRadius: 13, + width: 30, + height: 30, + borderRadius: 15, justifyContent: 'center', alignItems: 'center', }, diff --git a/apps/wallet/src/screens/Dashboard/Referral/DetailsContainer.tsx b/apps/wallet/src/screens/Dashboard/Referral/DetailsContainer.tsx index a5a2731ea..124b31918 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/DetailsContainer.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/DetailsContainer.tsx @@ -35,11 +35,12 @@ const styles = StyleSheet.create({ justifyContent: 'space-between', backgroundColor: '#19232C', gap: 8, - padding: 8, + paddingHorizontal: 12, + paddingVertical: 8, borderRadius: 16, }, title: { - fontSize: 12, + fontSize: 10, color: '#798997', }, value: { diff --git a/apps/wallet/src/screens/Dashboard/Referral/index.tsx b/apps/wallet/src/screens/Dashboard/Referral/index.tsx index e8c1146d8..38d957a89 100644 --- a/apps/wallet/src/screens/Dashboard/Referral/index.tsx +++ b/apps/wallet/src/screens/Dashboard/Referral/index.tsx @@ -52,13 +52,13 @@ export const ReferralScreen: FC = () => { const ChartIcon = ( - + ); const StarIcon = ( - + ); @@ -193,7 +193,7 @@ const styles = StyleSheet.create({ borderRadius: 50, }, icon: { - padding: 8, + padding: 6, borderRadius: 50, borderWidth: 1, }, From 1cfd9811fe022aaaba25ac0d8e519f046258b255 Mon Sep 17 00:00:00 2001 From: Tan Le Date: Sun, 7 Jul 2024 13:00:41 +0700 Subject: [PATCH 09/10] chore: fix explorer styles --- .../features/Explorer/Highlights/index.tsx | 16 ++++++++++--- .../src/features/Explorer/Missions/index.tsx | 16 +++++++++---- .../Explorer/Widgets/CategoryButton.tsx | 4 ++-- .../features/Explorer/Widgets/WidgetItem.tsx | 24 +++++++++---------- .../src/features/Explorer/Widgets/index.tsx | 18 +++++++++++--- 5 files changed, 52 insertions(+), 26 deletions(-) diff --git a/apps/wallet/src/features/Explorer/Highlights/index.tsx b/apps/wallet/src/features/Explorer/Highlights/index.tsx index 8b92dca92..f83ac4415 100644 --- a/apps/wallet/src/features/Explorer/Highlights/index.tsx +++ b/apps/wallet/src/features/Explorer/Highlights/index.tsx @@ -11,7 +11,10 @@ const Highlights = () => { return ( - Today's Highlights + + Today's Highlights + Get started with these apps + = ({ style }) => { return ( - + = ({ style }) => { export default Missions; const styles = StyleSheet.create({ - container: { - marginVertical: 8, + container: {}, + webContainer: { cursor: 'pointer', - }, + } as never, lastMissionContainer: { marginRight: 16, }, diff --git a/apps/wallet/src/features/Explorer/Widgets/CategoryButton.tsx b/apps/wallet/src/features/Explorer/Widgets/CategoryButton.tsx index 178c502d8..2478abd4a 100644 --- a/apps/wallet/src/features/Explorer/Widgets/CategoryButton.tsx +++ b/apps/wallet/src/features/Explorer/Widgets/CategoryButton.tsx @@ -74,8 +74,8 @@ const styles = StyleSheet.create({ container: { paddingHorizontal: 11, paddingVertical: 7, - borderWidth: 1, - borderRadius: 7, + borderWidth: 1.5, + borderRadius: 10, }, title: { fontSize: 12, diff --git a/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx b/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx index c782720d0..d4125e9c5 100644 --- a/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx +++ b/apps/wallet/src/features/Explorer/Widgets/WidgetItem.tsx @@ -3,7 +3,6 @@ import { Image, StyleSheet, View } from 'react-native'; import { TouchableOpacity } from 'react-native-gesture-handler'; import { runtime } from '@walless/core'; import { Text } from '@walless/gui'; -import { Heart } from '@walless/icons'; import type { WidgetDocument } from '@walless/store'; import assets from 'utils/assets'; import { useWidgets } from 'utils/hooks'; @@ -47,10 +46,10 @@ const WidgetItem: FC = ({ widget }) => { {widget.name} - + {widget.storeMeta.description} - + {/* {widget.storeMeta.loveCount} @@ -61,14 +60,14 @@ const WidgetItem: FC = ({ widget }) => { {widget.storeMeta.activeCount} - + */} - {isAdded ? 'OPEN' : 'ADD'} + {isAdded ? 'Open' : 'Add'} @@ -80,10 +79,7 @@ export default WidgetItem; const styles = StyleSheet.create({ container: { flexDirection: 'row', - gap: 8, - backgroundColor: '#23313C', - padding: 8, - borderRadius: 8, + gap: 10, alignItems: 'center', }, coverImage: { @@ -97,7 +93,7 @@ const styles = StyleSheet.create({ }, title: { color: '#ffffff', - fontSize: 16, + fontSize: 14, fontWeight: '500', }, loveAndActiveContainer: { @@ -125,9 +121,9 @@ const styles = StyleSheet.create({ }, button: { alignSelf: 'center', - borderRadius: 6, + borderRadius: 8, width: 62, - height: 28, + height: 30, justifyContent: 'center', alignItems: 'center', }, @@ -140,13 +136,15 @@ const styles = StyleSheet.create({ openBtnText: { color: '#19A3E1', fontSize: 12, + fontWeight: '500', }, addBtnText: { color: '#ffffff', fontSize: 12, + fontWeight: '500', }, description: { - color: '#798997', + color: '#566573', fontSize: 12, }, }); diff --git a/apps/wallet/src/features/Explorer/Widgets/index.tsx b/apps/wallet/src/features/Explorer/Widgets/index.tsx index 340d3d719..5cb9ee2eb 100644 --- a/apps/wallet/src/features/Explorer/Widgets/index.tsx +++ b/apps/wallet/src/features/Explorer/Widgets/index.tsx @@ -15,7 +15,12 @@ const Widgets = () => { return ( - Enhance your collection + + Enhance your collection + + Evolving your worlds filled with exciting events + + Date: Sun, 7 Jul 2024 13:07:32 +0700 Subject: [PATCH 10/10] fix: typecheck with View in forwardRef --- apps/wallet/vendor/web-webview.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/apps/wallet/vendor/web-webview.tsx b/apps/wallet/vendor/web-webview.tsx index 4410bbdfb..80f584d41 100644 --- a/apps/wallet/vendor/web-webview.tsx +++ b/apps/wallet/vendor/web-webview.tsx @@ -2,7 +2,7 @@ import { forwardRef } from 'react'; import { StyleSheet, View } from 'react-native'; import { Text } from '@walless/gui'; -export const WebView = forwardRef((_, ref) => { +export const WebView = forwardRef((_, ref) => { return ( WebView