Is there any way to listen User login event using Theme component

Dev
6

I’m afraid that’s not possible.

Those properties don’t have setters; even if they did, your changes would only temporarily apply in the first window. Once the user visits the second tab, the data will be based on what’s stored in the database. Themes don’t have access to the backend; they can only change the frontend.

What you can do is add a hash to your link and check for that like this.

import { withPluginApi } from "discourse/lib/plugin-api";
import bootbox from "bootbox";

export default {
  name: "first-login-bootbox",
  initialize() {
    withPluginApi("0.8", api => {
      const user = api.getCurrentUser();
      if (!user) return;

      if (
        !user.read_first_notification &&
        !user.enforcedSecondFactor &&
        !window.location.hash
      ) {
        const text = `Lorem ipsum dolor sit amet <a href="http://localhost:3000/new-topic#some-hash" target="_blank">Link</a>, consectetur adipiscing elit, sed do eiusmod tempor`;
        bootbox.alert(text);
      }
    });
  }
};

I’m not sure if linking to “/new-topic” in your post was just an example or if it’s what you want to do. If it’s the desired result, then you have another problem. Even if the bootbox is not displayed on the page with the hash, they’ll still see this…

image
image1305×617 96.3 KB

…and the composer will not open, which makes sense since it’s very unexpected for a user to start typing a topic on their very first page-view immediately.

Might I ask what you’re trying to accomplish here? Are you trying to inform the user of something or the other?

The way I’ve seen this done on other sites is to edit the welcome message, but if that’s an option, there are alternatives.

Here’s what I suggest

  1. create a topic and add all of the information you want there
  2. publish that topic
  3. link to that topic in the bootbox and open that link in a new tab.

This way, when the user clicks on the link, they’ll see something like this (without the overlay)

image
image1564×1416 233 KB

Once they’re done with that page, they can go back to the first tab, dismiss the bootbox, read the first notification and then continue using the site.

This way, you don’t even need to add/check for a hash. Here’s an example snippet

import { withPluginApi } from "discourse/lib/plugin-api";
import bootbox from "bootbox";

export default {
  name: "first-login-bootbox",
  initialize() {
    withPluginApi("0.8", api => {
      const user = api.getCurrentUser();
      if (!user) return;

      if (!user.read_first_notification && !user.enforcedSecondFactor) {
        const text = `Lorem ipsum dolor sit amet <a href="http://my.site.com/pub/bentley-flying-spur-s-production-milestone" target="_blank">Link</a>, consectetur adipiscing elit, sed do eiusmod tempor`;
        bootbox.alert(text);
      }
    });
  }
};
2 Likes