From 6e914a89fc223662b1c097c59ceff43c858de1b1 Mon Sep 17 00:00:00 2001 From: MSGhais Date: Wed, 21 Aug 2024 22:45:51 +0200 Subject: [PATCH] init screen --- apps/mobile/src/app/Router.tsx | 107 +++++++++--------- apps/mobile/src/assets/icons.tsx | 14 +-- .../src/components/PrivateKeyImport/index.tsx | 4 +- .../src/components/RelaysConfig/index.tsx | 96 +++++++--------- .../src/components/RelaysConfig/styles.ts | 19 ++-- .../pump/TokenLaunchDetail/index.tsx | 67 +++++------ .../search/TokenLaunchCard/index.tsx | 66 +++++------ apps/mobile/src/components/search/index.tsx | 10 +- .../mobile/src/context/Toast/ToastContext.tsx | 4 +- apps/mobile/src/context/Toast/styles.ts | 3 - .../src/modules/Layout/auth-sidebar/index.tsx | 16 +-- .../src/modules/Layout/auth-sidebar/styles.ts | 2 +- apps/mobile/src/modules/Post/index.tsx | 41 ++----- apps/mobile/src/modules/TipModal/index.tsx | 22 ++-- .../src/modules/TipModal/lightning/form.tsx | 43 +++---- apps/mobile/src/screens/Defi/index.tsx | 32 +++--- apps/mobile/src/screens/Feed/index.tsx | 51 +++++---- .../screens/Launchpad/LaunchpadComponent.tsx | 1 - .../src/screens/PrivateGroupDetail/index.tsx | 82 ++++++++++++++ .../src/screens/PrivateGroupDetail/styles.ts | 36 ++++++ apps/mobile/src/screens/Search/index.tsx | 13 ++- apps/mobile/src/screens/Settings/index.tsx | 32 +++--- apps/mobile/src/screens/Settings/styles.ts | 3 +- apps/mobile/src/screens/Tips/index.tsx | 2 +- apps/mobile/src/types/keys.ts | 5 +- apps/mobile/src/types/routes.ts | 8 ++ apps/mobile/src/types/tab.ts | 17 +-- 27 files changed, 424 insertions(+), 372 deletions(-) create mode 100644 apps/mobile/src/screens/PrivateGroupDetail/index.tsx create mode 100644 apps/mobile/src/screens/PrivateGroupDetail/styles.ts diff --git a/apps/mobile/src/app/Router.tsx b/apps/mobile/src/app/Router.tsx index b7a0fd592..f0c1886d9 100644 --- a/apps/mobile/src/app/Router.tsx +++ b/apps/mobile/src/app/Router.tsx @@ -1,38 +1,38 @@ -import { createBottomTabNavigator } from '@react-navigation/bottom-tabs'; -import { createDrawerNavigator } from '@react-navigation/drawer'; -import { NavigationContainer } from '@react-navigation/native'; -import { createNativeStackNavigator } from '@react-navigation/native-stack'; -import { useAuth } from 'afk_nostr_sdk'; -import { useEffect, useMemo, useState } from 'react'; -import { Dimensions, Platform, StyleSheet, useWindowDimensions, View } from 'react-native'; +import {createBottomTabNavigator} from '@react-navigation/bottom-tabs'; +import {createDrawerNavigator} from '@react-navigation/drawer'; +import {NavigationContainer} from '@react-navigation/native'; +import {createNativeStackNavigator} from '@react-navigation/native-stack'; +import {useAuth} from 'afk_nostr_sdk'; +import {useEffect, useMemo, useState} from 'react'; +import {Dimensions, Platform, StyleSheet, useWindowDimensions, View} from 'react-native'; -import { Icon } from '../components'; -import { Navbar } from '../components/Navbar'; -import { useStyles, useTheme } from '../hooks'; -import Sidebar from '../modules/Layout/sidebar'; +import {Icon} from '../components'; +import {Navbar} from '../components/Navbar'; +import {useStyles, useTheme} from '../hooks'; import AuthSidebar from '../modules/Layout/auth-sidebar'; -import { CreateAccount } from '../screens/Auth/CreateAccount'; -import { ImportKeys } from '../screens/Auth/ImportKeys'; -import { Login } from '../screens/Auth/Login'; -import { SaveKeys } from '../screens/Auth/SaveKeys'; -import { ChannelDetail } from '../screens/ChannelDetail'; -import { ChannelsFeed } from '../screens/ChannelsFeed'; -import { CreateChannel } from '../screens/CreateChannel'; -import { CreateForm } from '../screens/CreateForm'; -import { CreatePost } from '../screens/CreatePost'; -import { Defi } from '../screens/Defi'; -import { EditProfile } from '../screens/EditProfile'; -import { Feed } from '../screens/Feed'; -import { Games } from '../screens/Games'; -import { LaunchDetail } from '../screens/LaunchDetail'; -import { PostDetail } from '../screens/PostDetail'; -import { Profile } from '../screens/Profile'; -import { Search } from '../screens/Search'; -import { Settings } from '../screens/Settings'; -import { Tips } from '../screens/Tips'; -import { ThemedStyleSheet } from '../styles'; -import { AuthStackParams, HomeBottomStackParams, MainStackParams, RootStackParams } from '../types'; -import { retrievePublicKey } from '../utils/storage'; +import Sidebar from '../modules/Layout/sidebar'; +import {CreateAccount} from '../screens/Auth/CreateAccount'; +import {ImportKeys} from '../screens/Auth/ImportKeys'; +import {Login} from '../screens/Auth/Login'; +import {SaveKeys} from '../screens/Auth/SaveKeys'; +import {ChannelDetail} from '../screens/ChannelDetail'; +import {ChannelsFeed} from '../screens/ChannelsFeed'; +import {CreateChannel} from '../screens/CreateChannel'; +import {CreateForm} from '../screens/CreateForm'; +import {CreatePost} from '../screens/CreatePost'; +import {Defi} from '../screens/Defi'; +import {EditProfile} from '../screens/EditProfile'; +import {Feed} from '../screens/Feed'; +import {Games} from '../screens/Games'; +import {LaunchDetail} from '../screens/LaunchDetail'; +import {PostDetail} from '../screens/PostDetail'; +import {Profile} from '../screens/Profile'; +import {Search} from '../screens/Search'; +import {Settings} from '../screens/Settings'; +import {Tips} from '../screens/Tips'; +import {ThemedStyleSheet} from '../styles'; +import {AuthStackParams, HomeBottomStackParams, MainStackParams, RootStackParams} from '../types'; +import {retrievePublicKey} from '../utils/storage'; const DrawerStack = createDrawerNavigator(); const RootStack = createNativeStackNavigator(); @@ -44,8 +44,8 @@ const HomeBottomTabsStack = createBottomTabNavigator(); const HomeBottomTabNavigator: React.FC = () => { const styles = useStyles(stylesheet); - const { publicKey } = useAuth(); - const { theme } = useTheme(); + const {publicKey} = useAuth(); + const {theme} = useTheme(); return ( { options={{ tabBarActiveTintColor: 'white', tabBarInactiveTintColor: theme.colors.background, - tabBarIcon: ({ focused }) => ( + tabBarIcon: ({focused}) => ( { options={{ tabBarActiveTintColor: 'white', tabBarInactiveTintColor: 'grey', - tabBarIcon: ({ focused }) => ( + tabBarIcon: ({focused}) => ( { options={{ tabBarActiveTintColor: 'white', tabBarInactiveTintColor: 'grey', - tabBarIcon: ({ focused }) => ( + tabBarIcon: ({focused}) => ( { ( + tabBarIcon: ({focused}) => ( { options={{ tabBarActiveTintColor: 'white', tabBarInactiveTintColor: 'grey', - tabBarIcon: ({ focused }) => ( + tabBarIcon: ({focused}) => ( { return ( } - screenOptions={({ navigation }) => ({ + screenOptions={({navigation}) => ({ // headerShown:false, // header: () => , headerShown: false, @@ -193,7 +193,7 @@ const AuthNavigator: React.FC = () => { overlayColor: isDesktop ? 'transparent' : theme.theme.colors.background, // Make sure overlay settings are correct // swipeEdgeWidth: 0 drawerStyle: { - width: "25%", // Adjust width or other styling as necessary + width: '25%', // Adjust width or other styling as necessary }, })} > @@ -218,7 +218,7 @@ const MainNavigator: React.FC = () => { // screenOptions={{ headerShown: false }} // initialRouteName="Home" drawerContent={(props) => } - screenOptions={({ navigation }) => ({ + screenOptions={({navigation}) => ({ // headerShown:false, header: () => , headerStyle: { @@ -283,9 +283,10 @@ const MainNavigator: React.FC = () => { const linking = { prefixes: [ - "home", "search", - "profile/:publicKey", - "details/:id" + 'home', + 'search', + 'profile/:publicKey', + 'details/:id', /* your linking prefixes */ ], config: { @@ -335,15 +336,13 @@ const linking = { }; const RootNavigator: React.FC = () => { - const { publicKey } = useAuth(); + const {publicKey} = useAuth(); return ( - + {/* */} {publicKey ? ( - + ) : ( )} @@ -356,9 +355,7 @@ export const Router: React.FC = () => { const windowWidth = Dimensions.get('window').width; const shouldShowSidebar = isWeb && windowWidth >= 1024; return ( - + {/* {shouldShowSidebar && } */} diff --git a/apps/mobile/src/assets/icons.tsx b/apps/mobile/src/assets/icons.tsx index e7dca9ef1..9400c6b3e 100644 --- a/apps/mobile/src/assets/icons.tsx +++ b/apps/mobile/src/assets/icons.tsx @@ -1,4 +1,4 @@ -import Svg, { G, Path, Rect, SvgProps } from 'react-native-svg'; +import Svg, {G, Path, Rect, SvgProps} from 'react-native-svg'; export const AddPostIcon: React.FC = (props) => ( @@ -106,8 +106,8 @@ export const AFKIcon: React.FC = (props) => ( ); @@ -242,9 +242,8 @@ export const LikeIcon: React.FC = (props) => { ); }; - export const BookmarkIcon: React.FC = (props) => ( - + = (props) => ( // d="M 12.8125 2 C 12.335938 2.089844 11.992188 2.511719 12 3 L 12 47 C 11.996094 47.359375 12.1875 47.691406 12.496094 47.871094 C 12.804688 48.054688 13.1875 48.054688 13.5 47.875 L 25 41.15625 L 36.5 47.875 C 36.8125 48.054688 37.195313 48.054688 37.503906 47.871094 C 37.8125 47.691406 38.003906 47.359375 38 47 L 38 3 C 38 2.449219 37.550781 2 37 2 L 13 2 C 12.96875 2 12.9375 2 12.90625 2 C 12.875 2 12.84375 2 12.8125 2 Z M 14 4 L 36 4 L 36 45.25 L 25.5 39.125 C 25.191406 38.945313 24.808594 38.945313 24.5 39.125 L 14 45.25 Z" /> - -) - +); export const LikeFillIcon: React.FC = (props) => { return ( @@ -589,7 +586,6 @@ export const MoonIcon: React.FC = (props) => ( ); - export const MenuIcon: React.FC = (props) => ( { const {publicKey, isExtension, privateKey, setAuth} = useAuth(); diff --git a/apps/mobile/src/components/RelaysConfig/index.tsx b/apps/mobile/src/components/RelaysConfig/index.tsx index 3cda62967..ce1af7ccb 100644 --- a/apps/mobile/src/components/RelaysConfig/index.tsx +++ b/apps/mobile/src/components/RelaysConfig/index.tsx @@ -1,57 +1,58 @@ -import { useSettingsStore } from 'afk_nostr_sdk'; -import { useState } from 'react'; -import { View } from 'react-native'; -import { useToast } from '../../hooks/modals'; -import { Input } from '../Input'; -import { Text } from '../Text'; -import { useStyles } from '../../hooks'; -import { Button } from '../Button'; -import { AFK_RELAYS } from 'afk_nostr_sdk/src/utils/relay'; +import {useSettingsStore} from 'afk_nostr_sdk'; +import {AFK_RELAYS} from 'afk_nostr_sdk/src/utils/relay'; +import {useState} from 'react'; +import {View} from 'react-native'; + +import {useStyles} from '../../hooks'; +import {useToast} from '../../hooks/modals'; +import {Button} from '../Button'; +import {Input} from '../Input'; +import {Text} from '../Text'; import stylesheet from './styles'; export const RelaysConfig: React.FC = () => { - const { showToast } = useToast(); - const styles = useStyles(stylesheet) - const { relays, setRelays } = useSettingsStore(); + const {showToast} = useToast(); + const styles = useStyles(stylesheet); + const {relays, setRelays} = useSettingsStore(); const RELAYS_USED = relays; const AFK_DEFAULT_RELAYS = AFK_RELAYS; - const [relaysUpdated, setRelaysUpdated] = useState(relays) - const [openUpdateMenu, setOpenUpdateMenu] = useState(false) - const [relayToAdd, setRelayToAdd] = useState() + const [relaysUpdated, setRelaysUpdated] = useState(relays); + const [openUpdateMenu, setOpenUpdateMenu] = useState(false); + const [relayToAdd, setRelayToAdd] = useState(); const removeRelay = (relay: string) => { - const newRelays = relaysUpdated.filter((r) => r != relay) - console.log("newRelays") - setRelaysUpdated(newRelays) - } + const newRelays = relaysUpdated.filter((r) => r != relay); + console.log('newRelays'); + setRelaysUpdated(newRelays); + }; const addRelay = (relay?: string) => { if (!relay) { - showToast({ type: "error", title: 'Add a relay' }); + showToast({type: 'error', title: 'Add a relay'}); return; } - if (!relay?.includes("wss://")) { - showToast({ type: "error", title: 'add wss://' }); + if (!relay?.includes('wss://')) { + showToast({type: 'error', title: 'add wss://'}); return; } - const newRelays = [...relaysUpdated, relay] + const newRelays = [...relaysUpdated, relay]; /** @TODO add verify validity of the relayer */ - setRelaysUpdated(newRelays) - } + setRelaysUpdated(newRelays); + }; const updateRelayToUsed = () => { - setRelays(relaysUpdated) - } + setRelays(relaysUpdated); + }; const resetDefault = () => { - setRelays(AFK_DEFAULT_RELAYS) - setRelaysUpdated(AFK_DEFAULT_RELAYS) - } + setRelays(AFK_DEFAULT_RELAYS); + setRelaysUpdated(AFK_DEFAULT_RELAYS); + }; const handleOpenMenu = () => { - setOpenUpdateMenu(!openUpdateMenu) - } + setOpenUpdateMenu(!openUpdateMenu); + }; return ( @@ -60,36 +61,29 @@ export const RelaysConfig: React.FC = () => { {RELAYS_USED?.map((r, i) => { return ( - - Relay: {r} - + Relay: {r} ); })} You can setup your relays - - {openUpdateMenu && + {openUpdateMenu && ( {relaysUpdated?.map((r, i) => { return ( - - Relay: {r} - + Relay: {r} - } - + )} ); }; diff --git a/apps/mobile/src/components/RelaysConfig/styles.ts b/apps/mobile/src/components/RelaysConfig/styles.ts index 0910ac3cf..367bd3b27 100644 --- a/apps/mobile/src/components/RelaysConfig/styles.ts +++ b/apps/mobile/src/components/RelaysConfig/styles.ts @@ -1,20 +1,19 @@ -import { Spacing, ThemedStyleSheet } from '../../styles'; +import {Spacing, ThemedStyleSheet} from '../../styles'; export default ThemedStyleSheet((theme) => ({ container: { marginHorizontal: 10, - alignItems:"center" + alignItems: 'center', }, relayItem: { - flex:1, - flexDirection:"row", - gap:3, - alignItems:"center" + flex: 1, + flexDirection: 'row', + gap: 3, + alignItems: 'center', }, relayText: { - width:"100%" - }, - relayButton: { + width: '100%', }, + relayButton: {}, title: { color: theme.colors.text, fontSize: 24, @@ -37,7 +36,7 @@ export default ThemedStyleSheet((theme) => ({ borderRadius: 15, }, button: { - marginVertical: 5 + marginVertical: 5, }, name: { diff --git a/apps/mobile/src/components/pump/TokenLaunchDetail/index.tsx b/apps/mobile/src/components/pump/TokenLaunchDetail/index.tsx index 8e7f1904f..72e880535 100644 --- a/apps/mobile/src/components/pump/TokenLaunchDetail/index.tsx +++ b/apps/mobile/src/components/pump/TokenLaunchDetail/index.tsx @@ -1,23 +1,23 @@ -import { NDKEvent, NDKUserProfile } from '@nostr-dev-kit/ndk'; -import { useNavigation } from '@react-navigation/native'; -import { useAccount } from '@starknet-react/core'; -import { Fraction } from '@uniswap/sdk-core'; -import { useProfile } from 'afk_nostr_sdk'; -import { useState } from 'react'; -import { ImageSourcePropType, View } from 'react-native'; - -import { useStyles, useWaitConnection } from '../../../hooks'; -import { useBuyCoinByQuoteAmount } from '../../../hooks/launchpad/useBuyCoinByQuoteAmount'; -import { useSellCoin } from '../../../hooks/launchpad/useSellCoin'; -import { useWalletModal } from '../../../hooks/modals'; +import {NDKEvent, NDKUserProfile} from '@nostr-dev-kit/ndk'; +import {useNavigation} from '@react-navigation/native'; +import {useAccount} from '@starknet-react/core'; +import {Fraction} from '@uniswap/sdk-core'; +import {useProfile} from 'afk_nostr_sdk'; +import {useState} from 'react'; +import {ImageSourcePropType, View} from 'react-native'; + +import {useStyles, useWaitConnection} from '../../../hooks'; +import {useBuyCoinByQuoteAmount} from '../../../hooks/launchpad/useBuyCoinByQuoteAmount'; +import {useSellCoin} from '../../../hooks/launchpad/useSellCoin'; +import {useWalletModal} from '../../../hooks/modals'; // import {useProfile} from '../../hooks'; -import { MainStackNavigationProps } from '../../../types'; -import { TokenLaunchInterface } from '../../../types/keys'; -import { feltToAddress } from '../../../utils/format'; -import { decimalsScale } from '../../../utils/helpers'; -import { Button } from '../../Button'; -import { Input } from '../../Input'; -import { Text } from '../../Text'; +import {MainStackNavigationProps} from '../../../types'; +import {TokenLaunchInterface} from '../../../types/keys'; +import {feltToAddress} from '../../../utils/format'; +import {decimalsScale} from '../../../utils/helpers'; +import {Button} from '../../Button'; +import {Input} from '../../Input'; +import {Text} from '../../Text'; import stylesheet from './styles'; export type LaunchCoinProps = { @@ -41,7 +41,7 @@ export const TokenLaunchDetail: React.FC = ({ event, isViewDetailDisabled, }) => { - const { data: profile } = useProfile({ publicKey: event?.pubkey }); + const {data: profile} = useProfile({publicKey: event?.pubkey}); const account = useAccount(); const styles = useStyles(stylesheet); @@ -49,9 +49,9 @@ export const TokenLaunchDetail: React.FC = ({ const [amount, setAmount] = useState(); const [typeAmount, setTypeAmount] = useState(AmountType.QUOTE_AMOUNT); - const { handleSellCoins } = useSellCoin(); + const {handleSellCoins} = useSellCoin(); // const { handleBuyKeys } = useBuyKeys() - const { handleBuyCoins } = useBuyCoinByQuoteAmount(); + const {handleBuyCoins} = useBuyCoinByQuoteAmount(); const waitConnection = useWaitConnection(); const walletModal = useWalletModal(); @@ -163,24 +163,17 @@ export const TokenLaunchDetail: React.FC = ({ - - {launch?.threshold_liquidity && + {launch?.threshold_liquidity && ( Threshold liquidity: {Number(launch?.threshold_liquidity)} + )} - } - - {launch?.liquidity_raised && - Raised: {Number(launch?.liquidity_raised)} - } + {launch?.liquidity_raised && Raised: {Number(launch?.liquidity_raised)}} - {launch?.is_liquidity_launch && + {launch?.is_liquidity_launch && ( Is launched in DEX: {Number(launch?.is_liquidity_launch)} - } - - + )} - {launch?.token_quote && ( = ({ }} placeholder="Amount" /> - - - diff --git a/apps/mobile/src/components/search/TokenLaunchCard/index.tsx b/apps/mobile/src/components/search/TokenLaunchCard/index.tsx index 1daeccea7..946b1ccdb 100644 --- a/apps/mobile/src/components/search/TokenLaunchCard/index.tsx +++ b/apps/mobile/src/components/search/TokenLaunchCard/index.tsx @@ -1,23 +1,23 @@ -import { NDKEvent, NDKUserProfile } from '@nostr-dev-kit/ndk'; -import { useNavigation } from '@react-navigation/native'; -import { useAccount } from '@starknet-react/core'; -import { Fraction } from '@uniswap/sdk-core'; -import { useProfile } from 'afk_nostr_sdk'; -import { useState } from 'react'; -import { ImageSourcePropType, View } from 'react-native'; - -import { useStyles, useWaitConnection } from '../../../hooks'; -import { useBuyCoinByQuoteAmount } from '../../../hooks/launchpad/useBuyCoinByQuoteAmount'; -import { useSellCoin } from '../../../hooks/launchpad/useSellCoin'; -import { useWalletModal } from '../../../hooks/modals'; +import {NDKEvent, NDKUserProfile} from '@nostr-dev-kit/ndk'; +import {useNavigation} from '@react-navigation/native'; +import {useAccount} from '@starknet-react/core'; +import {Fraction} from '@uniswap/sdk-core'; +import {useProfile} from 'afk_nostr_sdk'; +import {useState} from 'react'; +import {ImageSourcePropType, View} from 'react-native'; + +import {useStyles, useWaitConnection} from '../../../hooks'; +import {useBuyCoinByQuoteAmount} from '../../../hooks/launchpad/useBuyCoinByQuoteAmount'; +import {useSellCoin} from '../../../hooks/launchpad/useSellCoin'; +import {useWalletModal} from '../../../hooks/modals'; // import {useProfile} from '../../hooks'; -import { MainStackNavigationProps } from '../../../types'; -import { TokenLaunchInterface } from '../../../types/keys'; -import { feltToAddress } from '../../../utils/format'; -import { decimalsScale } from '../../../utils/helpers'; -import { Button } from '../../Button'; -import { Input } from '../../Input'; -import { Text } from '../../Text'; +import {MainStackNavigationProps} from '../../../types'; +import {TokenLaunchInterface} from '../../../types/keys'; +import {feltToAddress} from '../../../utils/format'; +import {decimalsScale} from '../../../utils/helpers'; +import {Button} from '../../Button'; +import {Input} from '../../Input'; +import {Text} from '../../Text'; import stylesheet from './styles'; export type LaunchCoinProps = { @@ -41,7 +41,7 @@ export const TokenLaunchCard: React.FC = ({ event, isViewDetailDisabled, }) => { - const { data: profile } = useProfile({ publicKey: event?.pubkey }); + const {data: profile} = useProfile({publicKey: event?.pubkey}); const account = useAccount(); const styles = useStyles(stylesheet); @@ -49,9 +49,9 @@ export const TokenLaunchCard: React.FC = ({ const [amount, setAmount] = useState(); const [typeAmount, setTypeAmount] = useState(AmountType.QUOTE_AMOUNT); - const { handleSellCoins } = useSellCoin(); + const {handleSellCoins} = useSellCoin(); // const { handleBuyKeys } = useBuyKeys() - const { handleBuyCoins } = useBuyCoinByQuoteAmount(); + const {handleBuyCoins} = useBuyCoinByQuoteAmount(); const waitConnection = useWaitConnection(); const walletModal = useWalletModal(); @@ -163,23 +163,17 @@ export const TokenLaunchCard: React.FC = ({ - {launch?.threshold_liquidity && + {launch?.threshold_liquidity && ( Threshold liquidity: {Number(launch?.threshold_liquidity)} + )} - } - - {launch?.liquidity_raised && - Raised: {Number(launch?.liquidity_raised)} - } + {launch?.liquidity_raised && Raised: {Number(launch?.liquidity_raised)}} - {launch?.is_liquidity_launch && + {launch?.is_liquidity_launch && ( Is launched in DEX: {Number(launch?.is_liquidity_launch)} - } - - + )} - {launch?.token_quote && ( = ({ }} placeholder="Amount" /> - - - diff --git a/apps/mobile/src/components/search/index.tsx b/apps/mobile/src/components/search/index.tsx index a459b2d68..6d3a6cad0 100644 --- a/apps/mobile/src/components/search/index.tsx +++ b/apps/mobile/src/components/search/index.tsx @@ -1,18 +1,18 @@ +import {NDKKind} from '@nostr-dev-kit/ndk'; import React from 'react'; import {TextInput, View} from 'react-native'; import Svg, {Path} from 'react-native-svg'; import {useStyles} from '../../hooks'; import stylesheet from './styles'; -import { NDKKind } from '@nostr-dev-kit/ndk'; interface ISearchComponent { searchQuery?: string; setSearchQuery: (search: string) => void; - kinds?:NDKKind[]; - setKinds?:(kinds:NDKKind[]) => void; - isOpenFilter?:boolean; - setIsOpenFilter?:(isOpen:boolean)=> void; + kinds?: NDKKind[]; + setKinds?: (kinds: NDKKind[]) => void; + isOpenFilter?: boolean; + setIsOpenFilter?: (isOpen: boolean) => void; } const SearchComponent = ({searchQuery, setSearchQuery}: ISearchComponent) => { // const [searchQuery, setSearchQuery] = useState(''); diff --git a/apps/mobile/src/context/Toast/ToastContext.tsx b/apps/mobile/src/context/Toast/ToastContext.tsx index db9df5522..b24f663f6 100644 --- a/apps/mobile/src/context/Toast/ToastContext.tsx +++ b/apps/mobile/src/context/Toast/ToastContext.tsx @@ -4,9 +4,9 @@ import {View} from 'react-native'; import {SafeAreaView} from 'react-native-safe-area-context'; import {ToastProps} from '../../components/Toast'; +import {useStyles} from '../../hooks'; import {AnimatedToast} from './AnimatedToast'; import stylesheet from './styles'; -import { useStyles } from '../../hooks'; export type ToastConfig = ToastProps & { key: string; @@ -21,7 +21,7 @@ export type ToastContextType = { export const ToastContext = createContext(null); export const ToastProvider: React.FC<{children: React.ReactNode}> = ({children}) => { - const styles = useStyles(stylesheet) + const styles = useStyles(stylesheet); const [toasts, setToasts] = useState([]); const hideToast = useCallback((key: string) => { setToasts((prev) => prev.filter((t) => t.key !== key)); diff --git a/apps/mobile/src/context/Toast/styles.ts b/apps/mobile/src/context/Toast/styles.ts index 60cb0a446..ebef29cc3 100644 --- a/apps/mobile/src/context/Toast/styles.ts +++ b/apps/mobile/src/context/Toast/styles.ts @@ -1,10 +1,7 @@ -import {StyleSheet} from 'react-native'; - import {Spacing, ThemedStyleSheet} from '../../styles'; // export default StyleSheet.create({ export default ThemedStyleSheet((theme) => ({ - // export default StyleSheet.create({ container: { position: 'absolute', diff --git a/apps/mobile/src/modules/Layout/auth-sidebar/index.tsx b/apps/mobile/src/modules/Layout/auth-sidebar/index.tsx index 76427f28c..8a3f3723f 100644 --- a/apps/mobile/src/modules/Layout/auth-sidebar/index.tsx +++ b/apps/mobile/src/modules/Layout/auth-sidebar/index.tsx @@ -1,12 +1,13 @@ -import React, { useEffect } from 'react'; -import { Text, View } from 'react-native'; -import { useStyles, useTheme } from '../../../hooks'; +import React, {useEffect} from 'react'; +import {Text, View} from 'react-native'; + +import {useStyles} from '../../../hooks'; import stylesheet from './styles'; interface SidebarInterface { navigation: any; } -const AuthSidebar = ({ navigation }: SidebarInterface) => { +const AuthSidebar = ({navigation}: SidebarInterface) => { const styles = useStyles(stylesheet); useEffect(() => { @@ -23,10 +24,8 @@ const AuthSidebar = ({ navigation }: SidebarInterface) => { All-in-one platform - - Connect or create an Account Acces the AFK app @@ -35,11 +34,8 @@ const AuthSidebar = ({ navigation }: SidebarInterface) => { Coming soon also in IOS and Android - - - + - ); }; diff --git a/apps/mobile/src/modules/Layout/auth-sidebar/styles.ts b/apps/mobile/src/modules/Layout/auth-sidebar/styles.ts index 35772d55f..6976c4846 100644 --- a/apps/mobile/src/modules/Layout/auth-sidebar/styles.ts +++ b/apps/mobile/src/modules/Layout/auth-sidebar/styles.ts @@ -2,7 +2,7 @@ import {Spacing, ThemedStyleSheet} from '../../../styles'; export default ThemedStyleSheet((theme) => ({ container: { - marginVertical:10, + marginVertical: 10, color: theme.colors.text, }, sidebar: { diff --git a/apps/mobile/src/modules/Post/index.tsx b/apps/mobile/src/modules/Post/index.tsx index 735918665..1df47b47c 100644 --- a/apps/mobile/src/modules/Post/index.tsx +++ b/apps/mobile/src/modules/Post/index.tsx @@ -34,7 +34,7 @@ export const Post: React.FC = ({asComment, event}) => { const {theme} = useTheme(); const styles = useStyles(stylesheet); - const {showToast} = useToast() + const {showToast} = useToast(); const navigation = useNavigation(); @@ -120,18 +120,13 @@ export const Post: React.FC = ({asComment, event}) => { ); }; + const handleRepost = async () => { + showToast({title: 'Repost coming soon', type: 'info'}); + }; - const handleRepost = async() => { - - showToast({title:"Repost coming soon", type:"info"}) - - } - - const handleBookmarkList = async() => { - - showToast({title:"Bookmark and List coming soon", type:"info"}) - - } + const handleBookmarkList = async () => { + showToast({title: 'Bookmark and List coming soon', type: 'info'}); + }; const content = event?.content || ''; const truncatedContent = content.length > 200 ? `${content.slice(0, 200)}...` : content; @@ -271,39 +266,27 @@ export const Post: React.FC = ({asComment, event}) => { showTipModal(event); }} > - + { if (!event) return; - handleRepost() + handleRepost(); }} > - + { if (!event) return; - handleBookmarkList() + handleBookmarkList(); }} > - + diff --git a/apps/mobile/src/modules/TipModal/index.tsx b/apps/mobile/src/modules/TipModal/index.tsx index d623dec0f..98dfb02c2 100644 --- a/apps/mobile/src/modules/TipModal/index.tsx +++ b/apps/mobile/src/modules/TipModal/index.tsx @@ -1,13 +1,13 @@ -import { NDKEvent } from '@nostr-dev-kit/ndk'; -import { forwardRef, useState } from 'react'; -import { Pressable, View } from 'react-native'; +import {NDKEvent} from '@nostr-dev-kit/ndk'; +import {forwardRef, useState} from 'react'; +import {Pressable, View} from 'react-native'; -import { Modalize, Text } from '../../components'; -import { useStyles, useTheme } from '../../hooks'; -import { TipSuccessModalProps } from '../TipSuccessModal'; -import { FormTipStarknet } from './starknet/form'; +import {Modalize, Text} from '../../components'; +import {useStyles, useTheme} from '../../hooks'; +import {TipSuccessModalProps} from '../TipSuccessModal'; +import {FormLightningZap} from './lightning/form'; +import {FormTipStarknet} from './starknet/form'; import stylesheet from './styles'; -import { FormLightningZap } from './lightning/form'; export type TipModal = Modalize; @@ -25,7 +25,7 @@ export type TipModalProps = { }; export const TipModal = forwardRef( - ({ event, hide: hideTipModal, showSuccess, hideSuccess, show, hide }, ref) => { + ({event, hide: hideTipModal, showSuccess, hideSuccess, show, hide}, ref) => { const styles = useStyles(stylesheet); const [tipType, setTipType] = useState(TipTypeMode.STARKNET); const theme = useTheme(); @@ -57,7 +57,7 @@ export const TipModal = forwardRef( backgroundColor: tipType == TipTypeMode.STARKNET ? theme.theme.colors.primary : '', }} > - Starknet tip + Starknet tip setTipType(TipTypeMode.ZAP)} @@ -67,7 +67,7 @@ export const TipModal = forwardRef( backgroundColor: tipType == TipTypeMode.ZAP ? theme.theme.colors.primary : '', }} > - Zap + Zap {tipType == TipTypeMode.STARKNET && ( diff --git a/apps/mobile/src/modules/TipModal/lightning/form.tsx b/apps/mobile/src/modules/TipModal/lightning/form.tsx index eba12d371..c8b79fd7d 100644 --- a/apps/mobile/src/modules/TipModal/lightning/form.tsx +++ b/apps/mobile/src/modules/TipModal/lightning/form.tsx @@ -1,21 +1,12 @@ -import { NDKEvent } from '@nostr-dev-kit/ndk'; -import { useAccount } from '@starknet-react/core'; -import { useProfile } from 'afk_nostr_sdk'; -import React, { useState } from 'react'; -import { View } from 'react-native'; -import { CallData, uint256 } from 'starknet'; - -import { Avatar, Button, Input, Modalize, Picker, Text } from '../../../components'; -import { ESCROW_ADDRESSES } from '../../../constants/contracts'; -import { CHAIN_ID } from '../../../constants/env'; -import { DEFAULT_TIMELOCK, Entrypoint } from '../../../constants/misc'; -import { TOKENS, TokenSymbol } from '../../../constants/tokens'; -import { useStyles, useWaitConnection } from '../../../hooks'; -import { useToast, useTransactionModal } from '../../../hooks/modals'; -import { useDialog } from '../../../hooks/modals/useDialog'; -import { useTransaction } from '../../../hooks/modals/useTransaction'; -import { useWalletModal } from '../../../hooks/modals/useWalletModal'; -import { TipSuccessModalProps } from '../../TipSuccessModal'; +import {NDKEvent} from '@nostr-dev-kit/ndk'; +import {useProfile} from 'afk_nostr_sdk'; +import React, {useState} from 'react'; +import {View} from 'react-native'; + +import {Avatar, Button, Input, Modalize, Text} from '../../../components'; +import {useStyles} from '../../../hooks'; +import {useToast} from '../../../hooks/modals'; +import {TipSuccessModalProps} from '../../TipSuccessModal'; import stylesheet from './styles'; export type TipModalLightning = Modalize; @@ -39,17 +30,16 @@ export const FormLightningZap: React.FC = ({ const styles = useStyles(stylesheet); const [amount, setAmount] = useState(''); - const { data: profile } = useProfile({ publicKey: event?.pubkey }); - const { showToast } = useToast() + const {data: profile} = useProfile({publicKey: event?.pubkey}); + const {showToast} = useToast(); const isActive = !!amount; const onTipPress = () => { - showToast({ title: "ZAP coming soon", type: "info" }) - } + showToast({title: 'ZAP coming soon', type: 'info'}); + }; return ( - ZAP Coming soon @@ -101,15 +91,10 @@ export const FormLightningZap: React.FC = ({ - - - diff --git a/apps/mobile/src/screens/Defi/index.tsx b/apps/mobile/src/screens/Defi/index.tsx index 7879f7baa..5498d4d92 100644 --- a/apps/mobile/src/screens/Defi/index.tsx +++ b/apps/mobile/src/screens/Defi/index.tsx @@ -1,14 +1,15 @@ -import { useState } from 'react'; -import { KeyboardAvoidingView, Text, View } from 'react-native'; -import { SafeAreaView } from 'react-native-safe-area-context'; -import { TextButton } from '../../components'; -import { useStyles } from '../../hooks'; -import { DefiScreenProps } from '../../types'; -import { SelectedTab, TABS_DEFI } from '../../types/tab'; -import stylesheet from './styles'; +import {useState} from 'react'; +import {KeyboardAvoidingView, Text, View} from 'react-native'; +import {SafeAreaView} from 'react-native-safe-area-context'; + +import {TextButton} from '../../components'; import TabSelector from '../../components/TabSelector'; +import {useStyles} from '../../hooks'; +import {DefiScreenProps} from '../../types'; +import {SelectedTab, TABS_DEFI} from '../../types/tab'; +import stylesheet from './styles'; -export const Defi: React.FC = ({ navigation }) => { +export const Defi: React.FC = ({navigation}) => { const styles = useStyles(stylesheet); const [selectedTab, setSelectedTab] = useState(SelectedTab.BTC_FI_VAULT); @@ -38,18 +39,17 @@ export const Defi: React.FC = ({ navigation }) => { DeFi, Ramp and more soon Stay tuned for the AFK Fi - {selectedTab == SelectedTab.BTC_FI_VAULT && + {selectedTab == SelectedTab.BTC_FI_VAULT && ( - Vault coming soon + Vault coming soon - } + )} - {selectedTab == SelectedTab.BTC_BRIDGE && + {selectedTab == SelectedTab.BTC_BRIDGE && ( - Brdige coming soon + Brdige coming soon - } - + )} diff --git a/apps/mobile/src/screens/Feed/index.tsx b/apps/mobile/src/screens/Feed/index.tsx index 8cc8b3f9f..e8ca1d97a 100644 --- a/apps/mobile/src/screens/Feed/index.tsx +++ b/apps/mobile/src/screens/Feed/index.tsx @@ -1,19 +1,19 @@ -import { NDKKind } from '@nostr-dev-kit/ndk'; -import { useAllProfiles, useSearchNotes } from 'afk_nostr_sdk'; -import { useState } from 'react'; -import { FlatList, Image, Pressable, RefreshControl, View } from 'react-native'; +import {NDKKind} from '@nostr-dev-kit/ndk'; +import {useAllProfiles, useSearchNotes} from 'afk_nostr_sdk'; +import {useState} from 'react'; +import {FlatList, Image, Pressable, RefreshControl, View} from 'react-native'; -import { AddPostIcon } from '../../assets/icons'; -import { BubbleUser } from '../../components/BubbleUser'; +import {AddPostIcon} from '../../assets/icons'; +import {BubbleUser} from '../../components/BubbleUser'; import SearchComponent from '../../components/search'; -import { useStyles, useTheme } from '../../hooks'; -import { ChannelComponent } from '../../modules/ChannelCard'; -import { PostCard } from '../../modules/PostCard'; -import { FeedScreenProps } from '../../types'; +import {useStyles, useTheme} from '../../hooks'; +import {ChannelComponent} from '../../modules/ChannelCard'; +import {PostCard} from '../../modules/PostCard'; +import {FeedScreenProps} from '../../types'; import stylesheet from './styles'; -export const Feed: React.FC = ({ navigation }) => { - const { theme } = useTheme(); +export const Feed: React.FC = ({navigation}) => { + const {theme} = useTheme(); const styles = useStyles(stylesheet); const profiles = useAllProfiles(); const [search, setSearch] = useState(undefined); @@ -21,15 +21,22 @@ export const Feed: React.FC = ({ navigation }) => { const [isAllKinds, setIsAllKinds] = useState(false); const [isFilterOpen, setISFilterOpen] = useState(false); const [isOpenProfile, setIsOpenProfile] = useState(false); - const [kinds, setKinds] = useState([NDKKind.Text, NDKKind.ChannelCreation, NDKKind.GroupChat, NDKKind.ChannelMessage]) + const [kinds, setKinds] = useState([ + NDKKind.Text, + NDKKind.ChannelCreation, + NDKKind.GroupChat, + NDKKind.ChannelMessage, + NDKKind.Metadata, + ]); const notes = useSearchNotes({ // search: search, - kinds: kinds, + kinds, }); - const profilesSearch = profiles?.data?.pages?.flat().map((item) => { - item?.content?.includes(search) && search && search?.length > 0 - }) ?? []; + const profilesSearch = + profiles?.data?.pages?.flat().map((item) => { + item?.content?.includes(search) && search && search?.length > 0; + }) ?? []; return ( @@ -85,22 +92,22 @@ export const Feed: React.FC = ({ navigation }) => { } // data={stories} ItemSeparatorComponent={() => } - renderItem={({ item }) => { - if(!item?.content?.includes(search) && search && search?.length > 0) return <> + renderItem={({item}) => { + if (!item?.content?.includes(search) && search && search?.length > 0) return <>; return ( - ) + ); }} /> } contentContainerStyle={styles.flatListContent} data={notes.data?.pages.flat()} keyExtractor={(item) => item?.id} - renderItem={({ item }) => { + renderItem={({item}) => { if (!item?.content?.includes(search) && search && search?.length > 0) return <>; if (item?.kind == NDKKind.ChannelCreation || item?.kind == NDKKind.ChannelMetadata) { return ; @@ -117,7 +124,7 @@ export const Feed: React.FC = ({ navigation }) => { navigation.navigate('MainStack', { screen: 'CreateForm' })} + onPress={() => navigation.navigate('MainStack', {screen: 'CreateForm'})} > diff --git a/apps/mobile/src/screens/Launchpad/LaunchpadComponent.tsx b/apps/mobile/src/screens/Launchpad/LaunchpadComponent.tsx index 6f63a64a2..cf0479425 100644 --- a/apps/mobile/src/screens/Launchpad/LaunchpadComponent.tsx +++ b/apps/mobile/src/screens/Launchpad/LaunchpadComponent.tsx @@ -6,7 +6,6 @@ import {ActivityIndicator, FlatList, RefreshControl, Text, View} from 'react-nat import {Button} from '../../components'; import {TokenLaunchCard} from '../../components/search/TokenLaunchCard'; import {useStyles, useTheme, useWindowDimensions} from '../../hooks'; -import {useGetTokenLaunch} from '../../hooks/api/indexer/useLaunchTokens'; import {useQueryAllLaunch} from '../../hooks/launchpad/useQueryAllLaunch'; import {useKeyModal} from '../../hooks/modals/useKeyModal'; import {useTokenCreatedModal} from '../../hooks/modals/useTokenCreateModal'; diff --git a/apps/mobile/src/screens/PrivateGroupDetail/index.tsx b/apps/mobile/src/screens/PrivateGroupDetail/index.tsx new file mode 100644 index 000000000..1f9f95dac --- /dev/null +++ b/apps/mobile/src/screens/PrivateGroupDetail/index.tsx @@ -0,0 +1,82 @@ +import {useQueryClient} from '@tanstack/react-query'; +import {useNote, useReplyNotes} from 'afk_nostr_sdk'; +import {useState} from 'react'; +import {FlatList, RefreshControl, View} from 'react-native'; + +import {Divider, IconButton, Input, KeyboardFixedView} from '../../components'; +import {useStyles} from '../../hooks'; +import {useToast} from '../../hooks/modals'; +import {Post} from '../../modules/Post'; +import {PrivateGroupScreenProps} from '../../types'; +import stylesheet from './styles'; + +export const PrivateGroupDetail: React.FC = ({navigation, route}) => { + const {postId, post} = route.params; + + const styles = useStyles(stylesheet); + const [comment, setComment] = useState(''); + // const sendNote = useSendNote(); + const {data: note = post} = useNote({noteId: postId}); + const comments = useReplyNotes({noteId: note?.id}); + const queryClient = useQueryClient(); + const {showToast} = useToast(); + + return ( + + {/*
} + right={} + title="Conversation" + /> */} + + + + + + + + + + + + } + ItemSeparatorComponent={() => } + renderItem={({item}) => ( + + + + )} + refreshControl={ + comments.refetch()} /> + } + onEndReached={() => comments.fetchNextPage()} + /> + + + + + + + + + + + + + ); +}; diff --git a/apps/mobile/src/screens/PrivateGroupDetail/styles.ts b/apps/mobile/src/screens/PrivateGroupDetail/styles.ts new file mode 100644 index 000000000..6f126da5b --- /dev/null +++ b/apps/mobile/src/screens/PrivateGroupDetail/styles.ts @@ -0,0 +1,36 @@ +import {Spacing, ThemedStyleSheet} from '../../styles'; + +export default ThemedStyleSheet((theme) => ({ + container: { + flex: 1, + }, + content: { + flex: 1, + backgroundColor: theme.colors.surface, + }, + + post: { + paddingVertical: Spacing.small, + paddingHorizontal: Spacing.pagePadding, + }, + comment: { + paddingVertical: Spacing.large, + paddingHorizontal: Spacing.pagePadding, + }, + + commentInputContainer: { + backgroundColor: theme.colors.surface, + }, + commentInputContent: { + gap: Spacing.small, + flexDirection: 'row', + alignItems: 'center', + paddingVertical: Spacing.xsmall, + paddingHorizontal: Spacing.pagePadding, + backgroundColor: theme.colors.surface, + }, + commentInput: { + flex: 1, + width: 'auto', + }, +})); diff --git a/apps/mobile/src/screens/Search/index.tsx b/apps/mobile/src/screens/Search/index.tsx index 259f5677f..753af048a 100644 --- a/apps/mobile/src/screens/Search/index.tsx +++ b/apps/mobile/src/screens/Search/index.tsx @@ -20,15 +20,20 @@ export const Search: React.FC = ({navigation}) => { const [search, setSearch] = useState(undefined); const [kindSelected, setKindSelected] = useState(NDKKind.Text); const [kindsArray, setKindsSelected] = useState([]); - + const [isAllKinds, setIsAllKinds] = useState(false); const [isFilterOpen, setISFilterOpen] = useState(false); const [isOpenProfile, setIsOpenProfile] = useState(false); - - const [kinds, setKinds] = useState([NDKKind.Text, NDKKind.ChannelCreation, NDKKind.GroupChat, NDKKind.ChannelMessage]) + + const [kinds, setKinds] = useState([ + NDKKind.Text, + NDKKind.ChannelCreation, + NDKKind.GroupChat, + NDKKind.ChannelMessage, + ]); const notes = useSearchNotes({ // search: search, - kinds: kinds, + kinds, }); // const profiles = useAllProfiles({ diff --git a/apps/mobile/src/screens/Settings/index.tsx b/apps/mobile/src/screens/Settings/index.tsx index 051d8db61..e95370ba2 100644 --- a/apps/mobile/src/screens/Settings/index.tsx +++ b/apps/mobile/src/screens/Settings/index.tsx @@ -1,21 +1,18 @@ -import { useAuth, useSettingsStore } from 'afk_nostr_sdk'; -import { Text, View } from 'react-native'; -import { ScrollView } from 'react-native-gesture-handler'; -import { SafeAreaView } from 'react-native-safe-area-context'; +import {useAuth} from 'afk_nostr_sdk'; +import {Text, View} from 'react-native'; -import { Button, Divider, Icon, IconButton } from '../../components'; -import { HeaderScreen } from '../../components/HeaderScreen'; -import { PrivateKeyImport } from '../../components/PrivateKeyImport'; -import { useStyles, useTheme } from '../../hooks'; -import { useToast } from '../../hooks/modals'; -import { SettingsScreenProps } from '../../types'; +import {Button, Divider, Icon, IconButton} from '../../components'; +import {HeaderScreen} from '../../components/HeaderScreen'; +import {PrivateKeyImport} from '../../components/PrivateKeyImport'; +import {RelaysConfig} from '../../components/RelaysConfig'; +import {useStyles, useTheme} from '../../hooks'; +import {SettingsScreenProps} from '../../types'; import stylesheet from './styles'; -import { RelaysConfig } from '../../components/RelaysConfig'; -export const Settings: React.FC = ({ navigation }) => { +export const Settings: React.FC = ({navigation}) => { const styles = useStyles(stylesheet); - const { theme, toggleTheme } = useTheme(); - const { publicKey, isExtension } = useAuth(); + const {theme, toggleTheme} = useTheme(); + const {publicKey, isExtension} = useAuth(); return ( = ({ navigation }) => { icon="ChevronLeftIcon" size={24} onPress={() => { - navigation.navigate('Profile', { publicKey }); + navigation.navigate('Profile', {publicKey}); // navigation.goBack }} /> @@ -45,10 +42,7 @@ export const Settings: React.FC = ({ navigation }) => { /> */} -