How can I reload a tab data in view using Intertia.js + React + Laravel?

I am having a view

/events/{id}

in this view I have several tabs with forms in it, which I can create, delete and etc; now I am having problem after I create a record inside one of those tabs, in the controller I use

back()-> with and I return data but the list isn't updated in the tab I have the refresh the page

export default function EventPage({ id: eventId, events: initialEvents, event: initialEvent }) {
    const [activeTab, setActiveTab] = useState("overview");
    const [event, setEvent] = useState(initialEvent || null);
    const [loading, setLoading] = useState(!initialEvents && !initialEvent);
    const [error, setError] = useState(null);
    const [isFormDialogOpen, setIsFormDialogOpen] = useState(false);
    const [isCopied, setIsCopied] = useState(false);
    const [events, setEvents] = useState(initialEvents || []);
    const [showEventsList, setShowEventsList] = useState(!eventId);

    const { data, setData, post, processing, errors, reset } = useForm({
        title: "",
        description: "",
        start_date: "",
        end_date: "",
        location: "",
        venue: "",
        max_attendees: "",
        banner_image: null,
    });

    const tabs = [
        { id: "overview", label: "Overview" },
        { id: "sales", label: "Sales" },
        { id: "attendees", label: "Attendees" },
        { id: "tickets", label: "Tickets" },
        { id: "verification", label: "Verification" },
        { id: "sponsors", label: "Sponsors" },
        { id: "settings", label: "Settings" },
        { id: "preview", label: "Preview", url: "demoeventpage" },
    ];

Something like this

function TicketsTab({ event, tickets: initialTickets = [] }) {
    const [isDialogOpen, setIsDialogOpen] = useState(false);
    const [isFormDialogOpen, setIsFormDialogOpen] = useState(false);
    const [error, setError] = useState(null);
    const [editingTicketId, setEditingTicketId] = useState(null);

    // Get the event ID from props
    const eventId = event?.id;

    const { data, setData, processing, errors, reset } = useForm({
        name: "",
        description: "",
        price: 0,
        quantity: null,
        start_sale_date: "",
        end_sale_date: "",
        is_active: true,
        max_per_order: 10,
    });

    // Handle form input changes
    const handleInputChange = (e) => {
        const { name, value, type, checked } = e.target;
        setData(name, type === "checkbox" ? checked : value);
    };

    // Handle form submission
    const handleSubmit = (e) => {
        e.preventDefault();

        if (editingTicketId) {
            // Update existing ticket
            router.put(route('dashboard.events.tickets.update', { eventId, ticketId: editingTicketId }), data, {
                preserveScroll: true,
                onSuccess: () => {
                    // Close dialog and reset form
                    setIsFormDialogOpen(false);
                    resetForm();
                },
                onError: (errors) => {
                    console.error("Error updating ticket:", errors);
                    setError("Failed to update ticket. Please try again.");
                }
            });
        } else {
            // Create new ticket
            router.post(route('dashboard.events.tickets.store', { eventId }), data, {
                preserveScroll: true,
                onSuccess: () => {
                    // Close dialog and reset form
                    setIsFormDialogOpen(false);
                    resetForm();
                },
                onError: (errors) => {
                    console.error("Error creating ticket:", errors);
                    setError("Failed to create ticket. Please try again.");
                }
            });
        }
    };

    // Handle ticket deletion
    const handleDeleteTicket = (ticketId) => {
        if (window.confirm("Are you sure you want to delete this ticket?")) {
            router.delete(route('dashboard.events.tickets.destroy', { eventId, ticketId }), {
                preserveScroll: true,
                onError: (errors) => {
                    console.error("Error deleting ticket:", errors);
                    setError("Failed to delete ticket. Please try again.");
                }
            });
        }
    };

Is there a way to do this similar to LiveWire or reload data in place?