diff --git a/backend/backend/settings.py b/backend/backend/settings.py
index a126898..1fbe9a4 100644
--- a/backend/backend/settings.py
+++ b/backend/backend/settings.py
@@ -226,7 +226,7 @@ REST_FRAMEWORK = {
         "rest_framework.throttling.AnonRateThrottle",
         "rest_framework.throttling.UserRateThrottle",
     ],
-    "DEFAULT_THROTTLE_RATES": {"anon": "100/day", "user": "1000/day"},
+    "DEFAULT_THROTTLE_RATES": {"anon": "1000/day", "user": "1000/day"},
     "DEFAULT_PAGINATION_CLASS": "rest_framework.pagination.LimitOffsetPagination",
     "PAGE_SIZE": 5,
     "DEFAULT_RENDERER_CLASSES": DEFAULT_RENDERER_CLASSES,
diff --git a/backend/foldbank/api.py b/backend/foldbank/api.py
index 520e420..2714c03 100644
--- a/backend/foldbank/api.py
+++ b/backend/foldbank/api.py
@@ -226,6 +226,13 @@ class UpcomingRecurringPaymentAPI(generics.ListAPIView):
         amount = serializers.IntegerField()
         due_on = serializers.DateTimeField()
         frequency = serializers.DurationField()
+        tag = inline_serializer(
+            required=True,
+            fields={
+                "title": serializers.CharField(required=True),
+                "icon_type": serializers.CharField(required=True),
+            },
+        )
         to_account = inline_serializer(
             required=True,
             fields={
diff --git a/backend/foldbank/management/commands/populatedb.py b/backend/foldbank/management/commands/populatedb.py
index 44bddf3..f81a861 100644
--- a/backend/foldbank/management/commands/populatedb.py
+++ b/backend/foldbank/management/commands/populatedb.py
@@ -226,10 +226,14 @@ class Command(BaseCommand):
         for account in accounts:
             Account.objects.get_or_create(**account)
 
-        # recurring payment
+        # date prep
         ist = ZoneInfo("Asia/Kolkata")
         today = datetime.datetime.now(tz=ist)
         yesterday = datetime.datetime.now(tz=ist) - datetime.timedelta(days=1)
+
+        # recurring payment
+        seven_days_future = datetime.datetime.now(tz=ist) + datetime.timedelta(days=7)
+        seventeen_days_future = datetime.datetime.now(tz=ist) + datetime.timedelta(days=17)
         recurring_payments = [
             {
                 "from_account": Account.objects.get(user=nishant, bank=Bank.objects.get(name="Axis Bank")),
@@ -239,23 +243,26 @@ class Command(BaseCommand):
                 "defaults": {
                     "created_at": datetime.datetime(year=2023, month=1, day=23, tzinfo=ist),
                     "frequency": datetime.timedelta(days=30),
-                    "due_on": datetime.datetime(year=2023, month=1, day=23, tzinfo=ist),
+                    "due_on": datetime.datetime(year=seven_days_future.year, month=seven_days_future.month, day=seven_days_future.day, tzinfo=ist),
                 },
             },
             {
                 "from_account": Account.objects.get(user=nishant, bank=Bank.objects.get(name="Axis Bank")),
                 "to_account": Account.objects.get(user=admin, holders_name="YouTube Premium"),
-                "amount": "36031",
-                "tag": Tag.objects.get(title="Rent"),
+                "amount": "130",
+                "tag": Tag.objects.get(title="Subscription", sub_category="YouTube"),
                 "defaults": {
                     "created_at": datetime.datetime(year=2023, month=1, day=20, tzinfo=ist),
                     "frequency": datetime.timedelta(days=30),
-                    "due_on": datetime.datetime(year=2023, month=2, day=19, tzinfo=ist),
+                    "due_on": datetime.datetime(year=seventeen_days_future.year, month=seventeen_days_future.month, day=seventeen_days_future.day, tzinfo=ist),
                 }
             },
         ]
         for rp in recurring_payments:
-            RecurringPayment.objects.get_or_create(**rp)
+            recPay, _ = RecurringPayment.objects.get_or_create(**rp)
+            recPay.created_at = rp["defaults"]["created_at"]
+            recPay.due_on = rp["defaults"]["due_on"]
+            recPay.save()
 
         # transactions
         transactions = [
diff --git a/web/app/components/Upcoming.tsx b/web/app/components/Upcoming.tsx
index fb4daf9..e8749bd 100644
--- a/web/app/components/Upcoming.tsx
+++ b/web/app/components/Upcoming.tsx
@@ -1,38 +1,62 @@
+"use client"
+
 
 import React from 'react'
+import useSWR from 'swr'
 import styles from './upcoming.module.css'
 import { BsTriangleFill } from 'react-icons/bs'
 import RecurringPayment from './RecurringPayment'
 
 export default function Upcoming() {
-  const recurringPayments = [
-    {
-      title: "2568 Rent",
-      amount: "36,163",
-      due_in_days: "7",
-      icon_type: "rent",
-    },
-    {
-      title: "YouTube Premium",
-      amount: "130",
-      due_in_days: "17",
-      icon_type: "youtube",
-    },
-  ]
+  const fetcher = (...args) => fetch(...args).then((res) => res.json())
+  const { data, error } = useSWR(`http://localhost:8000/api/v1/recurringPayments/upcoming/`, fetcher)
+
+  if (error) return <div>Error: Failed to load</div>
+  if (!data) return <div></div>
+
+  const recurringPayments = data.results
+  // const recurringPayments = [
+  //   {
+  //     title: "2568 Rent",
+  //     amount: "36,163",
+  //     due_in_days: "7",
+  //     icon_type: "rent",
+  //   },
+  //   {
+  //     title: "YouTube Premium",
+  //     amount: "130",
+  //     due_in_days: "17",
+  //     icon_type: "youtube",
+  //   },
+  // ]
+
   const recurringPaymentsDiv = []
+  let sum_amount_upcoming = 0
+
   recurringPayments.forEach((payment) => {
+    const today = new Date()
+    const due_on = new Date(payment.due_on)
+    const diff_time = Math.abs(due_on - today);
+    const due_in_days = Math.ceil(diff_time / (1000 * 60 * 60 * 24));
+    sum_amount_upcoming += payment.amount
+
+    let freq = ""
+    if (payment.frequency == "30 00:00:00") {
+      freq = "monthly"
+    }
+
     recurringPaymentsDiv.push(
       <RecurringPayment
-        key={payment.title}
-        title={payment.title}
-        amount={payment.amount}
-        due_in_days={payment.due_in_days}
-        icon_type={payment.icon_type}
+        key={payment.id}
+        title={payment.to_account.holders_name}
+        amount={payment.amount.toLocaleString('en-IN')}
+        due_in_days={due_in_days}
+        icon_type={payment.tag.icon_type}
+        frequency={freq}
       />
     )
   })
 
-
   return (
     <div className={styles.main}>
       <div className={styles.summary}>
@@ -43,7 +67,7 @@ export default function Upcoming() {
           />
           <div className={styles.text}>Upcoming</div>
         </div>
-        <div className={styles.right}>₹36,163</div>
+        <div className={styles.right}>₹{sum_amount_upcoming.toLocaleString("en-IN")}</div>
       </div>
       {recurringPaymentsDiv}
     </div>