diff --git a/README.md b/README.md
index a9c56c2..d190cbd 100644
--- a/README.md
+++ b/README.md
@@ -20,6 +20,7 @@ It runs without installation on multiple platforms via docker and supports [symf
    - [Monolog server](#4-monolog-server)
    - [Inspector](#5-compatible-with-inspector-reports)
    - [Spatie Ray debug tool](#6-spatie-ray-debug-tool)
+   - [HTTP Requests dump server](#7-http-requests-dump-server)
 2. [Installation](#installation)
    - [Docker image](#docker-image)
 3. [Configuration](#configuration)
@@ -213,6 +214,9 @@ Json, Xml, Carbon, File, Table, Image, Html, Text, Notifications, Phpinfo, Excep
 Show jobs, Show cache, Model, Show views, Markdown, Collections, Env, Response, Request, Ban, Charles, Remove, Hide/Show events,
 Application log, Show Http client requests, Mailable
 
+## 7. HTTP Requests dump server
+Buggregator can receive HTTP requests and store them for inspection.
+
 ### Laravel settings
 
 Please make sure `ray.php` config published to the project root.
diff --git a/app/Application/Listeners/Request/SendRequestDebugToConsole.php b/app/Application/Listeners/Request/SendRequestDebugToConsole.php
index 606ea6a..a54eab7 100644
--- a/app/Application/Listeners/Request/SendRequestDebugToConsole.php
+++ b/app/Application/Listeners/Request/SendRequestDebugToConsole.php
@@ -33,6 +33,7 @@ public function handle($event): void
                             'POST' => 'blue',
                             'PUT' => 'yellow',
                             'DELETE' => 'red',
+                            'HEAD' => 'white',
                         },
                         'responseColor' => match (true) {
                             $statusCode >= 500 => 'red',
diff --git a/app/Modules/Events/Application/Resources/EventResource.php b/app/Modules/Events/Application/Resources/EventResource.php
index b9a122e..736267a 100644
--- a/app/Modules/Events/Application/Resources/EventResource.php
+++ b/app/Modules/Events/Application/Resources/EventResource.php
@@ -8,6 +8,8 @@
 
 class EventResource extends JsonResource
 {
+    public bool $preserveKeys = true;
+
     public function toArray($request)
     {
         return [
diff --git a/app/Modules/HttpDump/Interfaces/Http/Controllers/StoreEventAction.php b/app/Modules/HttpDump/Interfaces/Http/Controllers/StoreEventAction.php
new file mode 100644
index 0000000..47ba5c6
--- /dev/null
+++ b/app/Modules/HttpDump/Interfaces/Http/Controllers/StoreEventAction.php
@@ -0,0 +1,82 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Modules\HttpDump\Interfaces\Http\Controllers;
+
+use App\Commands\FindProjectByName;
+use App\Commands\HandleReceivedEvent;
+use App\Contracts\Command\CommandBus;
+use App\Contracts\Query\QueryBus;
+use Illuminate\Http\Request;
+use Illuminate\Support\Arr;
+use Interfaces\Http\Controllers\Controller;
+use Spatie\RouteAttributes\Attributes\Any;
+use Spatie\RouteAttributes\Attributes\Where;
+use Symfony\Bridge\PsrHttpMessage\Factory\UploadedFile;
+use Symfony\Component\Console\Output\ConsoleOutput;
+
+class StoreEventAction extends Controller
+{
+    #[Any(uri: 'httpdump/store/{extraData?}', name: 'httpdump.event.store')]
+    #[Where('extraData', '(.*)')]
+    public function __invoke(
+        Request $request,
+        CommandBus $commands,
+        QueryBus $queryBus,
+        ConsoleOutput $output,
+    ): void {
+        $project = $queryBus->ask(new FindProjectByName('default'));
+        $projectId = $project->getId();
+
+        $data = $this->prepareRequest($request);
+        $commands->dispatch(
+            new HandleReceivedEvent(
+                (int) $projectId,
+                'httpdump',
+                $data,
+                true
+            )
+        );
+    }
+
+    private function prepareRequest(Request $request)
+    {
+        return [
+            'received_at' => now()->toDateTimeString(),
+            'request' => [
+                'method' => $request->getMethod(),
+                'uri' => $request->getRequestUri(),
+                'headers' => $request->headers->all(),
+                'body' => $request->getContent(),
+                'query' => $request->query->all(),
+                'post' => $this->getPostData($request),
+            ],
+        ];
+    }
+
+    private function getPostData(Request $request): array
+    {
+        $contentType = current(Arr::get($request->headers->all(), 'content-type', [])) ?: 'no content type';
+
+        if ($contentType === 'application/x-www-form-urlencoded') {
+            return $request->request->all();
+        }
+
+        if ($contentType === 'application/json') {
+            return json_decode($request->getContent(), true);
+        }
+
+        if (str_starts_with($contentType, 'multipart/form-data') && $request->allFiles() !== []) {
+            return array_map(function (UploadedFile $file) {
+                return [
+                    'originalName' => $file->getClientOriginalName(),
+                    'mime' => $file->getClientMimeType(),
+                    'size' => $file->getSize(),
+                ];
+            }, collect($request->files->all())->flatten()->toArray());
+        }
+
+        return [];
+    }
+}
diff --git a/app/Modules/HttpDump/ServiceProvider.php b/app/Modules/HttpDump/ServiceProvider.php
new file mode 100644
index 0000000..03ee1a4
--- /dev/null
+++ b/app/Modules/HttpDump/ServiceProvider.php
@@ -0,0 +1,22 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Modules\HttpDump;
+
+use Modules\HttpDump\Contracts\EventHandler as EventHandlerContract;
+
+final class ServiceProvider extends \Illuminate\Support\ServiceProvider
+{
+    public function register()
+    {
+        $this->app->bind(EventHandlerContract::class, function () {
+            return new EventHandler($this->app, []);
+        });
+    }
+
+    public function boot()
+    {
+        $this->loadViewsFrom(__DIR__.'/resources/views', 'httpdump');
+    }
+}
diff --git a/config/app.php b/config/app.php
index a857b97..84c9bed 100644
--- a/config/app.php
+++ b/config/app.php
@@ -193,6 +193,7 @@
         Modules\Ray\ServiceProvider::class,
         Modules\Sentry\ServiceProvider::class,
         Modules\User\ServiceProvider::class,
+        Modules\HttpDump\ServiceProvider::class,
 
         /*
          * Application Service Providers...
diff --git a/config/server.php b/config/server.php
index 88eed2d..e5d8eba 100644
--- a/config/server.php
+++ b/config/server.php
@@ -26,6 +26,12 @@
             ],
         ],
     ],
+    'httpdump' => [
+        'http' => [
+            'index' => 'HttpDump/Index',
+            'show' => 'HttpDump/Show',
+        ],
+    ],
     'sentry' => [
         'http' => [
             'index' => 'Sentry/Index',
diff --git a/resources/js/Components/HttpDump/Event.vue b/resources/js/Components/HttpDump/Event.vue
new file mode 100644
index 0000000..724d407
--- /dev/null
+++ b/resources/js/Components/HttpDump/Event.vue
@@ -0,0 +1,22 @@
+<template>
+    <!-- Используется на первой вкладке со всеми событиями -->
+    <Event :event="event" class="event--httpdump">
+        <Link as="div" :href="event.route.show" class="link flex-grow">
+            <p>{{ event.event.request.method }} {{ event.event.request.uri }}</p>
+        </Link>
+    </Event>
+</template>
+
+<script>
+import Event from "../Event";
+import {Link} from '@inertiajs/inertia-vue3'
+
+export default {
+    components: {
+        Link, Event
+    },
+    props: {
+        event: Object
+    }
+}
+</script>
diff --git a/resources/js/Components/HttpDump/List/Item.vue b/resources/js/Components/HttpDump/List/Item.vue
new file mode 100644
index 0000000..fbc218d
--- /dev/null
+++ b/resources/js/Components/HttpDump/List/Item.vue
@@ -0,0 +1,19 @@
+<template>
+    <div class="relative">
+        <Link as="div" :href="event.route.show" class="link flex-grow">
+            <p>{{ event.event.request.method }} {{ event.event.request.uri }}</p>
+            <span class="text-xs"> {{ event.date }}</span>
+        </Link>
+    </div>
+</template>
+
+<script>
+import {Link} from '@inertiajs/inertia-vue3'
+
+export default {
+    components: { Link },
+    props: {
+        event: Object
+    }
+}
+</script>
diff --git a/resources/js/Components/HttpDump/Show/Headers.vue b/resources/js/Components/HttpDump/Show/Headers.vue
new file mode 100644
index 0000000..19b0e10
--- /dev/null
+++ b/resources/js/Components/HttpDump/Show/Headers.vue
@@ -0,0 +1,24 @@
+<template>
+    <section class="py-5 px-4 md:px-6 lg:px-8 border-b">
+        <h1 class="mb-1 text-lg bold">Headers</h1>
+        <Table>
+            <TableRow :title="title" v-for="(value, title) in event.request.headers">
+                {{ value[0] || value}}
+            </TableRow>
+        </Table>
+    </section>
+</template>
+
+<script>
+import Table from "@/Components/UI/Table";
+import TableRow from "@/Components/UI/TableRow";
+
+export default {
+    components: {
+        Table, TableRow
+    },
+    props: {
+        event: Object
+    }
+}
+</script>
diff --git a/resources/js/Components/HttpDump/Show/PostData.vue b/resources/js/Components/HttpDump/Show/PostData.vue
new file mode 100644
index 0000000..9227590
--- /dev/null
+++ b/resources/js/Components/HttpDump/Show/PostData.vue
@@ -0,0 +1,24 @@
+<template>
+    <section class="py-5 px-4 md:px-6 lg:px-8 border-b">
+        <h1 class="mb-1 text-lg bold">POST Data</h1>
+        <Table>
+            <TableRow :title="title" v-for="(value, title) in event.request.post">
+                {{ value }}
+            </TableRow>
+        </Table>
+    </section>
+</template>
+
+<script>
+import Table from "@/Components/UI/Table";
+import TableRow from "@/Components/UI/TableRow";
+
+export default {
+    components: {
+        Table, TableRow
+    },
+    props: {
+        event: Object
+    }
+}
+</script>
diff --git a/resources/js/Components/HttpDump/Show/QueryParameters.vue b/resources/js/Components/HttpDump/Show/QueryParameters.vue
new file mode 100644
index 0000000..5a687a3
--- /dev/null
+++ b/resources/js/Components/HttpDump/Show/QueryParameters.vue
@@ -0,0 +1,24 @@
+<template>
+    <section class="py-5 px-4 md:px-6 lg:px-8 border-b">
+        <h1 class="mb-1 text-lg bold">Query Parameters</h1>
+        <Table>
+            <TableRow :title="title" v-for="(value, title) in event.request.query">
+                {{ value }}
+            </TableRow>
+        </Table>
+    </section>
+</template>
+
+<script>
+import Table from "@/Components/UI/Table";
+import TableRow from "@/Components/UI/TableRow";
+
+export default {
+    components: {
+        Table, TableRow
+    },
+    props: {
+        event: Object
+    }
+}
+</script>
diff --git a/resources/js/Components/HttpDump/Show/RequestBody.vue b/resources/js/Components/HttpDump/Show/RequestBody.vue
new file mode 100644
index 0000000..6b9e7a7
--- /dev/null
+++ b/resources/js/Components/HttpDump/Show/RequestBody.vue
@@ -0,0 +1,21 @@
+<template>
+    <section class="py-5 px-4 md:px-6 lg:px-8 border-b">
+        <h1 class="mb-1 text-lg bold">Request Body</h1>
+        <p>
+<code>
+        {{ event.request.body }}
+            </code>
+        </p>
+    </section>
+</template>
+
+<script>
+
+export default {
+    components: {
+    },
+    props: {
+        event: Object
+    }
+}
+</script>
diff --git a/resources/js/Components/Layout/Sidebar/Left.vue b/resources/js/Components/Layout/Sidebar/Left.vue
index be04ad6..da4d4e6 100644
--- a/resources/js/Components/Layout/Sidebar/Left.vue
+++ b/resources/js/Components/Layout/Sidebar/Left.vue
@@ -60,6 +60,13 @@ export default {
                     icon: '<svg class="fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill-rule="evenodd" clip-rule="evenodd" d="M19 3H5a3 3 0 0 0-3 3v12a3 3 0 0 0 3 3h14a3 3 0 0 0 3-3V6a3 3 0 0 0-3-3ZM5 1a5 5 0 0 0-5 5v12a5 5 0 0 0 5 5h14a5 5 0 0 0 5-5V6a5 5 0 0 0-5-5H5Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M7 12c0-.6.4-1 1-1h10a1 1 0 1 1 0 2H8a1 1 0 0 1-1-1Z" /><path fill-rule="evenodd" clip-rule="evenodd" d="M5 8c0-.6.4-1 1-1h10a1 1 0 1 1 0 2H6a1 1 0 0 1-1-1ZM5 16c0-.6.4-1 1-1h10a1 1 0 1 1 0 2H6a1 1 0 0 1-1-1Z"/></svg>',
                     supIcon: computed(() => this.unReadEvents.filter(i => i === 'inspector').length > 0),
                 },
+                {
+                    href: route('events.type', 'httpdump'),
+                    title: 'HTTP Dump',
+                    state: (url) => this.$page.url.startsWith(url),
+                    icon: '<svg viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M14.8284 12L16.2426 13.4142L19.071 10.5858C20.6331 9.02365 20.6331 6.49099 19.071 4.9289C17.509 3.3668 14.9763 3.3668 13.4142 4.9289L10.5858 7.75732L12 9.17154L14.8284 6.34311C15.6095 5.56206 16.8758 5.56206 17.6568 6.34311C18.4379 7.12416 18.4379 8.39049 17.6568 9.17154L14.8284 12Z" fill="currentColor" /><path d="M12 14.8285L13.4142 16.2427L10.5858 19.0711C9.02372 20.6332 6.49106 20.6332 4.92896 19.0711C3.36686 17.509 3.36686 14.9764 4.92896 13.4143L7.75739 10.5858L9.1716 12L6.34317 14.8285C5.56212 15.6095 5.56212 16.8758 6.34317 17.6569C7.12422 18.4379 8.39055 18.4379 9.1716 17.6569L12 14.8285Z" fill="currentColor"/><path d="M14.8285 10.5857C15.219 10.1952 15.219 9.56199 14.8285 9.17147C14.4379 8.78094 13.8048 8.78094 13.4142 9.17147L9.1716 13.4141C8.78107 13.8046 8.78107 14.4378 9.1716 14.8283C9.56212 15.2188 10.1953 15.2188 10.5858 14.8283L14.8285 10.5857Z" fill="currentColor"/></svg>',
+                    supIcon: computed(() => this.unReadEvents.filter(i => i === 'httpdump').length > 0),
+                },
                 // {
                 //     href: route('performance'),
                 //     title: 'Performance',
diff --git a/resources/js/EventFactory.js b/resources/js/EventFactory.js
index bf7d0c4..e728b98 100644
--- a/resources/js/EventFactory.js
+++ b/resources/js/EventFactory.js
@@ -6,6 +6,7 @@ import SmtpEvent from "./Smtp/event";
 import VarDumpEvent from "./VarDump/event";
 import InspectorEvent from "./Inspector/event";
 import SentryTransactionEvent from "./SentryTransaction/event";
+import HttpDumpEvent from "./HttpDump/event";
 import {store} from "./store";
 
 const eventTypes = {
@@ -21,7 +22,8 @@ const eventTypes = {
     smtp: json => new SmtpEvent(json.payload, json.uuid, json.timestamp),
     inspector: json => new InspectorEvent(json.payload, json.uuid, json.timestamp),
     sentrytransaction: json => new SentryTransactionEvent(json.payload, json.uuid, json.timestamp, json.projectId, json.transactionId),
-    'var-dump': json => new VarDumpEvent(json.payload, json.uuid, json.timestamp)
+    'var-dump': json => new VarDumpEvent(json.payload, json.uuid, json.timestamp),
+    httpdump: json => new HttpDumpEvent(json.payload, json.uuid, json.timestamp)
 }
 
 export default {
@@ -48,6 +50,8 @@ export default {
                 store.commit('sentryTransaction/pushEvent', event)
             } else if (event instanceof InspectorEvent) {
                 store.commit('inspector/pushEvent', event)
+            } else if (event instanceof HttpDumpEvent) {
+                store.commit('httpdump/pushEvent', event)
             }
             store.commit('pushUnreadEvent', event.app)
             store.commit('pushEvent', event)
@@ -66,6 +70,9 @@ export default {
             if (e.payload.type === 'inspector') {
                 store.commit('inspector/clearEvents')
             }
+            if (e.payload.type === 'httpdump') {
+                store.commit('httpdump/clearEvents')
+            }
 
             store.commit('clearEvents', e.payload.type)
         })
diff --git a/resources/js/HttpDump/event.js b/resources/js/HttpDump/event.js
new file mode 100644
index 0000000..30de49c
--- /dev/null
+++ b/resources/js/HttpDump/event.js
@@ -0,0 +1,15 @@
+import {Event} from "@/Event"
+
+export default class extends Event{
+    labels = []
+    app = 'httpdump'
+
+    constructor(event, id, timestamp) {
+        super(event, id, timestamp)
+        this.labels.push(this.event.request.method)
+    }
+
+    get type() {
+        return 'httpdump'
+    }
+}
diff --git a/resources/js/Pages/Events.vue b/resources/js/Pages/Events.vue
index 50aef17..fc1829b 100644
--- a/resources/js/Pages/Events.vue
+++ b/resources/js/Pages/Events.vue
@@ -45,6 +45,7 @@ import VarDumpComponent from "@/Components/VarDump/Event"
 import MonologComponent from "@/Components/Monolog/Event"
 import InspectorComponent from "@/Components/Inspector/Event"
 import SentryTransactionComponent from "@/Components/SentryTransaction/Event"
+import HttpDumpComponent from "@/Components/HttpDump/Event"
 
 import RayEvent from "@/Ray/event"
 import SentryEvent from "@/Sentry/event"
@@ -54,6 +55,7 @@ import SmtpEvent from "@/Smtp/event"
 import VarDumpEvent from "@/VarDump/event"
 import MonologEvent from "@/Monolog/event"
 import InspectorEvent from "@/Inspector/event"
+import HttpDumpEvent from "@/HttpDump/event"
 import EventFactory from "@/EventFactory"
 
 export default {
@@ -65,7 +67,7 @@ export default {
         Screens, Head, Link,
         RayEventComponent, SentryEventComponent, SlackEventComponent,
         SmtpEventComponent, VarDumpComponent, MonologComponent, InspectorComponent,
-        SentryTransactionComponent,
+        SentryTransactionComponent, HttpDumpComponent
     },
 
     computed: {
@@ -92,6 +94,8 @@ export default {
                 return 'InspectorComponent'
             } else if (event instanceof SentryTransactionEvent) {
                 return 'SentryTransactionComponent'
+            } else if (event instanceof HttpDumpEvent) {
+                return 'HttpDumpComponent'
             }
 
             return 'RayEventComponent'
diff --git a/resources/js/Pages/HttpDump/Index.vue b/resources/js/Pages/HttpDump/Index.vue
new file mode 100644
index 0000000..d8812c7
--- /dev/null
+++ b/resources/js/Pages/HttpDump/Index.vue
@@ -0,0 +1,63 @@
+<template>
+    <MainLayout title="HttpDump">
+        <div ref="header" class="breadcrumbs">
+            <div class="text-muted">Http requests</div>
+        </div>
+        <main class="m-3">
+            <div class="flex justify-between">
+                <h1 class="text-2xl font-bold mb-3">Captured requests</h1>
+                <div v-if="events.length > 0" class="my-3">
+                    <button @click="clearEvents" class="text-sm bg-red-600 py-1 px-3 text-white">Clear events</button>
+                </div>
+            </div>
+            <div class="mx-3 border-2 divide-y dark:divide-gray-400 dark:border-gray-400" v-if="events.length > 0">
+                <ListItem v-for="event in events" :event="event" class="px-5 py-3 hover:bg-gray-50 dark:hover:bg-gray-800"/>
+            </div>
+            <div v-else class="h-full flex flex-col items-center justify-center my-10">
+                <svg class="w-1/3 max-w-xs mb-5 fill-current text-blue-400 dark:text-blue-100" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 41 40"><path   d="m35.6 14.6 5.2-5.2.2-.6c0-.3-.2-.5-.4-.6L26.6.1a.7.7 0 0 0-.9.1l-5.2 5.2L15.3.2a.7.7 0 0 0-.9-.1L.4 8.2c-.2.1-.4.3-.4.6 0 .2 0 .4.2.6l5.2 5.2-5.2 5.2-.2.6c0 .2.2.4.4.6l5.3 3v6.8c0 .3.2.5.4.6l14 8.2h.8l14-8.2c.2 0 .4-.3.4-.6v-6.7l5.3-3.1c.2-.2.4-.4.4-.6 0-.2 0-.4-.2-.6l-5.2-5.2Zm-2.6-.1-12.5 7.2L8 14.5 17.4 9l3.1-1.9 11.4 6.6 1.1.7Zm-6.7-13L39 9l-4.6 4.7-.8-.5-11.9-6.9 4.6-4.6Zm-11.6 0 4.6 4.7-12.7 7.4-4.7-4.7 12.8-7.3Zm-8.1 14 12.7 7.3-4.7 4.6-7.8-4.5L2 20l4.7-4.7Zm.6 9.3 7.2 4.2h.4l.5-.1 4.5-4.5v13.1L7.2 30.3v-5.5Zm26.6 5.5-12.6 7.2V24.4l4.5 4.5.5.2.4-.1 7.2-4.2v5.5Zm-7.5-2.9-4.6-4.6 12.7-7.4 4.6 4.7-12.7 7.3Z"/></svg>
+                <h3 class="font-semibold text-muted text-2xl mt-2">No HTTP requests</h3>
+                <span>Send something to <a href="{{ collectorLink }}">{{ collectorLink }}</a>!</span>
+            </div>
+        </main>
+    </MainLayout>
+</template>
+
+<script>
+import {useStore} from "vuex";
+import {computed} from "vue";
+import MainLayout from "@/Components/Layout/Main"
+import EventFactory from "@/EventFactory";
+import ListItem from "@/Components/HttpDump/List/Item";
+
+export default {
+    components: {
+        MainLayout, ListItem
+    },
+    setup() {
+        const store = useStore();
+        const events = computed(() => store.state.httpdump.events)
+        return {
+            events, store
+        }
+    },
+    mounted() {
+        this.loadEvents()
+    },
+    methods: {
+        clearEvents() {
+            this.store.dispatch('clearEvents', 'httpdump')
+        },
+        loadEvents() {
+            this.store.commit('httpdump/clearEvents')
+            this.$page.props.events.data.forEach((e) => {
+                this.store.commit('httpdump/pushEvent', EventFactory.create(e))
+            })
+        }
+    },
+    computed: {
+        collectorLink() {
+            return route("events") + '/httpdump/store'
+        }
+    }
+}
+</script>
diff --git a/resources/js/Pages/HttpDump/Show.vue b/resources/js/Pages/HttpDump/Show.vue
new file mode 100644
index 0000000..74640b7
--- /dev/null
+++ b/resources/js/Pages/HttpDump/Show.vue
@@ -0,0 +1,73 @@
+<template>
+    <MainLayout title="HttpDump">
+        <nav ref="header" class="breadcrumbs">
+            <Link class="text-muted" :href="event.route.index">Http requests</Link>
+            <div class="h-1 w-1">
+                <svg class="fill-current" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 330 330"><path d="M251 154 101 4a15 15 0 1 0-22 22l140 139L79 304a15 15 0 0 0 22 22l150-150a15 15 0 0 0 0-22z"/></svg>
+            </div>
+            <span>{{ event.id }}</span>
+        </nav>
+        <main class="flex flex-col flex-grow">
+            <header class="bg-gray-50 dark:bg-gray-900 py-5 px-4 md:px-6 lg:px-8 border-b">
+                <div class="flex justify-between items-center">
+                    {{ httpEvent.request.method }} {{ decodedUri }}
+                </div>
+            </header>
+            <PostData :event="httpEvent" v-if="hasPost"/>
+            <QueryParameters :event="httpEvent"/>
+            <Headers :event="httpEvent"/>
+            <RequestBody :event="httpEvent" v-if="hasBody"/>
+        </main>
+    </MainLayout>
+</template>
+
+<script>
+import MainLayout from "@/Components/Layout/Main"
+import {useStore} from "vuex";
+import {computed} from "vue";
+import {Link} from '@inertiajs/inertia-vue3'
+import EventFactory from "@/EventFactory";
+import QueryParameters from "@/Components/HttpDump/Show/QueryParameters";
+import Headers from "@/Components/HttpDump/Show/Headers";
+import RequestBody from "@/Components/HttpDump/Show/RequestBody";
+import PostData from "@/Components/HttpDump/Show/PostData";
+
+
+export default {
+    components: {
+        PostData,
+        MainLayout, QueryParameters, Headers, RequestBody, Link
+    },
+    setup() {
+        const store = useStore();
+        const events = computed(() => store.state.httpdump.events)
+        const event = computed(() => store.state.httpdump.event)
+        const httpEvent = computed(() => store.state.httpdump.event.event)
+
+        return {
+            events, event, httpEvent, store
+        }
+    },
+    mounted() {
+        this.loadEvents()
+    },
+    methods: {
+        loadEvents() {
+            this.store.commit('httpdump/clearEvents')
+            this.store.commit('httpdump/pushEvent', EventFactory.create(this.$page.props.event.data))
+            this.store.commit('httpdump/openEvent', EventFactory.create(this.$page.props.event.data))
+        }
+    },
+    computed: {
+        decodedUri() {
+            return decodeURIComponent(this.event.event.request.uri)
+        },
+        hasPost() {
+            return Object.keys(this.event.event.request.post).length > 0
+        },
+        hasBody() {
+            return this.httpEvent.request.body.length > 0 && this.httpEvent.request.body !== '{}'
+        }
+    }
+}
+</script>
diff --git a/resources/js/store.js b/resources/js/store.js
index a2bf609..487600a 100644
--- a/resources/js/store.js
+++ b/resources/js/store.js
@@ -79,7 +79,36 @@ const smtp = {
             if (state.events.find(e => event.uuid == e.uuid)) {
                 return
             }
-            
+
+            state.events.unshift(event)
+        },
+        openEvent(state, event) {
+            state.event = event
+        },
+        deleteEvent(state, event) {
+            state.events = state.events.filter(e => event.uuid == e.uuid)
+        },
+        closeEvent(state) {
+            state.event = null
+        }
+    }
+}
+
+const httpdump = {
+    namespaced: true,
+    state: () => ({
+        events: [],
+        event: null
+    }),
+    mutations: {
+        clearEvents(state) {
+            state.events = []
+        },
+        pushEvent(state, event) {
+            if (state.events.find(e => event.uuid == e.uuid)) {
+                return
+            }
+
             state.events.unshift(event)
         },
         openEvent(state, event) {
@@ -182,7 +211,7 @@ const inspector = {
 
 export const store = createStore({
     modules: {
-        ws, smtp, sentry, sentryTransaction, terminal, inspector, theme
+        ws, smtp, sentry, sentryTransaction, terminal, inspector, theme, httpdump
     },
 
     state() {
diff --git a/tests/Feature/Http/HttpDumpControllerTest.php b/tests/Feature/Http/HttpDumpControllerTest.php
new file mode 100644
index 0000000..90cdf72
--- /dev/null
+++ b/tests/Feature/Http/HttpDumpControllerTest.php
@@ -0,0 +1,26 @@
+<?php
+
+declare(strict_types=1);
+
+namespace Tests\Feature\Http;
+
+use Modules\Events\Domain\Event;
+use Tests\DatabaseTestCase;
+
+class HttpDumpControllerTest extends DatabaseTestCase
+{
+    public function testFormUrlEncodedEventShouldBeStored()
+    {
+        $value = microtime(true);
+        $this->call('POST', route('httpdump.event.store', 1), content: ['now' => $value]);
+
+        /** @var \Modules\Events\Domain\Event $event */
+        $event = $this->getRepositoryFor(Event::class)->findAll()->first();
+
+        $this->assertSame('httpdump', $event->getType());
+        $this->assertSame(['now' => $value], $event->getPayload()->toArray()['request']['body']);
+        $this->assertSame('POST', $event->getPayload()->toArray()['request']['method']);
+
+        return $event;
+    }
+}