diff --git a/src/pages/Dashboard.js b/src/pages/Dashboard.js
index eb9429a..ee8ad38 100644
--- a/src/pages/Dashboard.js
+++ b/src/pages/Dashboard.js
@@ -7,7 +7,7 @@ import { Button } from '../components/ui/button';
 import { Badge } from '../components/ui/badge';
 import Navbar from '../components/Navbar';
 import MemberFooter from '../components/MemberFooter';
-import { Calendar, User, CheckCircle, Clock, AlertCircle, Mail, Users, Image, FileText, DollarSign, Scale } from 'lucide-react';
+import { Calendar, User, CheckCircle, Clock, AlertCircle, Mail, Users, Image, FileText, DollarSign, Scale, Receipt, Heart, CreditCard } from 'lucide-react';
 import { toast } from 'sonner';
 
 const Dashboard = () => {
@@ -17,6 +17,7 @@ const Dashboard = () => {
   const [resendLoading, setResendLoading] = useState(false);
   const [eventActivity, setEventActivity] = useState(null);
   const [activityLoading, setActivityLoading] = useState(true);
+  const [activeTransactionTab, setActiveTransactionTab] = useState('all');
   const joinedDate = user?.member_since || user?.created_at;
 
   useEffect(() => {
@@ -180,7 +181,7 @@ const Dashboard = () => {
         </Card>
 
         {/* Grid Layout */}
-        <div className="grid lg:grid-cols-3 gap-8">
+        <div className="grid lg:grid-cols-2 gap-8">
           {/* Quick Stats */}
           <Card className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)]" data-testid="quick-stats-card">
             <h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
@@ -219,19 +220,41 @@ const Dashboard = () => {
               )}
             </div>
           </Card>
+          <Card className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)]" data-testid="quick-stats-card">
+            <h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
+              Membership Info
+            </h3>
+            <div className="space-y-4">
+
+              {user?.subscription_start_date && user?.subscription_end_date && (
+                <>
+                  <div className="pt-4 border-t border-[var(--neutral-800)]">
+                    <p className="text-sm text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Membership Period</p>
+                    <p className="text-[var(--purple-ink)] font-medium" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                      {new Date(user.subscription_start_date).toLocaleDateString()} - {new Date(user.subscription_end_date).toLocaleDateString()}
+                    </p>
+                  </div>
+                  <div>
+                    <p className="text-sm text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Days Remaining</p>
+                    <p className="text-[var(--purple-ink)] font-medium" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                      {Math.max(0, Math.ceil((new Date(user.subscription_end_date) - new Date()) / (1000 * 60 * 60 * 24)))} days
+                    </p>
+                  </div>
+                </>
+              )}
+            </div>
+          </Card>
 
           {/* Upcoming Events */}
-          <Card className="lg:col-span-2 p-6 bg-background rounded-2xl border border-[var(--neutral-800)]" data-testid="upcoming-events-card">
+          <Card className="lg:col-span-1 p-6 bg-background rounded-2xl border border-[var(--neutral-800)]" data-testid="upcoming-events-card">
             <div className="flex justify-between items-center mb-6">
               <h3 className="text-xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
-                Upcoming Events
+                My Event Activity
               </h3>
               <Link to="/events">
-                <Button
-                  className="btn-lavender "
-                  data-testid="view-all-events-button"
-                >
-                  View All
+                <Button className="bg-[var(--purple-lavender)] text-white hover:bg-[var(--purple-muted)] rounded-full dark:hover:bg-brand-lavender dark:hover:text-brand-dark-lavender px-6">
+                  <Calendar className="h-4 w-4 mr-2" />
+                  Browse Events
                 </Button>
               </Link>
             </div>
@@ -313,155 +336,129 @@ const Dashboard = () => {
           </Card>
         )}
 
-        {/* Event Activity Section */}
-        <div className="mt-12">
-          <div className="flex justify-between items-center mb-6">
-            <h2 className="text-3xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
-              My Event Activity
+        {/* Transaction History Section */}
+        <Card className="mt-12 p-6 bg-background rounded-2xl border border-[var(--neutral-800)]">
+          {/* Header */}
+          <div className="flex items-center gap-3 mb-6">
+            <div className="p-2 bg-[var(--green-light)] rounded-lg">
+              <Receipt className="h-5 w-5 text-white" />
+            </div>
+            <h2 className="text-2xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
+              Transaction History
             </h2>
           </div>
 
-          {activityLoading ? (
-            <p className="text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Loading event activity...</p>
-          ) : eventActivity ? (
-            <div className="space-y-8">
-              {/* Stats Cards */}
-              <div className="grid md:grid-cols-2 gap-6">
-                <Card className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)]">
-                  <div className="flex items-center gap-4">
-                    <div className="bg-[var(--neutral-800)]/20 p-4 rounded-lg">
-                      <Calendar className="h-8 w-8 text-brand-purple " />
-                    </div>
-                    <div>
-                      <p className="text-sm text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Total RSVPs</p>
-                      <p className="text-3xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
-                        {eventActivity.total_rsvps}
-                      </p>
-                    </div>
-                  </div>
-                </Card>
-                <Card className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)]">
-                  <div className="flex items-center gap-4">
-                    <div className="bg-[var(--green-light)]/20 p-4 rounded-lg">
-                      <CheckCircle className="h-8 w-8 text-[var(--green-light)]" />
-                    </div>
-                    <div>
-                      <p className="text-sm text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>Events Attended</p>
-                      <p className="text-3xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
-                        {eventActivity.total_attended}
-                      </p>
-                    </div>
-                  </div>
-                </Card>
+          {/* Stats Row */}
+          <div className="grid grid-cols-2 gap-4 mb-6">
+            <div className="p-4 bg-[var(--lavender-300)]/30 rounded-xl border border-[var(--neutral-800)]">
+              <div className="flex items-center gap-2 mb-2">
+                <CreditCard className="h-4 w-4 text-[var(--green-light)]" />
+                <span className="text-sm text-[var(--green-light)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                  Total Subscriptions
+                </span>
               </div>
-
-              {/* Upcoming RSVP'd Events */}
-              {eventActivity.upcoming_events && eventActivity.upcoming_events.length > 0 && (
-                <Card className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)]">
-                  <h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
-                    Upcoming Events (RSVP'd)
-                  </h3>
-                  <div className="space-y-3">
-                    {eventActivity.upcoming_events.map((event) => (
-                      <Link to={`/events/${event.id}`} key={event.id}>
-                        <div className="p-4 border border-[var(--neutral-800)] rounded-xl hover:border-brand-purple  hover:shadow-md transition-all">
-                          <div className="flex items-start justify-between gap-4">
-                            <div className="flex-1">
-                              <h4 className="font-semibold text-[var(--purple-ink)] mb-1" style={{ fontFamily: "'Inter', sans-serif" }}>{event.title}</h4>
-                              <p className="text-sm text-brand-purple  mb-2" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
-                                {new Date(event.start_at).toLocaleDateString()} at{' '}
-                                {new Date(event.start_at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
-                              </p>
-                              <p className="text-sm text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>{event.location}</p>
-                            </div>
-                            <Badge className={
-                              event.rsvp_status === 'yes' ? 'bg-[var(--green-light)] text-white' :
-                                event.rsvp_status === 'maybe' ? 'bg-orange-100 text-orange-700' :
-                                  'bg-gray-200 text-gray-700'
-                            }>
-                              {event.rsvp_status === 'yes' ? 'Going' :
-                                event.rsvp_status === 'maybe' ? 'Maybe' : 'Not Going'}
-                            </Badge>
-                          </div>
-                        </div>
-                      </Link>
-                    ))}
-                  </div>
-                </Card>
-              )}
-
-              {/* Past Events & Attendance */}
-              {eventActivity.past_events && eventActivity.past_events.length > 0 && (
-                <Card className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)]">
-                  <h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-4" style={{ fontFamily: "'Inter', sans-serif" }}>
-                    Past Events
-                  </h3>
-                  <div className="space-y-3">
-                    {eventActivity.past_events.slice(0, 5).map((event) => (
-                      <div key={event.id} className="p-4 border border-[var(--neutral-800)] rounded-xl">
-                        <div className="flex items-start justify-between gap-4">
-                          <div className="flex-1">
-                            <h4 className="font-semibold text-[var(--purple-ink)] mb-1" style={{ fontFamily: "'Inter', sans-serif" }}>{event.title}</h4>
-                            <p className="text-sm text-brand-purple  mb-2" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
-                              {new Date(event.start_at).toLocaleDateString()} at{' '}
-                              {new Date(event.start_at).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' })}
-                            </p>
-                          </div>
-                          <div className="flex flex-col items-end gap-2">
-                            <Badge className={event.attended ? 'bg-[var(--green-light)] text-white' : 'bg-gray-200 text-gray-700'}>
-                              {event.attended ? 'Attended' : 'Did not attend'}
-                            </Badge>
-                            {event.attended && event.attended_at && (
-                              <p className="text-xs text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
-                                Checked in: {new Date(event.attended_at).toLocaleDateString()}
-                              </p>
-                            )}
-                          </div>
-                        </div>
-                      </div>
-                    ))}
-                  </div>
-                  {eventActivity.past_events.length > 5 && (
-                    <p className="text-sm text-center text-brand-purple  mt-4" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
-                      Showing 5 of {eventActivity.past_events.length} past events
-                    </p>
-                  )}
-                </Card>
-              )}
-
-              {/* No Events Message */}
-              {(!eventActivity.upcoming_events || eventActivity.upcoming_events.length === 0) &&
-                (!eventActivity.past_events || eventActivity.past_events.length === 0) && (
-                  <Card className="p-12 bg-background rounded-2xl border border-[var(--neutral-800)]">
-                    <div className="text-center">
-                      <Calendar className="h-16 w-16 text-[var(--neutral-800)] mx-auto mb-4" />
-                      <h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-2" style={{ fontFamily: "'Inter', sans-serif" }}>
-                        No Event Activity Yet
-                      </h3>
-                      <p className="text-brand-purple  mb-6" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
-                        Browse upcoming events and RSVP to start building your event history!
-                      </p>
-                      <Link to="/events">
-                        <Button className="bg-[var(--purple-lavender)] text-white hover:bg-[var(--purple-muted)] rounded-full dark:hover:bg-brand-lavender dark:hover:text-brand-dark-lavender px-6">
-                          <Calendar className="h-4 w-4 mr-2" />
-                          Browse Events
-                        </Button>
-                      </Link>
-                    </div>
-                  </Card>
-                )}
+              <p className="text-3xl font-bold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
+                $30.00
+              </p>
+              <p className="text-sm text-brand-purple" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                1 payment(s)
+              </p>
             </div>
-          ) : (
-            <Card className="p-12 bg-background rounded-2xl border border-[var(--neutral-800)]">
-              <div className="text-center">
-                <AlertCircle className="h-16 w-16 text-[var(--neutral-800)] mx-auto mb-4" />
-                <p className="text-brand-purple " style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
-                  Failed to load event activity. Please try refreshing the page.
+            <div className="p-4 bg-[var(--lavender-300)]/30 rounded-xl border border-[var(--neutral-800)]">
+              <div className="flex items-center gap-2 mb-2">
+                <Heart className="h-4 w-4 text-[var(--coral)]" />
+                <span className="text-sm text-[var(--coral)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                  Total Donations
+                </span>
+              </div>
+              <p className="text-3xl font-bold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
+                $0.00
+              </p>
+              <p className="text-sm text-brand-purple" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                0 donation(s)
+              </p>
+            </div>
+          </div>
+
+          {/* Filter Tabs */}
+          <div className="flex gap-2 mb-6">
+            <button
+              onClick={() => setActiveTransactionTab('all')}
+              className={`px-6 py-2 rounded-full font-medium transition-all ${
+                activeTransactionTab === 'all'
+                  ? 'bg-[var(--purple-lavender)] text-white'
+                  : 'border-2 border-[var(--purple-lavender)] text-[var(--purple-lavender)] bg-transparent hover:bg-[var(--lavender-300)]/30'
+              }`}
+              style={{ fontFamily: "'Nunito Sans', sans-serif" }}
+            >
+              All (1)
+            </button>
+            <button
+              onClick={() => setActiveTransactionTab('subscriptions')}
+              className={`px-6 py-2 rounded-full font-medium transition-all ${
+                activeTransactionTab === 'subscriptions'
+                  ? 'bg-[var(--purple-lavender)] text-white'
+                  : 'border-2 border-[var(--purple-lavender)] text-[var(--purple-lavender)] bg-transparent hover:bg-[var(--lavender-300)]/30'
+              }`}
+              style={{ fontFamily: "'Nunito Sans', sans-serif" }}
+            >
+              Subscriptions (1)
+            </button>
+            <button
+              onClick={() => setActiveTransactionTab('donations')}
+              className={`px-6 py-2 rounded-full font-medium transition-all ${
+                activeTransactionTab === 'donations'
+                  ? 'bg-[var(--purple-lavender)] text-white'
+                  : 'border-2 border-[var(--purple-lavender)] text-[var(--purple-lavender)] bg-transparent hover:bg-[var(--lavender-300)]/30'
+              }`}
+              style={{ fontFamily: "'Nunito Sans', sans-serif" }}
+            >
+              Donations (0)
+            </button>
+          </div>
+
+          {/* Transaction List */}
+          <div className="space-y-4">
+            {(activeTransactionTab === 'all' || activeTransactionTab === 'subscriptions') && (
+              <div className="flex items-center justify-between p-4 border border-[var(--neutral-800)] rounded-xl">
+                <div className="flex items-center gap-4">
+                  <div className="w-12 h-12 bg-[var(--purple-lavender)] rounded-lg"></div>
+                  <div>
+                    <div className="flex items-center gap-2 mb-1">
+                      <span className="font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
+                        Annual Membership
+                      </span>
+                      <Badge className="bg-[var(--green-light)] text-white text-xs px-2 py-0.5 rounded">
+                        active
+                      </Badge>
+                    </div>
+                    <div className="flex items-center gap-2 text-sm text-brand-purple" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                      <Calendar className="h-3.5 w-3.5" />
+                      <span>Dec 16, 2025</span>
+                      <span>•</span>
+                      <span>Custom</span>
+                    </div>
+                    <span className="text-sm text-[var(--coral)]" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                      Manual Payment
+                    </span>
+                  </div>
+                </div>
+                <span className="text-xl font-semibold text-[var(--purple-ink)]" style={{ fontFamily: "'Inter', sans-serif" }}>
+                  $30.00
+                </span>
+              </div>
+            )}
+            {activeTransactionTab === 'donations' && (
+              <div className="text-center py-8">
+                <Heart className="h-12 w-12 text-[var(--neutral-800)] mx-auto mb-3" />
+                <p className="text-brand-purple" style={{ fontFamily: "'Nunito Sans', sans-serif" }}>
+                  No donations yet
                 </p>
               </div>
-            </Card>
-          )}
-        </div>
+            )}
+          </div>
+        </Card>
+
       </div>
       <MemberFooter />
     </div>
diff --git a/src/pages/members/Financials.js b/src/pages/members/Financials.js
index 5953851..7f8ac96 100644
--- a/src/pages/members/Financials.js
+++ b/src/pages/members/Financials.js
@@ -160,13 +160,9 @@ export default function Financials() {
                     <Card key={report.id} className="p-8 bg-background rounded-2xl border border-[var(--neutral-800)] hover:shadow-lg transition-shadow">
                       <div className="flex items-center gap-6">
                         {/* Year Badge */}
-                        <div className="bg-gradient-to-br from-brand-purple  to-[var(--purple-ink)] p-6 rounded-xl text-white min-w-[120px] text-center">
-                          <DollarSign className="h-8 w-8 mx-auto mb-2" />
-                          <div className="text-3xl font-bold" style={{ fontFamily: "'Inter', sans-serif" }}>
-                            {report.year}
-                          </div>
-                          <div className="text-sm opacity-90">Fiscal Year</div>
-                        </div>
+                        <div className="bg-gradient-to-br from-brand-purple  to-[var(--purple-ink)] p-4 rounded-xl self-start">
+                <DollarSign className="h-8 w-8 text-white" />
+              </div>
 
                         {/* Report Details */}
                         <div className="flex-1">
diff --git a/src/pages/members/NewsletterArchive.js b/src/pages/members/NewsletterArchive.js
index 45576d4..9febb0a 100644
--- a/src/pages/members/NewsletterArchive.js
+++ b/src/pages/members/NewsletterArchive.js
@@ -167,9 +167,9 @@ export default function NewsletterArchive() {
                   {groupedNewsletters[year].map(newsletter => (
                     <Card key={newsletter.id} className="p-6 bg-background rounded-2xl border border-[var(--neutral-800)] hover:shadow-lg transition-shadow">
                       <div className="flex items-start gap-4">
-                        <div className="bg-[var(--neutral-800)]/20 p-3 rounded-lg flex-shrink-0">
-                          <FileText className="h-6 w-6 text-brand-purple " />
-                        </div>
+                       <div className="bg-gradient-to-br from-brand-purple  to-[var(--purple-ink)] p-4 rounded-xl">
+                <FileText className="h-8 w-8 text-white" />
+              </div>
                         <div className="flex-1 min-w-0">
                           <h3 className="text-xl font-semibold text-[var(--purple-ink)] mb-2" style={{ fontFamily: "'Inter', sans-serif" }}>
                             {newsletter.title}