My notification reply does not updates the UI?

I have a notification show page, inside it i have a form to reply only 1 time.

After a reply to that particular mail my controller return back and my show page props and ui did not gets updated.

my controller code

public function store(AdminReplyRequest $request, Notification $notification)
    {
        // protecting form the sending the request if already 1 reply exists
        if ($notification->reply()->exists()) {
            throw ValidationException::withMessages([
                'reply' => 'A reply already exists for this notification.',
            ]);
        }

        // To rollback the transaction if any point it fails below
        DB::transaction(function () use ($request, $notification) {
            $reply = $notification->reply()->create([
                'user_id' => auth()->id(),
                'to' => $request->to,
                'subject' => $request->subject,
                'message' => $request->body,
            ]);

            // Sending the reply email
            Mail::to($notification->email)
                ->send(new ContactReplyMail($reply));

            // Log activity store
            ActivityService::log('Replied Mail', $reply);
        });

        session()->flash('success', 'Replied mail sent successfully!');

        return redirect()->back();
    }

/**
     * Display the specified resource.
     */
    public function show(Notification $notification)
    {
        // mark the notification as read only if already not readed
        if (! $notification->is_read) {
            $notification->update([
                'is_read' => 1,
                'read_at' => now(),
            ]);
        }

        // store the new event log to the audits table
        ActivityService::log('Read Mail', $notification);

        return Inertia::render('Admin/Notifications/Show', [
            'notification' => new NotificationResource($notification->load('reply')),
            'exists' => $notification->reply()->exists(),
        ]);
    }

my show template vue code

  <!-- Reply message card -->
                <div v-if="notification?.reply" class="bg-secondary rounded-lg shadow border-dashed my-6 pt-5">
                    <h3 class="px-6 flex gap-2 items-center">
                        <Reply /> replied
                    </h3>
                    <div class="flex justify-start gap-3 items-center border-b py-3 px-6 border-gray-600">
                        <div class="overflow-hidden aspect-video w-10 h-10 md:w-16 md:h-16 rounded-lg border p-1">
                            <img alt="user-random"
                                :src="`https://api.dicebear.com/9.x/bottts/svg?seed=${Math.random()}`"
                                class="w-full h-full object-cover" />
                        </div>
                        <div>
                            <h4>
                                Replied to <span class="text-primary">{{ notification.email }}</span>
                                <span class="text-primary capitalize font-semibold">{{ notification?.reply?.name
                                }}</span>
                            </h4>
                            <p>{{ notification?.reply?.created_at }}</p>
                        </div>
                    </div>
                    <div v-if="notification?.reply?.subject" class="border-b py-3 px-6 border-gray-600">
                        <h3>Mail Subject</h3>
                        <p>{{ notification?.reply?.subject }}</p>
                    </div>
                    <div class="py-3 px-6" v-html="notification?.reply?.message">

                    </div>
                </div>

                <!-- reply form -->
                <section v-if="!replyExists" class="my-8 bg-secondary py-3 rounded-lg shadow">
                    <h3 class="mb-3 px-4 flex items-center gap-3">
                        <Reply /> Replying to
                        <span class="text-primary font-semibold">{{
                            notification.email
                        }}</span>
                    </h3>

                    <form @submit.prevent="mailReply" class="rounded-lg shadow bg-secondary">
                        <div class="border-b border-gray-600">
                            <div class="flex gap-14 p-5">
                                <h2>To</h2>
                                <input readonly="" :value="notification.email" class="w-full border-0 ring-0"
                                    placeholder="Enter user name for multiple use commas" />
                            </div>
                            <ErrorMessage :error="form.errors?.to" />
                        </div>
                        <div class="border-b p-5 border-gray-600">
                            <div class="flex gap-4 border-gray-600">
                                <h2>Subject</h2>
                                <input v-model="form.subject" class="w-full border-0 ring-0"
                                    placeholder="Mail Subject here..." />
                            </div>
                            <ErrorMessage :error="form.errors?.subject" />
                        </div>
                        <!-- rich editor -->
                        <div class="p-4">
                            <label for="body" class="mb-3 font-semibold text-white">Body</label>
                            <RichEditor v-model="form.body" />
                            <ErrorMessage :error="form.errors?.body" />
                        </div>

                        <div class="my-5 p-4 flex justify-between md:justify-end gap-6 items-center">
                            <Link href="" class="px-3 py-2 rounded-lg text-black bg-white">Discard</Link>
                            <button class="flex gap-2 items-center bg-primary px-3 py-2 rounded-lg text-black bg-white">
                                Send Reply
                                <SendHorizonal class="w-4 h-4 md:w-6 md:h-6" />
                            </button>
                        </div>
                    </form>
                </section>

my show notification setup code

const page = usePage();
// const notification = page.props.notification.data;
// const replyExists = page.props.exists;
const notification = computed(() => page.props.notification.data);
const replyExists = computed(() => page.props.exists);


const form = useForm({
    to: notification?.email,
    subject: notification?.subject,
    body: "",
});

// function to reply a particular mail
function mailReply() {
    form.post(route("notifications.reply", notification.value.id), {
        preserveScroll: true,
        only: ['notification', 'exists', 'flash'],
    });
}