Merge branch 'main' into feat/claim_to

MSghais · Jun 26, 2024 · c50d021 · c50d021
2 parents 671c570 + b2e19e4
commit c50d021
Show file tree

Hide file tree

Showing 13 changed files with 145 additions and 57 deletions.
diff --git a/JoyboyCommunity/assets/joyboy-logo-splash.png b/JoyboyCommunity/assets/joyboy-logo-splash.png
diff --git a/JoyboyCommunity/assets/joyboy-logo.png b/JoyboyCommunity/assets/joyboy-logo.png
diff --git a/JoyboyCommunity/src/app/App.tsx b/JoyboyCommunity/src/app/App.tsx
@@ -30,8 +30,6 @@ export default function App() {
           'Poppins-SemiBold': require('../../assets/fonts/Poppins/Poppins-SemiBold.ttf'),
           'Poppins-Bold': require('../../assets/fonts/Poppins/Poppins-Bold.ttf'),
         });
-
-        await ndk.connect();
       } catch (e) {
         console.warn(e);
       } finally {

diff --git a/JoyboyCommunity/src/app/StarknetProvider.tsx b/JoyboyCommunity/src/app/StarknetProvider.tsx
@@ -1,8 +1,8 @@
 import {sepolia} from '@starknet-react/chains';
 import {
   argent,
+  blastProvider,
   braavos,
-  infuraProvider,
   StarknetConfig,
   useInjectedConnectors,
   voyager,
@@ -29,7 +29,7 @@ export const StarknetReactProvider: React.FC<React.PropsWithChildren> = ({childr
 
   const argentMobileConnector = useArgentMobileConnector();
 
-  const providers = infuraProvider({apiKey: '98f462b6b2644cadae88bdb695e467bf'});
+  const providers = blastProvider({apiKey: '798a58fa-a3d6-4e14-869c-a4c3494c10b4'});
   const provider = providers(sepolia);
 
   return (

diff --git a/JoyboyCommunity/src/components/Avatar/index.tsx b/JoyboyCommunity/src/components/Avatar/index.tsx
@@ -26,7 +26,7 @@ export const Avatar: React.FC<AvatarProps> = ({size, source}) => {
             width="96"
             height="96"
             preserveAspectRatio="xMinYMin slice"
-            xlinkHref={source}
+            href={source}
           />
         </Pattern>
       </Defs>

diff --git a/JoyboyCommunity/src/components/Avatar/index.web.tsx b/JoyboyCommunity/src/components/Avatar/index.web.tsx
@@ -0,0 +1,20 @@
+import {Image, ImageProps, StyleSheet, View} from 'react-native';
+
+export type AvatarProps = ImageProps & {
+  size?: number;
+};
+
+export const Avatar: React.FC<AvatarProps> = ({size, source}) => {
+  return (
+    <View style={[{width: size, height: size}, styles.container]}>
+      <Image source={source} style={{width: size, height: size}} />
+    </View>
+  );
+};
+
+const styles = StyleSheet.create({
+  container: {
+    borderRadius: 99,
+    overflow: 'hidden',
+  },
+});
diff --git a/JoyboyCommunity/src/components/Header/index.tsx b/JoyboyCommunity/src/components/Header/index.tsx
@@ -25,7 +25,7 @@ export const Header: React.FC<HeaderProps> = ({showLogo = true, left, right, tit
 
         {showLogo && (
           <View style={styles.logoContainer}>
-            <Image style={styles.logo} source={require('../../../assets/joyboy-logo.png')} />
+            <Image style={styles.logo} source={require('../../assets/joyboy-logo.png')} />
 
             <JoyboyIcon color={theme.colors.text} width={96} height={16} />
           </View>

diff --git a/JoyboyCommunity/src/modules/Auth/index.tsx b/JoyboyCommunity/src/modules/Auth/index.tsx
@@ -23,7 +23,7 @@ export const Auth: React.FC<AuthProps> = ({title, children}) => {
 
           <View style={styles.middle}>
             <View style={styles.logo}>
-              <Image style={styles.logoImage} source={require('../../../assets/joyboy-logo.png')} />
+              <Image style={styles.logoImage} source={require('../../assets/joyboy-logo.png')} />
             </View>
 
             <Text weight="bold" fontSize={22} style={styles.title}>

diff --git a/JoyboyCommunity/src/modules/Post/index.tsx b/JoyboyCommunity/src/modules/Post/index.tsx
@@ -101,10 +101,7 @@ export const Post: React.FC<PostProps> = ({asComment, event}) => {
       <View style={styles.info}>
         <View style={styles.infoUser}>
           <Pressable onPress={() => handleProfilePress(event?.pubkey)}>
-            <Avatar
-              size={asComment ? 40 : 50}
-              source={require('../../../assets/joyboy-logo.png')}
-            />
+            <Avatar size={asComment ? 40 : 50} source={require('../../assets/joyboy-logo.png')} />
           </Pressable>
 
           <Pressable style={styles.infoProfile} onPress={handleNavigateToPostDetails}>

diff --git a/JoyboyCommunity/src/screens/EditProfile/index.tsx b/JoyboyCommunity/src/screens/EditProfile/index.tsx
@@ -42,7 +42,7 @@ export const EditProfile: React.FC<EditProfileScreenProps> = () => {
   const editProfile = useEditProfile();
   const queryClient = useQueryClient();
 
-  if (profile.isLoading || !profile.data) return null;
+  if (profile.isLoading) return null;
 
   const onPublicKeyCopyPress = async () => {
     await Clipboard.setStringAsync(publicKey);
@@ -79,12 +79,12 @@ export const EditProfile: React.FC<EditProfileScreenProps> = () => {
   };
 
   const initialFormValues: FormValues = {
-    username: profile.data.nip05,
-    displayName: profile.data.displayName ?? profile.data.name,
-    bio: profile.data.about,
-    telegram: profile.data.telegram?.toString(),
-    github: profile.data.github?.toString(),
-    twitter: profile.data.twitter?.toString(),
+    username: profile.data?.nip05,
+    displayName: profile.data?.displayName ?? profile.data?.name,
+    bio: profile.data?.about,
+    telegram: profile.data?.telegram?.toString(),
+    github: profile.data?.github?.toString(),
+    twitter: profile.data?.twitter?.toString(),
   };
 
   const onSubmitPress = () => {
@@ -121,11 +121,11 @@ export const EditProfile: React.FC<EditProfileScreenProps> = () => {
         onCoverPhotoUpload={onCoverPhotoUpload}
         profilePhoto={
           (profilePhoto?.uri && {uri: profilePhoto.uri}) ||
-          (profile.data.image && {uri: profile.data.image})
+          (profile.data?.image && {uri: profile.data?.image})
         }
         coverPhoto={
           (coverPhoto?.uri && {uri: coverPhoto.uri}) ||
-          (profile.data.banner && {uri: profile.data.banner})
+          (profile.data?.banner && {uri: profile.data?.banner})
         }
         buttons={
           <Button variant="secondary" small onPress={onSubmitPress}>

diff --git a/JoyboyCommunity/src/screens/Notifications/Notification/index.tsx b/JoyboyCommunity/src/screens/Notifications/Notification/index.tsx
@@ -19,7 +19,7 @@ export const Notification: React.FC<NotificationProps> = ({post}) => {
       <View style={{flex: 1}}>
         <Image
           style={{width: 44, height: 44}}
-          source={require('../../../../assets/joyboy-logo.png')}
+          source={require('../../../assets/joyboy-logo.png')}
         />
       </View>
 

diff --git a/JoyboyCommunity/src/screens/Tips/index.tsx b/JoyboyCommunity/src/screens/Tips/index.tsx
@@ -4,15 +4,25 @@ import {Fraction} from '@uniswap/sdk-core';
 import {FlatList, RefreshControl, View} from 'react-native';
 import {byteArray, cairo, CallData, uint256} from 'starknet';
 
-import {Button, Header, Text} from '../../components';
+import {Button, Divider, Header, Text} from '../../components';
 import {ESCROW_ADDRESSES} from '../../constants/contracts';
 import {Entrypoint} from '../../constants/misc';
 import {useNostrContext} from '../../context/NostrContext';
-import {useChainId, useTips, useTransaction, useWaitConnection, useWalletModal} from '../../hooks';
+import {
+  useChainId,
+  useStyles,
+  useTips,
+  useTransaction,
+  useWaitConnection,
+  useWalletModal,
+} from '../../hooks';
 import {parseDepositEvents} from '../../utils/events';
 import {decimalsScale} from '../../utils/helpers';
+import stylesheet from './styles';
 
 export const Tips: React.FC = () => {
+  const styles = useStyles(stylesheet);
+
   const tips = useTips();
   const {ndk} = useNostrContext();
 
@@ -84,43 +94,62 @@ export const Tips: React.FC = () => {
   );
 
   return (
-    <View style={{flex: 1}}>
+    <View style={styles.container}>
       <Header showLogo />
 
-      <View style={{flex: 1, padding: 16}}>
-        <Text weight="bold" fontSize={18}>
-          Tips
-        </Text>
-
-        <FlatList
-          style={{flex: 1}}
-          data={tips.data.pages
-            .flat()
-            .map((page) => page.events)
-            .flat()}
-          keyExtractor={(item) => item.transaction_hash}
-          renderItem={({item}) => {
-            const event = parseDepositEvents(item, chainId);
-            const amount = new Fraction(event.amount, decimalsScale(event.token.decimals)).toFixed(
-              6,
-            );
-
-            return (
-              <View style={{padding: 12}}>
-                <Text>Tip</Text>
-                <Text>Sender: {event.sender}</Text>
-                <Text>Token: {event.token.symbol}</Text>
-                <Text>Amount: {amount}</Text>
-
-                {event.depositId ? (
-                  <Button onPress={() => onClaimPress(event.depositId)}>Claim</Button>
-                ) : null}
+      <FlatList
+        contentContainerStyle={styles.flatListContent}
+        data={tips.data.pages
+          .flat()
+          .map((page) => page.events)
+          .flat()}
+        ItemSeparatorComponent={() => <View style={styles.separator} />}
+        keyExtractor={(item) => item.transaction_hash}
+        renderItem={({item}) => {
+          const event = parseDepositEvents(item, chainId);
+          const amount = new Fraction(event.amount, decimalsScale(event.token.decimals)).toFixed(6);
+
+          return (
+            <View style={styles.tip}>
+              <View style={styles.tokenInfo}>
+                <View style={styles.token}>
+                  <Text weight="semiBold" fontSize={17}>
+                    {amount}
+                  </Text>
+                  <Text weight="bold" fontSize={17}>
+                    {event.token.symbol}
+                  </Text>
+                </View>
+
+                <View>
+                  {event.depositId ? (
+                    <Button small variant="primary" onPress={() => onClaimPress(event.depositId)}>
+                      Claim
+                    </Button>
+                  ) : null}
+                </View>
+              </View>
+
+              <Divider direction="horizontal" />
+
+              <View style={styles.senderInfo}>
+                <View style={styles.sender}>
+                  <Text weight="semiBold" color="text" numberOfLines={1} ellipsizeMode="middle">
+                    {event.sender}
+                  </Text>
+                </View>
+
+                {/* <View>
+                  <Text weight="semiBold" color="textSecondary" fontSize={11}>
+                    24/06/2024
+                  </Text>
+                </View> */}
               </View>
-            );
-          }}
-          refreshControl={<RefreshControl refreshing={tips.isFetching} onRefresh={tips.refetch} />}
-        />
-      </View>
+            </View>
+          );
+        }}
+        refreshControl={<RefreshControl refreshing={tips.isFetching} onRefresh={tips.refetch} />}
+      />
     </View>
   );
 };
diff --git a/JoyboyCommunity/src/screens/Tips/styles.ts b/JoyboyCommunity/src/screens/Tips/styles.ts
@@ -0,0 +1,44 @@
+import {Spacing, ThemedStyleSheet} from '../../styles';
+
+export default ThemedStyleSheet((theme) => ({
+  container: {
+    flex: 1,
+    backgroundColor: theme.colors.background,
+  },
+
+  flatListContent: {
+    paddingHorizontal: Spacing.pagePadding,
+    paddingVertical: Spacing.medium,
+  },
+
+  separator: {
+    height: Spacing.xsmall,
+  },
+
+  tip: {
+    backgroundColor: theme.colors.surface,
+    padding: Spacing.xsmall,
+    borderRadius: 8,
+    gap: Spacing.xsmall,
+  },
+  tokenInfo: {
+    flexDirection: 'row',
+    alignItems: 'center',
+  },
+  token: {
+    flex: 1,
+    flexDirection: 'row',
+    gap: Spacing.xsmall,
+  },
+
+  senderInfo: {
+    flex: 1,
+    flexDirection: 'row',
+    justifyContent: 'space-between',
+    alignItems: 'center',
+    gap: Spacing.medium,
+  },
+  sender: {
+    flex: 1,
+  },
+}));