diff --git a/packages/app/src/components/ActiveStreamCard.tsx b/packages/app/src/components/ActiveStreamCard.tsx
new file mode 100644
index 00000000..af5f9b4c
--- /dev/null
+++ b/packages/app/src/components/ActiveStreamCard.tsx
@@ -0,0 +1,44 @@
+import React from 'react';
+import { VStack, HStack, Text, Button } from 'native-base';
+import { styles } from './WalletCards/styles';
+import { StopDonationActionButton } from './StopDonationActionButton';
+import { DonorCollective } from '../models/models';
+import { formatFlowRate } from '../lib/formatFlowRate';
+import { formatTime } from '../lib/formatTime';
+import { useGetTokenBalance } from '../hooks/useGetTokenBalance';
+import { GDToken } from '../models/constants';
+
+export interface DonationStatusCardProps {
+  donorCollective: DonorCollective;
+}
+
+export const ActiveStreamCard = React.memo(({ donorCollective }: DonationStatusCardProps) => {
+  const donorBalance = useGetTokenBalance(GDToken.address, donorCollective.donor as any);
+  const secondsLeft = Number(BigInt(donorBalance) / BigInt(donorCollective.flowRate));
+  const endDate = formatTime(Date.now() / 1000 + secondsLeft);
+
+  return (
+    <VStack space={4}>
+      {/* Stream Rate */}
+      <VStack space={1}>
+        <Text {...styles.description}>Donation Streaming Rate</Text>
+        <Text {...styles.text}>G$ {formatFlowRate(donorCollective.flowRate)} / Monthly</Text>
+      </VStack>
+
+      {/* Dates */}
+      <HStack justifyContent="space-between" marginBottom={4}>
+        <VStack>
+          <Text {...styles.description}>Date Initiated</Text>
+          <Text {...styles.text}>{formatTime(donorCollective.timestamp)}</Text>
+        </VStack>
+        <VStack>
+          <Text {...styles.description}>Estimated End Date</Text>
+          <Text {...styles.text}>{endDate}</Text>
+        </VStack>
+      </HStack>
+
+      {/* Stop Button */}
+      <StopDonationActionButton donorCollective={donorCollective} />
+    </VStack>
+  );
+});
diff --git a/packages/app/src/components/DonateCard.tsx b/packages/app/src/components/DonateCard.tsx
deleted file mode 100644
index 2cc3d87b..00000000
--- a/packages/app/src/components/DonateCard.tsx
+++ /dev/null
@@ -1,132 +0,0 @@
-import { StyleSheet, Text, View, Image } from 'react-native';
-import RoundedButton from './RoundedButton';
-import { InterRegular, InterSemiBold, InterSmall } from '../utils/webFonts';
-import useCrossNavigate from '../routes/useCrossNavigate';
-import { GreetIcon } from '../assets';
-
-interface DonateCardProps {
-  imageUrl?: string;
-  title: string;
-  description: string;
-  name: string;
-  actions: number;
-  total: number;
-  usd: number;
-  link?: any;
-}
-
-function DonateCard({ title, description, name, actions, total, usd, link }: DonateCardProps) {
-  const { navigate } = useCrossNavigate();
-
-  return (
-    <View style={[styles.cardContainer, styles.elevation]}>
-      <Image source={GreetIcon} alt="icon" style={styles.icon} />
-      <Text style={styles.title}>{title}</Text>
-      <Text style={styles.description}>{description}</Text>
-
-      <View>
-        <View>
-          <Text style={styles.info}>{name} has performed</Text>
-          <View style={styles.row}>
-            <Text style={[styles.bold, { textDecorationLine: 'underline' }]}>{actions}</Text>
-            <Text style={styles.performedActions}> actions</Text>
-          </View>
-        </View>
-
-        <View>
-          <Text style={styles.info}>Towards this collective, and received</Text>
-          <View style={styles.row}>
-            <Text style={styles.bold}>G$ </Text>
-            <Text style={styles.totalReceived}>{total}</Text>
-          </View>
-
-          <Text style={styles.formattedUsd}>= {usd} USD</Text>
-        </View>
-      </View>
-
-      <RoundedButton
-        title="Donate to Collective"
-        backgroundColor="#95EED8"
-        color="#3A7768"
-        fontSize={16}
-        seeType={false}
-        onPress={() => {
-          navigate(`/collective/${link}`);
-        }}
-      />
-    </View>
-  );
-}
-
-const styles = StyleSheet.create({
-  cardContainer: {
-    width: '90%',
-    height: 330,
-    backgroundColor: '#FFFFFF',
-    paddingHorizontal: 12,
-    paddingVertical: 16,
-    borderRadius: 20,
-    flex: 1,
-    marginTop: 20,
-    marginBottom: 20,
-    alignSelf: 'center',
-    gap: 24,
-  },
-  elevation: {
-    shadowColor: '#000000',
-    shadowOffset: {
-      width: 0,
-      height: 12,
-    },
-    shadowOpacity: 0.15,
-    shadowRadius: 15,
-    elevation: 24,
-  },
-  icon: {
-    width: 30,
-    height: 30,
-    alignSelf: 'center',
-  },
-
-  title: {
-    fontSize: 20,
-    lineHeight: 25,
-    color: '#000000',
-    ...InterSemiBold,
-  },
-  description: {
-    fontSize: 14,
-    lineHeight: 21,
-    color: '#000000',
-    ...InterSemiBold,
-  },
-  info: {
-    fontSize: 16,
-    color: '#000000',
-    ...InterSemiBold,
-  },
-  performedActions: {
-    fontSize: 18,
-    color: '#5A5A5A',
-    textDecorationLine: 'underline',
-    ...InterSmall,
-  },
-  totalReceived: {
-    fontSize: 18,
-    color: '#5A5A5A',
-    ...InterSmall,
-  },
-  bold: {
-    fontSize: 18,
-    color: '#5A5A5A',
-    ...InterRegular,
-  },
-  row: {
-    flex: 1,
-    flexDirection: 'row',
-    marginBottom: 0,
-  },
-  formattedUsd: { ...InterSmall, fontSize: 12, color: '#959090' },
-});
-
-export default DonateCard;
diff --git a/packages/app/src/components/RoundedButton.tsx b/packages/app/src/components/RoundedButton.tsx
index 01246799..9722fb8d 100644
--- a/packages/app/src/components/RoundedButton.tsx
+++ b/packages/app/src/components/RoundedButton.tsx
@@ -7,8 +7,8 @@ interface RoundedButtonProps {
   title: string;
   backgroundColor: string;
   color: string;
-  fontSize: number;
-  seeType: boolean;
+  fontSize?: number;
+  seeType?: boolean;
   onPress?: () => void;
   maxWidth?: number | string;
   disabled?: boolean;
@@ -20,7 +20,7 @@ function RoundedButton({
   backgroundColor,
   color,
   fontSize,
-  seeType,
+  seeType = false,
   onPress,
   maxWidth,
   disabled,
@@ -58,10 +58,10 @@ const styles = StyleSheet.create({
   button: {
     width: '100%',
     borderRadius: 30,
-    paddingTop: 12,
-    paddingRight: 22,
-    paddingBottom: 12,
-    paddingLeft: 20,
+    paddingTop: 10,
+    paddingRight: 16,
+    paddingBottom: 10,
+    paddingLeft: 16,
     gap: 8,
     alignContent: 'center',
     borderWidth: 0,
@@ -77,11 +77,15 @@ const styles = StyleSheet.create({
     textAlign: 'right',
     marginTop: 0,
     marginBottom: 0,
+    lineHeight: 27,
+    fontSize: 18,
   },
   nonSeeTypeText: {
     ...InterSemiBold,
     textAlign: 'center',
     width: '100%',
+    lineHeight: 27,
+    fontSize: 18,
   },
   seeTypeRow: {
     flexDirection: 'row',
diff --git a/packages/app/src/components/StopDonationActionButton.tsx b/packages/app/src/components/StopDonationActionButton.tsx
new file mode 100644
index 00000000..9676eec7
--- /dev/null
+++ b/packages/app/src/components/StopDonationActionButton.tsx
@@ -0,0 +1,41 @@
+import { useState } from 'react';
+import ErrorModal from './modals/ErrorModal';
+import StopDonationModal from './modals/StopDonationModal';
+import ProcessingModal from './modals/ProcessingModal';
+import { useDeleteFlow } from '../hooks/useContractCalls/useDeleteFlow';
+import RoundedButton from './RoundedButton';
+import { Colors } from '../utils/colors';
+import { DonorCollective } from '../models/models';
+import { useAccount } from 'wagmi';
+
+export const StopDonationActionButton = ({ donorCollective }: { donorCollective: DonorCollective }) => {
+  const { address: maybeAddress } = useAccount();
+  const [stopDonationModalVisible, setStopDonationModalVisible] = useState(false);
+  const [processingModalVisible, setProcessingModalVisible] = useState(false);
+  const [errorMessage, setErrorMessage] = useState<string | undefined>(undefined);
+
+  const handleStopDonation = useDeleteFlow(
+    donorCollective.collective,
+    (error: string) => setErrorMessage(error),
+    (value: boolean) => setStopDonationModalVisible(value),
+    (value: boolean) => setProcessingModalVisible(value)
+  );
+  if (maybeAddress?.toLowerCase() !== donorCollective.donor.toLowerCase()) return null;
+  return (
+    <>
+      <RoundedButton
+        title="Stop Your Donation Stream"
+        backgroundColor={Colors.orange[100]}
+        color={Colors.orange[300]}
+        onPress={handleStopDonation}
+      />
+      <ErrorModal
+        openModal={!!errorMessage}
+        setOpenModal={() => setErrorMessage(undefined)}
+        message={errorMessage ?? ''}
+      />
+      <StopDonationModal openModal={stopDonationModalVisible} setOpenModal={setStopDonationModalVisible} />
+      <ProcessingModal openModal={processingModalVisible} />
+    </>
+  );
+};
diff --git a/packages/app/src/components/ViewCollective.tsx b/packages/app/src/components/ViewCollective.tsx
index ab3af162..368596c3 100644
--- a/packages/app/src/components/ViewCollective.tsx
+++ b/packages/app/src/components/ViewCollective.tsx
@@ -1,7 +1,6 @@
 import { StyleSheet, Text, View, Image } from 'react-native';
-import { useState } from 'react';
 import { Link } from 'native-base';
-import { useAccount } from 'wagmi';
+import { useAccount, useEnsName } from 'wagmi';
 
 import RowItem from './RowItem';
 import RoundedButton from './RoundedButton';
@@ -9,7 +8,6 @@ import StewardList from './StewardsList/StewardsList';
 import TransactionList from './TransactionList/TransactionList';
 import { InterSemiBold, InterSmall } from '../utils/webFonts';
 import useCrossNavigate from '../routes/useCrossNavigate';
-import StopDonationModal from './modals/StopDonationModal';
 
 import { Colors } from '../utils/colors';
 import { useScreenSize } from '../theme/hooks';
@@ -34,12 +32,11 @@ import {
   WebIcon,
 } from '../assets/';
 import { calculateGoodDollarAmounts } from '../lib/calculateGoodDollarAmounts';
-import { useDeleteFlow } from '../hooks/useContractCalls/useDeleteFlow';
-import ErrorModal from './modals/ErrorModal';
 import FlowingDonationsRowItem from './FlowingDonationsRowItem';
 import { defaultInfoLabel, SUBGRAPH_POLL_INTERVAL } from '../models/constants';
 import env from '../lib/env';
-import ProcessingModal from './modals/ProcessingModal';
+import { ActiveStreamCard } from './ActiveStreamCard';
+import { WalletDonatedCard } from './WalletCards/WalletDonatedCard';
 
 interface ViewCollectiveProps {
   collective: Collective;
@@ -63,23 +60,14 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
   const headerImg = ipfs?.headerImage ? { uri: ipfs.headerImage } : Ocean;
 
   const stewardsPaid = stewardCollectives.length;
-  const infoLabel = collective.ipfs.infoLabel ?? defaultInfoLabel;
+  const infoLabel = collective.ipfs.rewardDescription ?? defaultInfoLabel;
 
   const { address } = useAccount();
+  const { data: ensName } = useEnsName({ address, chainId: 1 });
+  const userName = ensName ?? 'This wallet';
   const maybeDonorCollective = useDonorCollectiveByAddresses(address ?? '', poolAddress, SUBGRAPH_POLL_INTERVAL);
   const isDonating = maybeDonorCollective && maybeDonorCollective.flowRate !== '0';
-
-  const [stopDonationModalVisible, setStopDonationModalVisible] = useState(false);
-  const [processingModalVisible, setProcessingModalVisible] = useState(false);
-  const [errorMessage, setErrorMessage] = useState<string | undefined>(undefined);
-
-  const handleStopDonation = useDeleteFlow(
-    collective.address,
-    maybeDonorCollective?.flowRate,
-    (error) => setErrorMessage(error),
-    (value: boolean) => setStopDonationModalVisible(value),
-    (value: boolean) => setProcessingModalVisible(value)
-  );
+  const hasDonated = isDonating || (maybeDonorCollective && maybeDonorCollective.contribution !== '0');
 
   const { price: tokenPrice } = useGetTokenPrice('G$');
 
@@ -95,7 +83,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
         <View style={styles.collectiveDesktopBox}>
           <View style={styles.collectiveDetailsDesktop}>
             <Image source={headerImg} style={styles.imageDesktop} />
-
             <View style={styles.collectiveDesktopData}>
               <Text style={[styles.title, styles.titleMobile]}>{ipfs.name}</Text>
               <Text style={styles.description}>{ipfs.description}</Text>
@@ -132,29 +119,39 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
                 <Text style={styles.informationLabel}>{infoLabel}</Text>
               </View>
 
-              {isDonating ? (
+              {hasDonated ? (
                 <View style={styles.collectiveDonateBox}>
                   {!isDesktopView && (
                     <>
                       <Image source={SupportImage} style={styles.supportImg} />
-                      <Text style={styles.supportText}>You Support this GoodCollective!!</Text>
+                      <Text style={styles.supportText}>
+                        You {isDonating ? 'Support' : 'Supported'} this GoodCollective!!
+                      </Text>
                     </>
                   )}
                   <View style={{ gap: 16 }}>
-                    <RoundedButton
-                      title="Stop your donation"
-                      backgroundColor={Colors.orange[100]}
-                      color={Colors.orange[200]}
-                      fontSize={16}
-                      seeType={false}
-                      onPress={handleStopDonation}
+                    <WalletDonatedCard
+                      donorCollective={maybeDonorCollective}
+                      tokenPrice={tokenPrice || 0}
+                      userName={userName}
                     />
+                    {isDonating ? (
+                      <ActiveStreamCard donorCollective={maybeDonorCollective} />
+                    ) : (
+                      <RoundedButton
+                        title="Donate"
+                        backgroundColor={Colors.green[100]}
+                        color={Colors.green[200]}
+                        seeType={false}
+                        onPress={() => {
+                          navigate(`/donate/${poolAddress}`);
+                        }}
+                      />
+                    )}{' '}
                     <RoundedButton
                       title="See all donors"
                       backgroundColor={Colors.purple[100]}
                       color={Colors.purple[200]}
-                      fontSize={16}
-                      seeType={true}
                       onPress={() => {
                         navigate(`/collective/${poolAddress}/donors`);
                       }}
@@ -167,7 +164,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
                     title="Donate"
                     backgroundColor={Colors.green[100]}
                     color={Colors.green[200]}
-                    fontSize={16}
                     seeType={false}
                     onPress={() => {
                       navigate(`/donate/${poolAddress}`);
@@ -177,8 +173,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
                     title="See all donors"
                     backgroundColor={Colors.purple[100]}
                     color={Colors.purple[200]}
-                    fontSize={16}
-                    seeType={true}
                     onPress={() => {
                       navigate(`/collective/${poolAddress}/donors`);
                     }}
@@ -230,8 +224,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
               title="See all stewards"
               backgroundColor={Colors.purple[100]}
               color={Colors.purple[200]}
-              fontSize={18}
-              seeType={true}
               onPress={() => navigate(`/collective/${poolAddress}/stewards`)}
             />
           </View>
@@ -239,13 +231,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
             <TransactionList collective={collective.address as `0x${string}`} />
           </View>
         </View>
-        <ErrorModal
-          openModal={!!errorMessage}
-          setOpenModal={() => setErrorMessage(undefined)}
-          message={errorMessage ?? ''}
-        />
-        <StopDonationModal openModal={stopDonationModalVisible} setOpenModal={setStopDonationModalVisible} />
-        <ProcessingModal openModal={processingModalVisible} />
       </View>
     );
   }
@@ -317,26 +302,33 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
             />
           </View>
 
-          {isDonating ? (
+          {hasDonated ? (
             <View style={{ gap: 24 }}>
               <Image source={SupportImage} style={styles.supportImg} />
-              <Text style={styles.supportText}>You Support this GoodCollective!!</Text>
-
+              <Text style={styles.supportText}>You {isDonating ? 'Support' : 'Supported'} this GoodCollective!!</Text>
               <View style={{ gap: 16 }}>
-                <RoundedButton
-                  title="Stop your donation"
-                  backgroundColor={Colors.orange[100]}
-                  color={Colors.orange[200]}
-                  fontSize={18}
-                  seeType={false}
-                  onPress={handleStopDonation}
+                <WalletDonatedCard
+                  donorCollective={maybeDonorCollective}
+                  tokenPrice={tokenPrice || 0}
+                  userName={userName}
                 />
+                {isDonating ? (
+                  <ActiveStreamCard donorCollective={maybeDonorCollective} />
+                ) : (
+                  <RoundedButton
+                    title="Donate"
+                    backgroundColor={Colors.green[100]}
+                    color={Colors.green[200]}
+                    seeType={false}
+                    onPress={() => {
+                      navigate(`/donate/${poolAddress}`);
+                    }}
+                  />
+                )}
                 <RoundedButton
                   title="See all donors"
                   backgroundColor={Colors.purple[100]}
                   color={Colors.purple[200]}
-                  fontSize={18}
-                  seeType={true}
                   onPress={() => {
                     navigate(`/collective/${poolAddress}/donors`);
                   }}
@@ -349,7 +341,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
                 title="Donate"
                 backgroundColor={Colors.green[100]}
                 color={Colors.green[200]}
-                fontSize={18}
                 seeType={false}
                 onPress={() => {
                   navigate(`/donate/${poolAddress}`);
@@ -360,7 +351,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
                 backgroundColor={Colors.purple[100]}
                 color={Colors.purple[200]}
                 fontSize={18}
-                seeType={true}
                 onPress={() => {
                   navigate(`/collective/${poolAddress}/donors`);
                 }}
@@ -376,7 +366,6 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
             backgroundColor={Colors.purple[100]}
             color={Colors.purple[200]}
             fontSize={18}
-            seeType={true}
             onPress={() => navigate(`/collective/${poolAddress}/stewards`)}
           />
         </View>
@@ -388,16 +377,9 @@ function ViewCollective({ collective }: ViewCollectiveProps) {
               backgroundColor={Colors.purple[100]}
               color={Colors.purple[200]}
               fontSize={18}
-              seeType={true}
             />
           </Link>
         </View>
-        <ErrorModal
-          openModal={!!errorMessage}
-          setOpenModal={() => setErrorMessage(undefined)}
-          message={errorMessage ?? ''}
-        />
-        <StopDonationModal openModal={stopDonationModalVisible} setOpenModal={setStopDonationModalVisible} />
       </View>
     </View>
   );
diff --git a/packages/app/src/components/WalletCards/DonorCollectiveCard.tsx b/packages/app/src/components/WalletCards/DonorCollectiveCard.tsx
index cb540bd2..b123ab7a 100644
--- a/packages/app/src/components/WalletCards/DonorCollectiveCard.tsx
+++ b/packages/app/src/components/WalletCards/DonorCollectiveCard.tsx
@@ -3,11 +3,11 @@ import RoundedButton from '../RoundedButton';
 import useCrossNavigate from '../../routes/useCrossNavigate';
 import { DonorCollective, IpfsCollective } from '../../models/models';
 import { styles } from './styles';
-import { DonorGreenIcon, InfoIcon } from '../../assets';
-import { useFlowingBalance } from '../../hooks/useFlowingBalance';
+import { DonorGreenIcon, InfoIcon, StreamTX } from '../../assets';
 import { useCountPeopleSupported } from '../../hooks/useCountPeopleSupported';
 import { defaultInfoLabel } from '../../models/constants';
-import { GoodDollarAmount } from '../GoodDollarAmount';
+import { ActiveStreamCard } from '../ActiveStreamCard';
+import { WalletDonatedCard } from './WalletDonatedCard';
 
 interface DonorCollectiveCardProps {
   donorCollective: DonorCollective;
@@ -17,6 +17,11 @@ interface DonorCollectiveCardProps {
   isDesktopResolution: boolean;
 }
 
+const PoolPerson: { [key: string]: string } = {
+  UBI: 'recipients',
+  DirectPayments: 'stewards',
+};
+
 function DonorCollectiveCard({
   ipfsCollective,
   donorCollective,
@@ -26,23 +31,16 @@ function DonorCollectiveCard({
 }: DonorCollectiveCardProps) {
   const { navigate } = useCrossNavigate();
   const userName = ensName ?? 'This wallet';
-  const infoLabel = ipfsCollective.infoLabel ?? defaultInfoLabel;
+  const infoLabel = ipfsCollective.rewardDescription ?? defaultInfoLabel;
 
   const peopleSupported = useCountPeopleSupported([donorCollective]) ?? 0;
 
-  const { wei: donationsFormatted, usdValue: donationsUsdValue } = useFlowingBalance(
-    donorCollective.contribution,
-    donorCollective.timestamp, // Timestamp in Subgraph's UTC.
-    donorCollective.flowRate,
-    tokenPrice
-  );
-
   const dynamicContainerStyle = isDesktopResolution ? { width: '48%' } : {};
-
+  const hasActiveDonationStream = Number(donorCollective.flowRate || 0) > 0;
   return (
     <View style={[styles.cardContainer, styles.elevation, dynamicContainerStyle]}>
       <View style={styles.cardContentContainer}>
-        <Image source={DonorGreenIcon} alt="icon" style={styles.icon} />
+        <Image source={hasActiveDonationStream ? StreamTX : DonorGreenIcon} alt="icon" style={styles.icon} />
 
         <Text style={styles.title}>{ipfsCollective.name}</Text>
         <View style={styles.cardDescription}>
@@ -51,38 +49,29 @@ function DonorCollectiveCard({
         </View>
 
         <View style={styles.actionsContent}>
-          <View style={{ gap: 2 }}>
-            <Text style={styles.info}>{userName} has donated</Text>
-            <View style={styles.row}>
-              <Text style={styles.bold}>G$ </Text>
-              <GoodDollarAmount
-                style={styles.totalReceived}
-                lastDigitsProps={{ style: { fontSize: 18, fontWeight: '300' } }}
-                amount={donationsFormatted || '0'}
-              />
-            </View>
-            <Text style={styles.formattedUsd}>= {donationsUsdValue} USD</Text>
-          </View>
-
+          <WalletDonatedCard donorCollective={donorCollective} tokenPrice={tokenPrice || 0} userName={userName} />
           <View style={{ gap: 2 }}>
             <Text style={styles.info}>Towards this collective, supporting</Text>
             <View style={styles.row}>
               <Text style={[styles.bold]}>{peopleSupported}</Text>
-              <Text style={styles.performedActions}> people</Text>
+              <Text style={styles.performedActions}> {PoolPerson[ipfsCollective.pooltype] || 'people'}</Text>
             </View>
           </View>
         </View>
       </View>
-      <RoundedButton
-        title="Donate to Collective"
-        backgroundColor="#95EED8"
-        color="#3A7768"
-        fontSize={16}
-        seeType={false}
-        onPress={() => {
-          navigate(`/collective/${donorCollective.collective}`);
-        }}
-      />
+      {hasActiveDonationStream ? (
+        <ActiveStreamCard donorCollective={donorCollective} />
+      ) : (
+        <RoundedButton
+          title="Donate to Collective"
+          backgroundColor="#95EED8"
+          color="#3A7768"
+          seeType={false}
+          onPress={() => {
+            navigate(`/donate/${donorCollective.collective}`);
+          }}
+        />
+      )}
     </View>
   );
 }
diff --git a/packages/app/src/components/WalletCards/StewardCollectiveCard.tsx b/packages/app/src/components/WalletCards/StewardCollectiveCard.tsx
index 883d078b..f727079c 100644
--- a/packages/app/src/components/WalletCards/StewardCollectiveCard.tsx
+++ b/packages/app/src/components/WalletCards/StewardCollectiveCard.tsx
@@ -6,6 +6,7 @@ import { styles } from './styles';
 import { InfoIcon, StewardOrange } from '../../assets';
 import { calculateGoodDollarAmounts } from '../../lib/calculateGoodDollarAmounts';
 import { defaultInfoLabel } from '../../models/constants';
+import { GoodDollarAmount } from '../GoodDollarAmount';
 
 interface StewardCollectiveCardProps {
   collective: StewardCollective;
@@ -26,7 +27,7 @@ function StewardCollectiveCard({
   const { navigate } = useCrossNavigate();
   const userName = ensName ?? 'This wallet';
 
-  const { formatted: rewardsFormatted, usdValue: rewardsUsdValue } = calculateGoodDollarAmounts(
+  const { wei: rewardsFormatted, usdValue: rewardsUsdValue } = calculateGoodDollarAmounts(
     collective.totalEarned,
     tokenPrice,
     2
@@ -34,7 +35,7 @@ function StewardCollectiveCard({
 
   const dynamicContainerStyle = isDesktopResolution ? { width: '48%' } : {};
 
-  const infoLabel = ipfsCollective.infoLabel ?? defaultInfoLabel;
+  const infoLabel = ipfsCollective.rewardDescription ?? defaultInfoLabel;
 
   return (
     <View style={[styles.cardContainer, styles.elevation, dynamicContainerStyle]}>
@@ -49,18 +50,27 @@ function StewardCollectiveCard({
 
         <View style={styles.actionsContent}>
           <View style={{ gap: 2 }}>
-            <Text style={styles.info}>{userName} has performed</Text>
+            <Text style={styles.info}>
+              {userName} has {ipfsCollective.pooltype === 'UBI' ? 'claimed' : 'performed'}
+            </Text>
             <View style={styles.row}>
-              <Text style={styles.bold}>{collective.actions}</Text>
-              <Text style={styles.performedActions}> actions</Text>
+              <Text style={styles.orangeBoldUnderline}>
+                {collective.actions} {ipfsCollective.pooltype === 'UBI' ? 'times' : 'actions'}
+              </Text>
             </View>
           </View>
 
           <View style={{ gap: 2 }}>
-            <Text style={styles.info}>Towards this collective, and received</Text>
+            <Text style={styles.info}>
+              {ipfsCollective.pooltype === 'UBI' ? '' : 'Towards this collective, '}and received
+            </Text>
             <View style={styles.row}>
               <Text style={styles.bold}>G$ </Text>
-              <Text style={styles.totalReceived}>{rewardsFormatted}</Text>
+              <GoodDollarAmount
+                style={styles.totalReceived}
+                lastDigitsProps={{ style: { fontSize: 18, fontWeight: '300', lineHeight: 33 } }}
+                amount={rewardsFormatted || '0'}
+              />
             </View>
             <Text style={styles.formattedUsd}>= {rewardsUsdValue} USD</Text>
           </View>
@@ -70,10 +80,9 @@ function StewardCollectiveCard({
         title="Donate to Collective"
         backgroundColor="#95EED8"
         color="#3A7768"
-        fontSize={16}
         seeType={false}
         onPress={() => {
-          navigate(`/collective/${collective.collective}`);
+          navigate(`/donate/${collective.collective}`);
         }}
       />
     </View>
diff --git a/packages/app/src/components/WalletCards/WalletDonatedCard.tsx b/packages/app/src/components/WalletCards/WalletDonatedCard.tsx
new file mode 100644
index 00000000..69ff2dcb
--- /dev/null
+++ b/packages/app/src/components/WalletCards/WalletDonatedCard.tsx
@@ -0,0 +1,35 @@
+import React from 'react';
+import { View, Text } from 'react-native';
+import { GoodDollarAmount } from '../GoodDollarAmount';
+import { styles } from './styles';
+import { useFlowingBalance } from '../../hooks/useFlowingBalance';
+import { DonorCollective } from '../../models/models';
+
+interface WalletDonatedCardProps {
+  userName?: string;
+  donorCollective: DonorCollective;
+  tokenPrice: number;
+}
+
+export const WalletDonatedCard: React.FC<WalletDonatedCardProps> = ({ donorCollective, tokenPrice, userName }) => {
+  const { wei: donationsFormatted, usdValue: donationsUsdValue } = useFlowingBalance(
+    donorCollective.contribution,
+    donorCollective.timestamp, // Timestamp in Subgraph's UTC.
+    donorCollective.flowRate,
+    tokenPrice
+  );
+  return (
+    <View>
+      <Text style={styles.info}>{userName} has donated</Text>
+      <View style={styles.row}>
+        <Text style={styles.bold}>G$ </Text>
+        <GoodDollarAmount
+          style={styles.totalReceived}
+          lastDigitsProps={{ style: { fontSize: 18, fontWeight: '300', lineHeight: 33 } }}
+          amount={donationsFormatted || '0'}
+        />
+      </View>
+      <Text style={styles.formattedUsd}>= {donationsUsdValue} USD</Text>
+    </View>
+  );
+};
diff --git a/packages/app/src/components/WalletCards/styles.ts b/packages/app/src/components/WalletCards/styles.ts
index 2bb56133..2443a6c1 100644
--- a/packages/app/src/components/WalletCards/styles.ts
+++ b/packages/app/src/components/WalletCards/styles.ts
@@ -67,16 +67,30 @@ export const styles = StyleSheet.create({
   performedActions: {
     fontSize: 18,
     color: Colors.gray[100],
+    lineHeight: 33,
     ...InterSmall,
   },
   totalReceived: {
     fontSize: 18,
     color: Colors.gray[100],
+    lineHeight: 33,
     ...InterSmall,
   },
+  text: {
+    fontSize: 16,
+    color: Colors.gray[100],
+    ...InterRegular,
+  },
+  orangeBoldUnderline: {
+    fontSize: 22,
+    color: Colors.orange[200],
+    textDecorationLine: 'underline',
+    ...InterSemiBold,
+  },
   bold: {
     fontSize: 18,
     color: Colors.gray[100],
+    lineHeight: 33,
     ...InterRegular,
   },
   row: {
diff --git a/packages/app/src/components/WalletDetails/EmptyProfile.tsx b/packages/app/src/components/WalletDetails/EmptyProfile.tsx
index 59f53cf2..60c8f40c 100644
--- a/packages/app/src/components/WalletDetails/EmptyProfile.tsx
+++ b/packages/app/src/components/WalletDetails/EmptyProfile.tsx
@@ -16,7 +16,6 @@ function EmptyProfile() {
         title="Support a Collective"
         backgroundColor={Colors.green[100]}
         color={Colors.green[200]}
-        fontSize={16}
         seeType={false}
         onPress={() => navigate('/')}
       />
diff --git a/packages/app/src/hooks/useContractCalls/useDeleteFlow.ts b/packages/app/src/hooks/useContractCalls/useDeleteFlow.ts
index f3da92d6..f66414a5 100644
--- a/packages/app/src/hooks/useContractCalls/useDeleteFlow.ts
+++ b/packages/app/src/hooks/useContractCalls/useDeleteFlow.ts
@@ -3,12 +3,10 @@ import { SupportedNetwork, SupportedNetworkNames } from '../../models/constants'
 import { GoodCollectiveSDK } from '@gooddollar/goodcollective-sdk';
 import { useAccount, useNetwork } from 'wagmi';
 import { useEthersSigner } from '../useEthers';
-import Decimal from 'decimal.js';
 import { printAndParseSupportError, validateConnection } from './util';
 
 export function useDeleteFlow(
   collective: string,
-  flowRate: string | undefined,
   onError: (error: string) => void,
   toggleStopDonationModal: (value: boolean) => void,
   toggleProcessingModal: (value: boolean) => void
@@ -25,11 +23,6 @@ export function useDeleteFlow(
     }
     const { chainId, signer } = validation;
 
-    if (!flowRate || new Decimal(flowRate).toString() === '0') {
-      onError('Flow rate must be greater than 0.');
-      return;
-    }
-
     const chainIdString = chainId.toString() as `${SupportedNetwork}`;
     const network = SupportedNetworkNames[chainId as SupportedNetwork];
 
@@ -47,14 +40,5 @@ export function useDeleteFlow(
       const message = printAndParseSupportError(error);
       onError(message);
     }
-  }, [
-    maybeAddress,
-    chain?.id,
-    collective,
-    flowRate,
-    onError,
-    maybeSigner,
-    toggleStopDonationModal,
-    toggleProcessingModal,
-  ]);
+  }, [maybeAddress, chain?.id, collective, onError, maybeSigner, toggleStopDonationModal, toggleProcessingModal]);
 }
diff --git a/packages/app/src/hooks/useNetFlowRate.ts b/packages/app/src/hooks/useNetFlowRate.ts
new file mode 100644
index 00000000..9708738c
--- /dev/null
+++ b/packages/app/src/hooks/useNetFlowRate.ts
@@ -0,0 +1,27 @@
+import { useContractRead } from 'wagmi';
+
+export const useNetFlowRate = (token: string, account: string) => {
+  const result = useContractRead({
+    address: '0xcfA132E353cB4E398080B9700609bb008eceB125',
+    abi: [
+      {
+        inputs: [
+          {
+            internalType: 'contract ISuperToken',
+            name: 'token',
+            type: 'address',
+          },
+          { internalType: 'address', name: 'account', type: 'address' },
+        ],
+        name: 'getAccountFlowrate',
+        outputs: [{ internalType: 'int96', name: 'flowrate', type: 'int96' }],
+        stateMutability: 'view',
+        type: 'function',
+      },
+    ],
+    args: [token, account],
+    functionName: 'getAccountFlowrate',
+  });
+
+  return result.data;
+};
diff --git a/packages/app/src/lib/formatFlowRate.ts b/packages/app/src/lib/formatFlowRate.ts
new file mode 100644
index 00000000..b37ed263
--- /dev/null
+++ b/packages/app/src/lib/formatFlowRate.ts
@@ -0,0 +1,8 @@
+import { Frequency } from '../models/constants';
+import { formatGoodDollarAmount } from './calculateGoodDollarAmounts';
+import { totalDurationInSeconds } from './totalDurationInSeconds';
+
+export const formatFlowRate = (flowRate: string, decimals: number = 2, frequency: Frequency = Frequency.Monthly) => {
+  const f = BigInt(flowRate) * BigInt(totalDurationInSeconds(1, frequency));
+  return formatGoodDollarAmount(f.toString(), decimals);
+};
diff --git a/packages/app/src/models/models.ts b/packages/app/src/models/models.ts
index 90d37fd7..366d497e 100644
--- a/packages/app/src/models/models.ts
+++ b/packages/app/src/models/models.ts
@@ -30,6 +30,7 @@ export interface Donor {
 
 export interface Collective {
   address: string;
+  pooltype: string;
   ipfs: IpfsCollective;
   donorCollectives: DonorCollective[];
   stewardCollectives: StewardCollective[];
@@ -42,6 +43,7 @@ export interface Collective {
 
 export interface IpfsCollective {
   id: string; // ipfs hash
+  pooltype: string;
   collective: string; // collective address
   name: string;
   description: string;
diff --git a/packages/app/src/subgraph/subgraphModels.ts b/packages/app/src/subgraph/subgraphModels.ts
index b83734b8..d5a86384 100644
--- a/packages/app/src/subgraph/subgraphModels.ts
+++ b/packages/app/src/subgraph/subgraphModels.ts
@@ -33,7 +33,7 @@ export type SubgraphStewardCollective = {
 
 export type SubgraphCollective = {
   id: string;
-  type?: 'directpayments' | 'ubi';
+  pooltype: string;
   ipfs: SubgraphIpfsCollective;
   settings?: SubgraphPoolSettings;
   limits?: SubgraphSafetyLimits;
@@ -51,6 +51,7 @@ export type SubgraphCollective = {
 
 export type SubgraphIpfsCollective = {
   id: string; // ipfs hash
+  pooltype: string;
   name: string;
   description: string;
   rewardDescription?: string;
diff --git a/packages/app/src/subgraph/useSubgraphCollective.ts b/packages/app/src/subgraph/useSubgraphCollective.ts
index ad7a26bc..d9d01b89 100644
--- a/packages/app/src/subgraph/useSubgraphCollective.ts
+++ b/packages/app/src/subgraph/useSubgraphCollective.ts
@@ -6,6 +6,7 @@ export const collectivesById = gql`
   query COLLECTIVES_BY_ID($ids: [String!]) {
     collectives(where: { id_in: $ids, ipfs_: { name_not: null } }) {
       id
+      pooltype
       ipfs {
         id
         name
diff --git a/packages/app/src/subgraph/useSubgraphDonorCollective.ts b/packages/app/src/subgraph/useSubgraphDonorCollective.ts
index 8e93965d..e431690d 100644
--- a/packages/app/src/subgraph/useSubgraphDonorCollective.ts
+++ b/packages/app/src/subgraph/useSubgraphDonorCollective.ts
@@ -11,6 +11,7 @@ const donorCollectiveByEntities = gql`
       }
       collective {
         id
+        pooltype
       }
       contribution
       flowRate
diff --git a/packages/app/src/subgraph/useSubgraphIpfsCollective.ts b/packages/app/src/subgraph/useSubgraphIpfsCollective.ts
index d1ef1048..d0acc6e1 100644
--- a/packages/app/src/subgraph/useSubgraphIpfsCollective.ts
+++ b/packages/app/src/subgraph/useSubgraphIpfsCollective.ts
@@ -7,6 +7,7 @@ const allIpfsCollectives = gql`
   query IPFS_COLLECTIVES {
     collectives(where: { ipfs_: { name_not: null } }) {
       id
+      pooltype
       ipfs {
         id
         name
@@ -29,6 +30,7 @@ const ipfsCollectivesById = gql`
   query IPFS_COLLECTIVES_BY_ID($ids: [String!]) {
     collectives(where: { id_in: $ids }) {
       id
+      pooltype
       ipfs {
         id
         name