diff --git a/backend/src/Api/Sudo/Controller/IssueController.php b/backend/src/Api/Sudo/Controller/IssueController.php
new file mode 100644
index 00000000..ac2c0098
--- /dev/null
+++ b/backend/src/Api/Sudo/Controller/IssueController.php
@@ -0,0 +1,45 @@
+<?php
+
+namespace App\Api\Sudo\Controller;
+
+use App\Api\Sudo\Object\SudoIssueObject;
+use App\Entity\Issue;
+use App\Entity\Type\IssueStatus;
+use App\Service\Issue\IssueService;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\JsonResponse;
+use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\Routing\Attribute\Route;
+
+class IssueController extends AbstractController
+{
+    public function __construct(
+        private IssueService $issueService,
+    )
+    {
+    }
+
+    #[Route('/issues', methods: ['GET'])]
+    public function getIssues(Request $request): JsonResponse
+    {
+        $subdomain = $request->query->has('subdomain') ? $request->query->getString('subdomain') : null;
+        $status = $request->query->has('status')
+            ? IssueStatus::tryFrom($request->query->getString('status'))
+            : null;
+        $limit = $request->query->getInt('limit', 50);
+        $offset = $request->query->getInt('offset', 0);
+
+        return new JsonResponse(
+            array_map(
+                fn($issue) => new SudoIssueObject($issue),
+                $this->issueService->getIssuesGlobal($subdomain, $status, $limit, $offset)
+            )
+        );
+    }
+
+    #[Route('/issues/{id}', methods: ['GET'])]
+    public function getIssue(Issue $issue): JsonResponse
+    {
+        return new JsonResponse(new SudoIssueObject($issue));
+    }
+}
diff --git a/backend/src/Api/Sudo/Controller/NewsletterController.php b/backend/src/Api/Sudo/Controller/NewsletterController.php
new file mode 100644
index 00000000..305ed75b
--- /dev/null
+++ b/backend/src/Api/Sudo/Controller/NewsletterController.php
@@ -0,0 +1,44 @@
+<?php
+
+namespace App\Api\Sudo\Controller;
+
+use App\Api\Sudo\Object\NewsletterObject;
+use App\Entity\Newsletter;
+use App\Service\Newsletter\NewsletterService;
+use Symfony\Bundle\FrameworkBundle\Controller\AbstractController;
+use Symfony\Component\HttpFoundation\JsonResponse;
+use Symfony\Component\HttpFoundation\Request;
+use Symfony\Component\Routing\Attribute\Route;
+
+class NewsletterController extends AbstractController
+{
+    public function __construct(
+        private NewsletterService $newsletterService,
+    )
+    {
+    }
+
+    #[Route('/newsletters', methods: ['GET'])]
+    public function getNewsletters(Request $request): JsonResponse
+    {
+        $name = $request->query->has('name') ? $request->query->getString('name') : null;
+        $limit = $request->query->getInt('limit', 50);
+        $offset = $request->query->getInt('offset', 0);
+
+        return new JsonResponse(
+            array_map(
+                fn($newsletter) => new NewsletterObject($newsletter),
+                $this->newsletterService->getNewsletters($name, $limit, $offset)
+            )
+        );
+    }
+
+    #[Route('/newsletters/{id}', methods: ['GET'])]
+    public function getNewsletter(Newsletter $newsletter): JsonResponse
+    {
+        return new JsonResponse([
+            'newsletter' => new NewsletterObject($newsletter),
+            'stats' => $this->newsletterService->getNewsletterStats($newsletter),
+        ]);
+    }
+}
diff --git a/backend/src/Api/Sudo/Object/NewsletterObject.php b/backend/src/Api/Sudo/Object/NewsletterObject.php
new file mode 100644
index 00000000..341e3b40
--- /dev/null
+++ b/backend/src/Api/Sudo/Object/NewsletterObject.php
@@ -0,0 +1,29 @@
+<?php
+
+namespace App\Api\Sudo\Object;
+
+use App\Entity\Newsletter;
+
+class NewsletterObject
+{
+    public int $id;
+    public int $created_at;
+    public string $subdomain;
+    public string $name;
+    public int $user_id;
+    public ?int $organization_id;
+    public ?string $language_code;
+    public bool $is_rtl;
+
+    public function __construct(Newsletter $newsletter)
+    {
+        $this->id = $newsletter->getId();
+        $this->created_at = $newsletter->getCreatedAt()->getTimestamp();
+        $this->subdomain = $newsletter->getSubdomain();
+        $this->name = $newsletter->getName();
+        $this->user_id = $newsletter->getUserId();
+        $this->organization_id = $newsletter->getOrganizationId();
+        $this->language_code = $newsletter->getLanguageCode();
+        $this->is_rtl = $newsletter->isRtl();
+    }
+}
diff --git a/backend/src/Api/Sudo/Object/SudoIssueObject.php b/backend/src/Api/Sudo/Object/SudoIssueObject.php
new file mode 100644
index 00000000..cd567cf1
--- /dev/null
+++ b/backend/src/Api/Sudo/Object/SudoIssueObject.php
@@ -0,0 +1,38 @@
+<?php
+
+namespace App\Api\Sudo\Object;
+
+use App\Entity\Issue;
+use App\Entity\Type\IssueStatus;
+
+class SudoIssueObject
+{
+    public int $id;
+    public int $created_at;
+    public string $uuid;
+    public ?string $subject;
+    public IssueStatus $status;
+    public string $newsletter_subdomain;
+    public int $newsletter_id;
+    public ?int $scheduled_at;
+    public ?int $sending_at;
+    public ?int $sent_at;
+    public int $total_sendable;
+    public ?string $error_private;
+
+    public function __construct(Issue $issue)
+    {
+        $this->id = $issue->getId();
+        $this->created_at = $issue->getCreatedAt()->getTimestamp();
+        $this->uuid = $issue->getUuid();
+        $this->subject = $issue->getSubject();
+        $this->status = $issue->getStatus();
+        $this->newsletter_subdomain = $issue->getNewsletter()->getSubdomain();
+        $this->newsletter_id = $issue->getNewsletter()->getId();
+        $this->scheduled_at = $issue->getScheduledAt()?->getTimestamp();
+        $this->sending_at = $issue->getSendingAt()?->getTimestamp();
+        $this->sent_at = $issue->getSentAt()?->getTimestamp();
+        $this->total_sendable = $issue->getTotalSendable();
+        $this->error_private = $issue->getErrorPrivate();
+    }
+}
diff --git a/backend/src/Api/Sudo/Resolver/EntityResolver.php b/backend/src/Api/Sudo/Resolver/EntityResolver.php
index 321adba2..4708492d 100644
--- a/backend/src/Api/Sudo/Resolver/EntityResolver.php
+++ b/backend/src/Api/Sudo/Resolver/EntityResolver.php
@@ -3,6 +3,8 @@
 namespace App\Api\Sudo\Resolver;
 
 use App\Entity\Approval;
+use App\Entity\Issue;
+use App\Entity\Newsletter;
 use App\Entity\SubscriberImport;
 use Doctrine\ORM\EntityManagerInterface;
 use Symfony\Component\HttpFoundation\Exception\BadRequestException;
@@ -16,6 +18,8 @@ class EntityResolver implements ValueResolverInterface
     public const ENTITIES = [
         'approvals' => Approval::class,
         'subscriber-imports' => SubscriberImport::class,
+        'newsletters' => Newsletter::class,
+        'issues' => Issue::class,
     ];
 
     public function __construct(
diff --git a/backend/src/Service/Issue/IssueService.php b/backend/src/Service/Issue/IssueService.php
index 953ff277..a83198d3 100644
--- a/backend/src/Service/Issue/IssueService.php
+++ b/backend/src/Service/Issue/IssueService.php
@@ -106,6 +106,38 @@ public function updateIssue(Issue $issue, UpdateIssueDto $updates): Issue
         return $issue;
     }
 
+    /**
+     * @return Issue[]
+     */
+    public function getIssuesGlobal(
+        ?string      $subdomain,
+        ?IssueStatus $status,
+        int          $limit,
+        int          $offset,
+    ): array
+    {
+        $qb = $this->em->createQueryBuilder()
+            ->select('i')
+            ->from(Issue::class, 'i')
+            ->join('i.newsletter', 'n')
+            ->orderBy('i.id', 'DESC')
+            ->setMaxResults($limit)
+            ->setFirstResult($offset);
+
+        if ($subdomain) {
+            $qb->andWhere('n.subdomain = :subdomain')
+                ->setParameter('subdomain', $subdomain);
+        }
+
+        if ($status) {
+            $qb->andWhere('i.status = :status')
+                ->setParameter('status', $status);
+        }
+
+        /** @var Issue[] */
+        return $qb->getQuery()->getResult();
+    }
+
     /**
      * @return ArrayCollection<int, Issue>
      */
diff --git a/backend/src/Service/Newsletter/NewsletterService.php b/backend/src/Service/Newsletter/NewsletterService.php
index a14e5bee..854f6235 100644
--- a/backend/src/Service/Newsletter/NewsletterService.php
+++ b/backend/src/Service/Newsletter/NewsletterService.php
@@ -7,6 +7,7 @@
 use App\Entity\NewsletterList;
 use App\Entity\Newsletter;
 use App\Entity\Send;
+use App\Entity\SendingProfile;
 use App\Entity\Subscriber;
 use App\Entity\Type\IssueStatus;
 use App\Entity\Type\SendStatus;
@@ -102,6 +103,25 @@ public function deleteNewsletter(Newsletter $newsletter): void
         $this->em->flush();
     }
 
+    /**
+     * @return Newsletter[]
+     */
+    public function getNewsletters(?string $name, int $limit, int $offset): array
+    {
+        $qb = $this->em->getRepository(Newsletter::class)->createQueryBuilder('n')
+            ->orderBy('n.id', 'DESC')
+            ->setMaxResults($limit)
+            ->setFirstResult($offset);
+
+        if ($name) {
+            $qb->andWhere('LOWER(n.name) LIKE LOWER(:name)')
+                ->setParameter('name', '%' . $name . '%');
+        }
+
+        /** @var Newsletter[] */
+        return $qb->getQuery()->getResult();
+    }
+
     public function getNewsletterById(int $id): ?Newsletter
     {
         return $this->em->getRepository(Newsletter::class)->find($id);
@@ -164,7 +184,7 @@ public function getNewsletterUser(Newsletter $newsletter, int $userId): User
     }
 
     /**
-     * @return array<string, array{total: int|float, last_30_days: int|float}>
+     * @return array{subscribers: array{total: int, last_30_days: int}, issues: array{total: int, last_30_days: int}, bounced_rate: array{total: float, last_30_days: float}, complained_rate: array{total: float, last_30_days: float}, lists_count: int, sending_profiles_count: int}
      */
     public function getNewsletterStats(Newsletter $newsletter): array
     {
@@ -224,6 +244,20 @@ public function getNewsletterStats(Newsletter $newsletter): array
         $bouncedRateLast30d = $totalSendsLast30d > 0 ? round(($bouncedSendsLast30d / $totalSendsLast30d) * 100, 2) : 0.0;
         $complainedRateLast30d = $totalSendsLast30d > 0 ? round(($complainedSendsLast30d / $totalSendsLast30d) * 100, 2) : 0.0;
 
+        $listsCount = (int) $this->em->getRepository(NewsletterList::class)->createQueryBuilder('l')
+            ->select('COUNT(l.id)')
+            ->where('l.newsletter = :newsletter')
+            ->setParameter('newsletter', $newsletter)
+            ->getQuery()
+            ->getSingleScalarResult();
+
+        $sendingProfilesCount = (int) $this->em->getRepository(SendingProfile::class)->createQueryBuilder('sp')
+            ->select('COUNT(sp.id)')
+            ->where('sp.newsletter = :newsletter')
+            ->setParameter('newsletter', $newsletter)
+            ->getQuery()
+            ->getSingleScalarResult();
+
         return [
             'subscribers' => [
                 'total' => $subscribers,
@@ -241,6 +275,8 @@ public function getNewsletterStats(Newsletter $newsletter): array
                 'total' => $complainedRate,
                 'last_30_days' => $complainedRateLast30d,
             ],
+            'lists_count' => $listsCount,
+            'sending_profiles_count' => $sendingProfilesCount,
         ];
     }
 
diff --git a/backend/tests/Api/Sudo/Issue/GetIssueTest.php b/backend/tests/Api/Sudo/Issue/GetIssueTest.php
new file mode 100644
index 00000000..cb35a004
--- /dev/null
+++ b/backend/tests/Api/Sudo/Issue/GetIssueTest.php
@@ -0,0 +1,51 @@
+<?php
+
+namespace App\Tests\Api\Sudo\Issue;
+
+use App\Api\Sudo\Controller\IssueController;
+use App\Api\Sudo\Object\SudoIssueObject;
+use App\Service\Issue\IssueService;
+use App\Tests\Case\WebTestCase;
+use App\Tests\Factory\IssueFactory;
+use PHPUnit\Framework\Attributes\CoversClass;
+
+#[CoversClass(IssueController::class)]
+#[CoversClass(IssueService::class)]
+#[CoversClass(SudoIssueObject::class)]
+class GetIssueTest extends WebTestCase
+{
+    public function test_get_issue(): void
+    {
+        $issue = IssueFactory::createOne();
+
+        $response = $this->sudoApi(
+            'GET',
+            '/issues/' . $issue->getId()
+        );
+
+        $this->assertSame(200, $response->getStatusCode());
+        $data = $this->getJson();
+        $this->assertArrayHasKey('id', $data);
+        $this->assertArrayHasKey('created_at', $data);
+        $this->assertArrayHasKey('uuid', $data);
+        $this->assertArrayHasKey('subject', $data);
+        $this->assertArrayHasKey('status', $data);
+        $this->assertArrayHasKey('newsletter_subdomain', $data);
+        $this->assertArrayHasKey('newsletter_id', $data);
+        $this->assertArrayHasKey('scheduled_at', $data);
+        $this->assertArrayHasKey('sending_at', $data);
+        $this->assertArrayHasKey('sent_at', $data);
+        $this->assertArrayHasKey('total_sendable', $data);
+        $this->assertArrayHasKey('error_private', $data);
+    }
+
+    public function test_get_issue_not_found(): void
+    {
+        $response = $this->sudoApi(
+            'GET',
+            '/issues/99999'
+        );
+
+        $this->assertSame(404, $response->getStatusCode());
+    }
+}
diff --git a/backend/tests/Api/Sudo/Issue/GetIssuesTest.php b/backend/tests/Api/Sudo/Issue/GetIssuesTest.php
new file mode 100644
index 00000000..4b200452
--- /dev/null
+++ b/backend/tests/Api/Sudo/Issue/GetIssuesTest.php
@@ -0,0 +1,76 @@
+<?php
+
+namespace App\Tests\Api\Sudo\Issue;
+
+use App\Api\Sudo\Controller\IssueController;
+use App\Api\Sudo\Object\SudoIssueObject;
+use App\Entity\Type\IssueStatus;
+use App\Service\Issue\IssueService;
+use App\Tests\Case\WebTestCase;
+use App\Tests\Factory\IssueFactory;
+use App\Tests\Factory\NewsletterFactory;
+use PHPUnit\Framework\Attributes\CoversClass;
+
+#[CoversClass(IssueController::class)]
+#[CoversClass(IssueService::class)]
+#[CoversClass(SudoIssueObject::class)]
+class GetIssuesTest extends WebTestCase
+{
+    public function test_get_issues(): void
+    {
+        IssueFactory::createMany(3, [
+            'status' => IssueStatus::SENT,
+        ]);
+        IssueFactory::createMany(2, [
+            'status' => IssueStatus::DRAFT,
+        ]);
+
+        $response = $this->sudoApi(
+            'GET',
+            '/issues?status=sent'
+        );
+
+        $this->assertSame(200, $response->getStatusCode());
+        $data = $this->getJson();
+        $this->assertCount(3, $data);
+
+        $issue = $data[0];
+        $this->assertIsArray($issue);
+        $this->assertCount(12, $issue);
+        $this->assertArrayHasKey('id', $issue);
+        $this->assertArrayHasKey('created_at', $issue);
+        $this->assertArrayHasKey('uuid', $issue);
+        $this->assertArrayHasKey('subject', $issue);
+        $this->assertArrayHasKey('status', $issue);
+        $this->assertArrayHasKey('newsletter_subdomain', $issue);
+        $this->assertArrayHasKey('newsletter_id', $issue);
+        $this->assertArrayHasKey('scheduled_at', $issue);
+        $this->assertArrayHasKey('sending_at', $issue);
+        $this->assertArrayHasKey('sent_at', $issue);
+        $this->assertArrayHasKey('total_sendable', $issue);
+        $this->assertArrayHasKey('error_private', $issue);
+    }
+
+    public function test_get_issues_by_subdomain(): void
+    {
+        $newsletter = NewsletterFactory::createOne();
+
+        $issue = IssueFactory::createOne([
+            'newsletter' => $newsletter,
+        ]);
+        IssueFactory::createMany(3);
+
+        $response = $this->sudoApi(
+            'GET',
+            "/issues?subdomain={$newsletter->getSubdomain()}"
+        );
+
+        $this->assertSame(200, $response->getStatusCode());
+        $data = $this->getJson();
+        $this->assertCount(1, $data);
+
+        $item = $data[0];
+        $this->assertIsArray($item);
+        $this->assertSame($issue->getId(), $item['id']);
+    }
+}
diff --git a/backend/tests/Api/Sudo/Newsletter/GetNewsletterTest.php b/backend/tests/Api/Sudo/Newsletter/GetNewsletterTest.php
new file mode 100644
index 00000000..76d40801
--- /dev/null
+++ b/backend/tests/Api/Sudo/Newsletter/GetNewsletterTest.php
@@ -0,0 +1,41 @@
+<?php
+
+namespace App\Tests\Api\Sudo\Newsletter;
+
+use App\Api\Sudo\Controller\NewsletterController;
+use App\Api\Sudo\Object\NewsletterObject;
+use App\Service\Newsletter\NewsletterService;
+use App\Tests\Case\WebTestCase;
+use App\Tests\Factory\NewsletterFactory;
+use PHPUnit\Framework\Attributes\CoversClass;
+
+#[CoversClass(NewsletterController::class)]
+#[CoversClass(NewsletterService::class)]
+#[CoversClass(NewsletterObject::class)]
+class GetNewsletterTest extends WebTestCase
+{
+    public function test_get_newsletter(): void
+    {
+        $newsletter = NewsletterFactory::createOne();
+
+        $response = $this->sudoApi(
+            'GET',
+            '/newsletters/' . $newsletter->getId()
+        );
+
+        $this->assertSame(200, $response->getStatusCode());
+        $data = $this->getJson();
+        $this->assertArrayHasKey('newsletter', $data);
+        $this->assertArrayHasKey('stats', $data);
+    }
+
+    public function test_get_newsletter_not_found(): void
+    {
+        $response = $this->sudoApi(
+            'GET',
+            '/newsletters/99999'
+        );
+
+        $this->assertSame(404, $response->getStatusCode());
+    }
+}
diff --git a/backend/tests/Api/Sudo/Newsletter/GetNewslettersTest.php b/backend/tests/Api/Sudo/Newsletter/GetNewslettersTest.php
new file mode 100644
index 00000000..d4445e3c
--- /dev/null
+++ b/backend/tests/Api/Sudo/Newsletter/GetNewslettersTest.php
@@ -0,0 +1,63 @@
+<?php
+
+namespace App\Tests\Api\Sudo\Newsletter;
+
+use App\Api\Sudo\Controller\NewsletterController;
+use App\Api\Sudo\Object\NewsletterObject;
+use App\Service\Newsletter\NewsletterService;
+use App\Tests\Case\WebTestCase;
+use App\Tests\Factory\NewsletterFactory;
+use PHPUnit\Framework\Attributes\CoversClass;
+
+#[CoversClass(NewsletterController::class)]
+#[CoversClass(NewsletterService::class)]
+#[CoversClass(NewsletterObject::class)]
+class GetNewslettersTest extends WebTestCase
+{
+    public function test_get_newsletters(): void
+    {
+        NewsletterFactory::createMany(5);
+
+        $response = $this->sudoApi(
+            'GET',
+            '/newsletters'
+        );
+
+        $this->assertSame(200, $response->getStatusCode());
+        $data = $this->getJson();
+        $this->assertCount(5, $data);
+
+        $newsletter = $data[0];
+        $this->assertIsArray($newsletter);
+        $this->assertCount(8, $newsletter);
+        $this->assertArrayHasKey('id', $newsletter);
+        $this->assertArrayHasKey('created_at', $newsletter);
+        $this->assertArrayHasKey('subdomain', $newsletter);
+        $this->assertArrayHasKey('name', $newsletter);
+        $this->assertArrayHasKey('user_id', $newsletter);
+        $this->assertArrayHasKey('organization_id', $newsletter);
+        $this->assertArrayHasKey('language_code', $newsletter);
+        $this->assertArrayHasKey('is_rtl', $newsletter);
+    }
+
+    public function test_get_newsletters_by_name(): void
+    {
+        $newsletter = NewsletterFactory::createOne([
+            'name' => 'My Unique Newsletter',
+        ]);
+        NewsletterFactory::createMany(3);
+
+        $response = $this->sudoApi(
+            'GET',
+            '/newsletters?name=My Unique Newsletter'
+        );
+
+        $this->assertSame(200, $response->getStatusCode());
+        $data = $this->getJson();
+        $this->assertCount(1, $data);
+
+        $item = $data[0];
+        $this->assertIsArray($item);
+        $this->assertSame($newsletter->getId(), $item['id']);
+    }
+}
diff --git a/frontend/src/routes/sudo/Nav.svelte b/frontend/src/routes/sudo/Nav.svelte
index bbbb1a0d..b5f1da13 100644
--- a/frontend/src/routes/sudo/Nav.svelte
+++ b/frontend/src/routes/sudo/Nav.svelte
@@ -7,6 +7,8 @@
 	import { statsStore } from './lib/stores/sudoStore.js';
 	import { Tag } from '@hyvor/design/components';
 	import IconSend from '@hyvor/icons/IconSend';
+	import IconJournal from '@hyvor/icons/IconJournal';
+	import IconEnvelope from '@hyvor/icons/IconEnvelope';
 </script>
 
 <div class="nav">
@@ -40,6 +42,24 @@
 
 		<Divider margin={10} />
 
+		<NavLink
+			href="/sudo/newsletters"
+			active={$page.url.pathname.startsWith('/sudo/newsletters')}
+		>
+			<NavItem>
+				<IconJournal slot="icon" />
+				<span slot="text">Newsletters</span>
+			</NavItem>
+		</NavLink>
+		<NavLink href="/sudo/issues" active={$page.url.pathname.startsWith('/sudo/issues')}>
+			<NavItem>
+				<IconEnvelope slot="icon" />
+				<span slot="text">Issues</span>
+			</NavItem>
+		</NavLink>
+
+		<Divider margin={10} />
+
 		<NavLink href="/sudo/messenger" active={$page.url.pathname === '/sudo/messenger'}>
 			<NavItem>
 				<IconSend slot="icon" />
diff --git a/frontend/src/routes/sudo/issues/+page.svelte b/frontend/src/routes/sudo/issues/+page.svelte
new file mode 100644
index 00000000..63ccd4af
--- /dev/null
+++ b/frontend/src/routes/sudo/issues/+page.svelte
@@ -0,0 +1,205 @@
+<script lang="ts">
+	import {
+		ActionList,
+		ActionListItem,
+		Button,
+		Dropdown,
+		IconButton,
+		IconMessage,
+		LoadButton,
+		Loader,
+		TextInput,
+		toast
+	} from '@hyvor/design/components';
+	import { onMount } from 'svelte';
+	import { issueStore } from '../lib/stores/sudoStore';
+	import IssueRow from './IssueRow.svelte';
+	import type { IssueStatus, SudoIssue } from '../types';
+	import IconX from '@hyvor/icons/IconX';
+	import IconCaretDown from '@hyvor/icons/IconCaretDown';
+	import { ITEMS_PER_PAGE } from '../lib/generalActions';
+	import { getIssues, ISSUE_STATUS_FILTERS } from '../lib/actions/issueActions';
+	import { goto } from '$app/navigation';
+
+	let loading = $state(true);
+	let hasMore = $state(true);
+	let loadingMore = $state(false);
+	let error: string | null = $state(null);
+
+	let search: string | undefined = $state(undefined);
+	let searchValue: string | undefined = $state(undefined);
+
+	let statusFilter: IssueStatus | undefined = $state(undefined);
+	let statusDropdownShow = $state(false);
+
+	function load(more = false) {
+		more ? (loadingMore = true) : (loading = true);
+
+		getIssues(
+			search ?? null,
+			statusFilter ?? null,
+			ITEMS_PER_PAGE,
+			more ? $issueStore.length : 0
+		)
+			.then((data) => {
+				if (more) {
+					issueStore.update((issues) => [...issues, ...data]);
+				} else {
+					issueStore.set(data);
+				}
+				hasMore = data.length === ITEMS_PER_PAGE;
+			})
+			.catch((e) => {
+				error = e.message;
+			})
+			.finally(() => {
+				loading = false;
+				loadingMore = false;
+			});
+	}
+
+	function handleSelect(issue: SudoIssue) {
+		goto(`/sudo/issues/${issue.id}`);
+	}
+
+	function handleSearchKeyup(e: any) {
+		if (e.key === 'Enter') {
+			searchValue = search;
+			load();
+		}
+
+		if (e.key === 'Escape') {
+			handleSearchClear();
+		}
+	}
+
+	function handleSearchClear() {
+		search = undefined;
+		searchValue = undefined;
+		load();
+	}
+
+	function onStatusClick(val: any) {
+		statusFilter = val;
+		load();
+		statusDropdownShow = false;
+	}
+
+	onMount(() => {
+		load();
+	});
+</script>
+
+{#if loading}
+	<Loader full />
+{:else if error}
+	<IconMessage error message={error} />
+{:else}
+	<div class="top">
+		<TextInput bind:value={search} on:keyup={handleSearchKeyup} size="small">
+			{#snippet start()}
+				Subdomain
+			{/snippet}
+			{#snippet end()}
+				<div class="search-icons">
+					<span class="enter">
+						{#if search !== searchValue}
+							&nbsp; ⏎
+						{/if}
+					</span>
+					<span class="clear">
+						{#if searchValue}
+							<IconButton size={16} on:click={handleSearchClear}>
+								<IconX size={12} />
+							</IconButton>
+						{/if}
+					</span>
+				</div>
+			{/snippet}
+		</TextInput>
+		<Dropdown bind:show={statusDropdownShow}>
+			{#snippet trigger()}
+				<Button color="input" size="small">
+					{#snippet start()}
+						Status
+					{/snippet}
+					<div class="dropdown-label">
+						{statusFilter ? ISSUE_STATUS_FILTERS[statusFilter] : 'None'}
+					</div>
+					{#if statusFilter}
+						<IconButton
+							size={14}
+							style="margin-left:4px;"
+							color="gray"
+							on:click={(e) => {
+								e.stopPropagation();
+								statusFilter = undefined;
+								load();
+							}}
+						>
+							<IconX size={10} />
+						</IconButton>
+					{/if}
+					{#snippet end()}
+						<IconCaretDown size={14} />
+					{/snippet}
+				</Button>
+			{/snippet}
+			{#snippet content()}
+				<ActionList>
+					{#each Object.entries(ISSUE_STATUS_FILTERS) as [key, value]}
+						<ActionListItem on:select={() => onStatusClick(key)}>{value}</ActionListItem
+						>
+					{/each}
+				</ActionList>
+			{/snippet}
+		</Dropdown>
+	</div>
+
+	{#if $issueStore.length === 0}
+		<IconMessage empty message="No issues found" />
+	{:else}
+		<div class="list">
+			{#each $issueStore as issue (issue.id)}
+				<IssueRow {issue} {handleSelect} />
+			{/each}
+			<LoadButton
+				text="Load More"
+				loading={loadingMore}
+				show={hasMore}
+				on:click={() => load(true)}
+			/>
+		</div>
+	{/if}
+{/if}
+
+<style>
+	.top {
+		padding: 20px 0 0 30px;
+	}
+
+	.list {
+		flex: 1;
+		overflow: auto;
+		padding: 20px 30px;
+	}
+
+	.search-icons {
+		display: flex;
+		gap: 5px;
+		align-items: center;
+
+		.enter,
+		.clear {
+			width: 20px;
+		}
+
+		.enter {
+			margin-top: 3px;
+		}
+	}
+
+	.dropdown-label {
+		font-weight: normal;
+	}
+</style>
diff --git a/frontend/src/routes/sudo/issues/IssueRow.svelte b/frontend/src/routes/sudo/issues/IssueRow.svelte
new file mode 100644
index 00000000..3eda095a
--- /dev/null
+++ b/frontend/src/routes/sudo/issues/IssueRow.svelte
@@ -0,0 +1,84 @@
+<script lang="ts">
+	import { Tag } from '@hyvor/design/components';
+	import type { SudoIssue } from '../types';
+	import RelativeTime from '../../console/@components/utils/RelativeTime.svelte';
+
+	interface Props {
+		issue: SudoIssue;
+		handleSelect: (issue: SudoIssue) => void;
+	}
+
+	let { issue, handleSelect }: Props = $props();
+
+	const statusColors: Record<string, 'default' | 'blue' | 'orange' | 'green'> = {
+		draft: 'default',
+		scheduled: 'blue',
+		sending: 'orange',
+		sent: 'green'
+	};
+</script>
+
+<button class="row" onclick={() => handleSelect(issue)}>
+	<div class="subject">
+		{issue.subject || 'No subject'}
+	</div>
+
+	<div class="status">
+		<Tag size="small" color={statusColors[issue.status] ?? 'default'}>
+			{issue.status}
+		</Tag>
+	</div>
+
+	<div class="newsletter">
+		{issue.newsletter_subdomain}
+	</div>
+
+	<div class="created-at">
+		<RelativeTime unix={issue.created_at} />
+	</div>
+
+	<div class="sent-at">
+		{#if issue.sent_at}
+			<RelativeTime unix={issue.sent_at} />
+		{:else}
+			—
+		{/if}
+	</div>
+</button>
+
+<style>
+	.row {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 15px;
+		background-color: var(--bg-light);
+		border-radius: var(--box-radius);
+		text-align: left;
+		width: 100%;
+	}
+
+	.row:hover {
+		background: var(--hover);
+	}
+
+	.subject {
+		width: 30%;
+	}
+
+	.status {
+		width: 15%;
+	}
+
+	.newsletter {
+		width: 20%;
+	}
+
+	.created-at {
+		width: 17%;
+	}
+
+	.sent-at {
+		width: 18%;
+	}
+</style>
diff --git a/frontend/src/routes/sudo/issues/[id]/+layout.ts b/frontend/src/routes/sudo/issues/[id]/+layout.ts
new file mode 100644
index 00000000..a3d15781
--- /dev/null
+++ b/frontend/src/routes/sudo/issues/[id]/+layout.ts
@@ -0,0 +1 @@
+export const ssr = false;
diff --git a/frontend/src/routes/sudo/issues/[id]/+page.svelte b/frontend/src/routes/sudo/issues/[id]/+page.svelte
new file mode 100644
index 00000000..6da1bb13
--- /dev/null
+++ b/frontend/src/routes/sudo/issues/[id]/+page.svelte
@@ -0,0 +1,148 @@
+<script lang="ts">
+	import {
+		Button,
+		Divider,
+		IconMessage,
+		Loader,
+		SplitControl,
+		Tag,
+		TextInput,
+		toast
+	} from '@hyvor/design/components';
+	import { onMount } from 'svelte';
+	import { page } from '$app/stores';
+	import { getIssue } from '../../lib/actions/issueActions';
+	import type { SudoIssue } from '../../types';
+	import FriendlyDate from '../../../console/@components/utils/FriendlyDate.svelte';
+	import IconArrowLeft from '@hyvor/icons/IconArrowLeft';
+
+	let loading = $state(true);
+	let error: string | null = $state(null);
+	let issue: SudoIssue | null = $state(null);
+
+	const statusColors: Record<string, 'default' | 'blue' | 'orange' | 'green'> = {
+		draft: 'default',
+		scheduled: 'blue',
+		sending: 'orange',
+		sent: 'green'
+	};
+
+	onMount(() => {
+		const id = Number($page.params.id);
+
+		getIssue(id)
+			.then((data) => {
+				issue = data;
+			})
+			.catch((e) => {
+				error = e.message;
+			})
+			.finally(() => {
+				loading = false;
+			});
+	});
+</script>
+
+{#if loading}
+	<Loader full />
+{:else if error}
+	<IconMessage error message={error} />
+{:else if issue}
+	<div class="detail">
+		<div class="header">
+			<Button as="a" href="/sudo/issues" size="small" color="input">
+				{#snippet start()}
+					<IconArrowLeft size={14} />
+				{/snippet}
+				Back
+			</Button>
+			<h2>{issue.subject || 'No subject'}</h2>
+		</div>
+
+		<div class="content">
+			<SplitControl label="ID">
+				<TextInput value={String(issue.id)} disabled block />
+			</SplitControl>
+
+			<SplitControl label="UUID">
+				<TextInput value={issue.uuid} disabled block />
+			</SplitControl>
+
+			<SplitControl label="Subject">
+				<TextInput value={issue.subject ?? '—'} disabled block />
+			</SplitControl>
+
+			<SplitControl label="Status">
+				<Tag size="small" color={statusColors[issue.status] ?? 'default'}>
+					{issue.status}
+				</Tag>
+			</SplitControl>
+
+			<SplitControl label="Newsletter">
+				<Button
+					as="a"
+					href={`/sudo/newsletters/${issue.newsletter_id}`}
+					size="small"
+					color="input"
+				>
+					{issue.newsletter_subdomain}
+				</Button>
+			</SplitControl>
+
+			<Divider margin={20} />
+
+			<SplitControl label="Created at">
+				<FriendlyDate time={issue.created_at} />
+			</SplitControl>
+
+			{#if issue.scheduled_at}
+				<SplitControl label="Scheduled at">
+					<FriendlyDate time={issue.scheduled_at} />
+				</SplitControl>
+			{/if}
+
+			{#if issue.sending_at}
+				<SplitControl label="Sending at">
+					<FriendlyDate time={issue.sending_at} />
+				</SplitControl>
+			{/if}
+
+			{#if issue.sent_at}
+				<SplitControl label="Sent at">
+					<FriendlyDate time={issue.sent_at} />
+				</SplitControl>
+			{/if}
+
+			<Divider margin={20} />
+
+			<SplitControl label="Total sendable">
+				<span>{issue.total_sendable}</span>
+			</SplitControl>
+
+			{#if issue.error_private}
+				<SplitControl label="Error (private)">
+					<TextInput value={issue.error_private} disabled block />
+				</SplitControl>
+			{/if}
+		</div>
+	</div>
+{/if}
+
+<style>
+	.detail {
+		padding: 20px 30px;
+		overflow: auto;
+		flex: 1;
+	}
+
+	.header {
+		display: flex;
+		align-items: center;
+		gap: 15px;
+		margin-bottom: 20px;
+	}
+
+	.header h2 {
+		margin: 0;
+	}
+</style>
diff --git a/frontend/src/routes/sudo/lib/actions/issueActions.ts b/frontend/src/routes/sudo/lib/actions/issueActions.ts
new file mode 100644
index 00000000..d3947407
--- /dev/null
+++ b/frontend/src/routes/sudo/lib/actions/issueActions.ts
@@ -0,0 +1,33 @@
+import { ITEMS_PER_PAGE } from '../generalActions';
+import sudoApi from '../sudoApi';
+import type { IssueStatus, SudoIssue } from '../../types';
+
+export const ISSUE_STATUS_FILTERS: Record<IssueStatus, string> = {
+	draft: 'Draft',
+	scheduled: 'Scheduled',
+	sending: 'Sending',
+	sent: 'Sent'
+};
+
+export function getIssues(
+	subdomain: string | null = null,
+	status: IssueStatus | null = null,
+	limit: number = ITEMS_PER_PAGE,
+	offset: number = 0
+) {
+	return sudoApi.get<SudoIssue[]>({
+		endpoint: 'issues',
+		data: {
+			subdomain,
+			status,
+			limit,
+			offset
+		}
+	});
+}
+
+export function getIssue(id: number) {
+	return sudoApi.get<SudoIssue>({
+		endpoint: `issues/${id}`
+	});
+}
diff --git a/frontend/src/routes/sudo/lib/actions/newsletterActions.ts b/frontend/src/routes/sudo/lib/actions/newsletterActions.ts
new file mode 100644
index 00000000..de195815
--- /dev/null
+++ b/frontend/src/routes/sudo/lib/actions/newsletterActions.ts
@@ -0,0 +1,24 @@
+import { ITEMS_PER_PAGE } from '../generalActions';
+import sudoApi from '../sudoApi';
+import type { NewsletterStats, SudoNewsletter } from '../../types';
+
+export function getNewsletters(
+	name: string | null = null,
+	limit: number = ITEMS_PER_PAGE,
+	offset: number = 0
+) {
+	return sudoApi.get<SudoNewsletter[]>({
+		endpoint: 'newsletters',
+		data: {
+			name,
+			limit,
+			offset
+		}
+	});
+}
+
+export function getNewsletter(id: number) {
+	return sudoApi.get<{ newsletter: SudoNewsletter; stats: NewsletterStats }>({
+		endpoint: `newsletters/${id}`
+	});
+}
diff --git a/frontend/src/routes/sudo/lib/stores/sudoStore.ts b/frontend/src/routes/sudo/lib/stores/sudoStore.ts
index 327324d6..1238375b 100644
--- a/frontend/src/routes/sudo/lib/stores/sudoStore.ts
+++ b/frontend/src/routes/sudo/lib/stores/sudoStore.ts
@@ -1,5 +1,12 @@
 import { writable } from 'svelte/store';
-import type { Approval, SubscriberImport, SudoConfig, SudoStats } from '../../types';
+import type {
+	Approval,
+	SubscriberImport,
+	SudoConfig,
+	SudoIssue,
+	SudoNewsletter,
+	SudoStats
+} from '../../types';
 
 export const configStore = writable<SudoConfig>();
 export const statsStore = writable<SudoStats>({
@@ -8,6 +15,8 @@ export const statsStore = writable<SudoStats>({
 });
 export const approvalStore = writable<Approval[]>([]);
 export const subscriberImportStore = writable<SubscriberImport[]>([]);
+export const newsletterStore = writable<SudoNewsletter[]>([]);
+export const issueStore = writable<SudoIssue[]>([]);
 
 approvalStore.subscribe((approvals) => {
 	statsStore.update((stats) => ({
diff --git a/frontend/src/routes/sudo/newsletters/+page.svelte b/frontend/src/routes/sudo/newsletters/+page.svelte
new file mode 100644
index 00000000..5d5cfac9
--- /dev/null
+++ b/frontend/src/routes/sudo/newsletters/+page.svelte
@@ -0,0 +1,200 @@
+<script lang="ts">
+	import {
+		ActionList,
+		ActionListItem,
+		Button,
+		Dropdown,
+		IconButton,
+		IconMessage,
+		LoadButton,
+		Loader,
+		TextInput,
+		toast
+	} from '@hyvor/design/components';
+	import { onMount } from 'svelte';
+	import { newsletterStore } from '../lib/stores/sudoStore';
+	import NewsletterRow from './NewsletterRow.svelte';
+	import type { SudoNewsletter } from '../types';
+	import IconX from '@hyvor/icons/IconX';
+	import IconCaretDown from '@hyvor/icons/IconCaretDown';
+	import { ITEMS_PER_PAGE } from '../lib/generalActions';
+	import { getNewsletters } from '../lib/actions/newsletterActions';
+	import { goto } from '$app/navigation';
+
+	let loading = $state(true);
+	let hasMore = $state(true);
+	let loadingMore = $state(false);
+	let error: string | null = $state(null);
+
+	let search: string | undefined = $state(undefined);
+	let searchValue: string | undefined = $state(undefined);
+
+	const SORT_OPTIONS: Record<string, string> = {
+		name: 'Name',
+		created_at: 'Created'
+	};
+	type SortKey = keyof typeof SORT_OPTIONS;
+	let sortBy: SortKey = $state('created_at');
+	let sortDropdownShow = $state(false);
+
+	let sortedNewsletters = $derived.by(() => {
+		const items = [...$newsletterStore];
+		items.sort((a, b) => {
+			if (sortBy === 'name') {
+				return a.name.localeCompare(b.name);
+			}
+			return b.created_at - a.created_at;
+		});
+		return items;
+	});
+
+	function load(more = false) {
+		more ? (loadingMore = true) : (loading = true);
+
+		getNewsletters(search ?? null, ITEMS_PER_PAGE, more ? $newsletterStore.length : 0)
+			.then((data) => {
+				if (more) {
+					newsletterStore.update((newsletters) => [...newsletters, ...data]);
+				} else {
+					newsletterStore.set(data);
+				}
+				hasMore = data.length === ITEMS_PER_PAGE;
+			})
+			.catch((e) => {
+				error = e.message;
+			})
+			.finally(() => {
+				loading = false;
+				loadingMore = false;
+			});
+	}
+
+	function handleSelect(newsletter: SudoNewsletter) {
+		goto(`/sudo/newsletters/${newsletter.id}`);
+	}
+
+	function handleSearchKeyup(e: any) {
+		if (e.key === 'Enter') {
+			searchValue = search;
+			load();
+		}
+
+		if (e.key === 'Escape') {
+			handleSearchClear();
+		}
+	}
+
+	function handleSearchClear() {
+		search = undefined;
+		searchValue = undefined;
+		load();
+	}
+
+	onMount(() => {
+		load();
+	});
+</script>
+
+{#if loading}
+	<Loader full />
+{:else if error}
+	<IconMessage error message={error} />
+{:else}
+	<div class="top">
+		<TextInput bind:value={search} on:keyup={handleSearchKeyup} size="small">
+			{#snippet start()}
+				Name
+			{/snippet}
+			{#snippet end()}
+				<div class="search-icons">
+					<span class="enter">
+						{#if search !== searchValue}
+							&nbsp; ⏎
+						{/if}
+					</span>
+					<span class="clear">
+						{#if searchValue}
+							<IconButton size={16} on:click={handleSearchClear}>
+								<IconX size={12} />
+							</IconButton>
+						{/if}
+					</span>
+				</div>
+			{/snippet}
+		</TextInput>
+		<Dropdown bind:show={sortDropdownShow}>
+			{#snippet trigger()}
+				<Button color="input" size="small">
+					{#snippet start()}
+						Sort
+					{/snippet}
+					<div class="dropdown-label">
+						{SORT_OPTIONS[sortBy]}
+					</div>
+					{#snippet end()}
+						<IconCaretDown size={14} />
+					{/snippet}
+				</Button>
+			{/snippet}
+			{#snippet content()}
+				<ActionList>
+					{#each Object.entries(SORT_OPTIONS) as [key, value]}
+						<ActionListItem
+							on:select={() => {
+								sortBy = key;
+								sortDropdownShow = false;
+							}}>{value}</ActionListItem
+						>
+					{/each}
+				</ActionList>
+			{/snippet}
+		</Dropdown>
+	</div>
+
+	{#if $newsletterStore.length === 0}
+		<IconMessage empty message="No newsletters found" />
+	{:else}
+		<div class="list">
+			{#each sortedNewsletters as newsletter (newsletter.id)}
+				<NewsletterRow {newsletter} {handleSelect} />
+			{/each}
+			<LoadButton
+				text="Load More"
+				loading={loadingMore}
+				show={hasMore}
+				on:click={() => load(true)}
+			/>
+		</div>
+	{/if}
+{/if}
+
+<style>
+	.top {
+		padding: 20px 0 0 30px;
+	}
+
+	.list {
+		flex: 1;
+		overflow: auto;
+		padding: 20px 30px;
+	}
+
+	.dropdown-label {
+		font-weight: normal;
+	}
+
+	.search-icons {
+		display: flex;
+		gap: 5px;
+		align-items: center;
+
+		.enter,
+		.clear {
+			width: 20px;
+		}
+
+		.enter {
+			margin-top: 3px;
+		}
+	}
+</style>
diff --git a/frontend/src/routes/sudo/newsletters/NewsletterRow.svelte b/frontend/src/routes/sudo/newsletters/NewsletterRow.svelte
new file mode 100644
index 00000000..f23eb127
--- /dev/null
+++ b/frontend/src/routes/sudo/newsletters/NewsletterRow.svelte
@@ -0,0 +1,58 @@
+<script lang="ts">
+	import type { SudoNewsletter } from '../types';
+	import RelativeTime from '../../console/@components/utils/RelativeTime.svelte';
+
+	interface Props {
+		newsletter: SudoNewsletter;
+		handleSelect: (newsletter: SudoNewsletter) => void;
+	}
+
+	let { newsletter, handleSelect }: Props = $props();
+</script>
+
+<button class="row" onclick={() => handleSelect(newsletter)}>
+	<div class="name">
+		{newsletter.name}
+	</div>
+
+	<div class="subdomain">
+		{newsletter.subdomain}
+	</div>
+
+	<div class="created-at">
+		<RelativeTime unix={newsletter.created_at} />
+	</div>
+</button>
+
+<style>
+	.row {
+		display: flex;
+		justify-content: space-between;
+		align-items: center;
+		padding: 15px;
+		background-color: var(--bg-light);
+		border-radius: var(--box-radius);
+		text-align: left;
+		width: 100%;
+	}
+
+	.row:hover {
+		background: var(--hover);
+	}
+
+	.name {
+		width: 30%;
+	}
+
+	.subdomain {
+		width: 25%;
+	}
+
+	.org {
+		width: 20%;
+	}
+
+	.created-at {
+		width: 25%;
+	}
+</style>
diff --git a/frontend/src/routes/sudo/newsletters/[id]/+layout.ts b/frontend/src/routes/sudo/newsletters/[id]/+layout.ts
new file mode 100644
index 00000000..a3d15781
--- /dev/null
+++ b/frontend/src/routes/sudo/newsletters/[id]/+layout.ts
@@ -0,0 +1 @@
+export const ssr = false;
diff --git a/frontend/src/routes/sudo/newsletters/[id]/+page.svelte b/frontend/src/routes/sudo/newsletters/[id]/+page.svelte
new file mode 100644
index 00000000..ded4fdfc
--- /dev/null
+++ b/frontend/src/routes/sudo/newsletters/[id]/+page.svelte
@@ -0,0 +1,154 @@
+<script lang="ts">
+	import {
+		Button,
+		Divider,
+		IconMessage,
+		Loader,
+		SplitControl,
+		TextInput,
+		toast
+	} from '@hyvor/design/components';
+	import { onMount } from 'svelte';
+	import { page } from '$app/stores';
+	import { getNewsletter } from '../../lib/actions/newsletterActions';
+	import type { NewsletterStats, SudoNewsletter } from '../../types';
+	import FriendlyDate from '../../../console/@components/utils/FriendlyDate.svelte';
+	import IconArrowLeft from '@hyvor/icons/IconArrowLeft';
+
+	let loading = $state(true);
+	let error: string | null = $state(null);
+	let newsletter: SudoNewsletter | null = $state(null);
+	let stats: NewsletterStats | null = $state(null);
+
+	onMount(() => {
+		const id = Number($page.params.id);
+
+		getNewsletter(id)
+			.then((data) => {
+				newsletter = data.newsletter;
+				stats = data.stats;
+			})
+			.catch((e) => {
+				error = e.message;
+			})
+			.finally(() => {
+				loading = false;
+			});
+	});
+</script>
+
+{#if loading}
+	<Loader full />
+{:else if error}
+	<IconMessage error message={error} />
+{:else if newsletter && stats}
+	<div class="detail">
+		<div class="header">
+			<Button as="a" href="/sudo/newsletters" size="small" color="input">
+				{#snippet start()}
+					<IconArrowLeft size={14} />
+				{/snippet}
+				Back
+			</Button>
+			<h2>{newsletter.name}</h2>
+		</div>
+
+		<div class="content">
+			<SplitControl label="ID">
+				<TextInput value={String(newsletter.id)} disabled block />
+			</SplitControl>
+
+			<SplitControl label="Name">
+				<TextInput value={newsletter.name} disabled block />
+			</SplitControl>
+
+			<SplitControl label="Subdomain">
+				<TextInput value={newsletter.subdomain} disabled block />
+			</SplitControl>
+
+			<SplitControl label="User ID">
+				<TextInput value={String(newsletter.user_id)} disabled block />
+			</SplitControl>
+
+			<SplitControl label="Organization ID">
+				<TextInput
+					value={newsletter.organization_id != null
+						? String(newsletter.organization_id)
+						: '—'}
+					disabled
+					block
+				/>
+			</SplitControl>
+
+			<SplitControl label="Language">
+				<TextInput value={newsletter.language_code ?? '—'} disabled block />
+			</SplitControl>
+
+			<SplitControl label="RTL">
+				<TextInput value={newsletter.is_rtl ? 'Yes' : 'No'} disabled block />
+			</SplitControl>
+
+			<SplitControl label="Created at">
+				<FriendlyDate time={newsletter.created_at} />
+			</SplitControl>
+
+			<Divider margin={20} />
+
+			<h3>Stats</h3>
+
+			<SplitControl label="Subscribers">
+				<span
+					>{stats.subscribers.total} total / {stats.subscribers.last_30_days} last 30d</span
+				>
+			</SplitControl>
+
+			<SplitControl label="Issues (sent)">
+				<span>{stats.issues.total} total / {stats.issues.last_30_days} last 30d</span>
+			</SplitControl>
+
+			<SplitControl label="Bounce rate">
+				<span
+					>{stats.bounced_rate.total}% total / {stats.bounced_rate.last_30_days}% last 30d</span
+				>
+			</SplitControl>
+
+			<SplitControl label="Complaint rate">
+				<span
+					>{stats.complained_rate.total}% total / {stats.complained_rate.last_30_days}%
+					last 30d</span
+				>
+			</SplitControl>
+
+			<SplitControl label="Lists">
+				<span>{stats.lists_count}</span>
+			</SplitControl>
+
+			<SplitControl label="Sending profiles">
+				<span>{stats.sending_profiles_count}</span>
+			</SplitControl>
+		</div>
+	</div>
+{/if}
+
+<style>
+	.detail {
+		padding: 20px 30px;
+		overflow: auto;
+		flex: 1;
+	}
+
+	.header {
+		display: flex;
+		align-items: center;
+		gap: 15px;
+		margin-bottom: 20px;
+	}
+
+	.header h2 {
+		margin: 0;
+	}
+
+	.content h3 {
+		margin: 10px 0;
+	}
+</style>
diff --git a/frontend/src/routes/sudo/types.ts b/frontend/src/routes/sudo/types.ts
index 54249bc2..2fea50c4 100644
--- a/frontend/src/routes/sudo/types.ts
+++ b/frontend/src/routes/sudo/types.ts
@@ -56,3 +56,40 @@ export type ImportingSubscriber = {
 	subscribe_ip: string | null;
 	metadata: Record<string, string> | null;
 };
+
+export type SudoNewsletter = {
+	id: number;
+	created_at: number;
+	subdomain: string;
+	name: string;
+	user_id: number;
+	organization_id: number | null;
+	language_code: string | null;
+	is_rtl: boolean;
+};
+
+export type IssueStatus = 'draft' | 'scheduled' | 'sending' | 'sent';
+
+export type SudoIssue = {
+	id: number;
+	created_at: number;
+	uuid: string;
+	subject: string | null;
+	status: IssueStatus;
+	newsletter_subdomain: string;
+	newsletter_id: number;
+	scheduled_at: number | null;
+	sending_at: number | null;
+	sent_at: number | null;
+	total_sendable: number;
+	error_private: string | null;
+};
+
+export type NewsletterStats = {
+	subscribers: { total: number; last_30_days: number };
+	issues: { total: number; last_30_days: number };
+	bounced_rate: { total: number; last_30_days: number };
+	complained_rate: { total: number; last_30_days: number };
+	lists_count: number;
+	sending_profiles_count: number;
+};