Flash messages through cookies

I’m asking this in advance before I attempt this tomorrow

Has anyone implemented “flash messages” (a.k.a. notifications) though cookies?

Like, imagine a user registration form: after you click “Register” and it’s a success, you set a message in a cookie and redirect to the index page. In the index page, there’s a conditional region that shows the message in the cookie ("Account registered, you can now login ") if present.

Has anyone done this? I never dabbled with cookies before, if someone has pointers I appreciate them

P.S: This last sentence was confusing to write in proper English. If the grammar is incorrect, please do tell me!

This should help:

1 Like

In this use case wouldn’t a browser session be more suitable?

Hey,

Thanks for the tip.

I’m having trouble doing this with a session variable:

Session:

<dmx-session-manager id="session1"></dmx-session-manager>

Session items:


HTML for iterating session messages:

<div dmx-show="session1.data.messages" class="container">
    <div class="row">
        <div class="col-md-12">
            <div dmx-repeat:repeat1="session1.data.messages">
                <div class="alert alert-dismissible alert-danger" dmx-bind:class="'alert alert-dismissible alert-' + class">
                    <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
                    <ul>
                        <li>{{message}}</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</div>

Expression to set message:

session1.set('messages',{message: 'Test', class: 'info'})
// dmx.parse("session1.set('messages',{message: 'Test', class: 'info'})")

But this sets an object instead of an array containing that object, so it doesn’t work - I want the ability to push multiple messages into it. How can I do so? I tried using the Array component but it only seems to accept strings and not objects, at least looking at the UI

Perhaps a datastore may be the better option to a cookie in this use-case which will allow you to set multiple values and read this back on any page ?

1 Like

Here’s how I solved this:

Library action flashNotification:

Flash notification:

Server Action to get notifications:

On the main layout I put a server connect call to the one shown in the screenshot above

And then I put a div with a repeat to show the messages from this server connect call data, coupled with a dmx-show attribute to only show this div if there are messages to be shown.

Once a message is shown it’s erased from the session (as screenshot above), so it’s not shown again on subsequent page loads