Challenge 1 / 1

Following up with my chat message test, I came up with the right stream template to add the new messages to our users chat log.

<turbo-stream action="update" id="new-messages-{{ chat.id }}">
    <template>
        {% for message in chat.newMessages %}
            <div class="message">
                <span class="user">{{ message.from }}</span>:
                {{ message.text }}
            </div>
        {% endfor %}
    </template>
</turbo-stream>

Now, whenever a user submits the form to send a message, I'd like to return an empty form to reset the user's chat and stream the new messages to all chatrooms.

What would the code for this action look like?

public function chatAction(Request $request, HubInterface $mercureHub): Response
{
    $form = $this->createForm(ChatFormType::class);    
    
    $emptyForm = clone $form;
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
        // ...
   
        $mercureHub->publish(new Update(
            'new-messages',
            $this->renderView('_chatForm.html.twig', [ 'form' => $form ]),
        ));

        $form = $emptyForm;
    }

    return $this->render('_newMessages.html.twig', [ 'chat' => $data ]);
}

public function chatAction(Request $request, HubInterface $mercureHub): Response
{
    $form = $this->createForm(ChatFormType::class);
    $emptyForm = clone $form;
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
        // ...
   
        $mercureHub->publish(new Update(
            'new-messages',
            $this->renderView('_newMessages.html.twig', [ 'chat' => $data ]),
        ));

        $form = $emptyForm;
    }

    return $this->renderForm('_chatForm.html.twig', [ 'form' => $form ]);
}

public function chatAction(Request $request, HubInterface $mercureHub): Response
{
    $form = $this->createForm(ChatFormType::class);    
    
    $emptyForm = clone $form;
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
        // ...
   
        $mercureHub->publish(new Update(
            'new-messages',
            $this->render('_newMessages.html.twig', [ 'chat' => $data ]),
        ));

        $form = $emptyForm;
    }

    return $this->renderForm('_chatForm.html.twig');
}

public function chatAction(Request $request, HubInterface $mercureHub): Response
{
    $form = $this->createForm(ChatFormType::class);
    
    $emptyForm = clone $form;
    $form->handleRequest($request);

    if ($form->isSubmitted() && $form->isValid()) {
        // ...

        $form = $emptyForm;

        return $this->renderForm($emptyform, [ 'form' => $form ]);
    }

    return $this->render('_newMessages.html.twig', [ 'chat' => $data ]);
}

Rewatch the video