User Onboarding Progress Bar Discussion
Implementing this is something that needs to happen soon in the app I'm working on, so your timing is perfect!
It covers nearly exactly what we need to do. :-)
Thanks!
Interesting episode, it should be great to have one on a gem named "Merit"
Merit adds reputation behavior to Rails apps in the form of Badges, Points, and Rankings.
https://github.com/merit-gem/merit
Thanks as always Chris! Great stuff. We have our onboarding checklist already working, but yours is a bit cleaner, and automatically checks off the items as they are completed! I look forward to implementing this as an improvement in the future!
If you happen to see this:
QUESTION
Can this work on a more complicated task, i.e. Make a post that uses the tag 'introduce-yourself'? In other words, how would we set it up so the checklist knows it wasn't just a post, but actually a post with a particular tag?
I have a weird issue going on with this. I previously implemented the activity feed from another video. Now whenever a user achieves 100 percent progress in this onboarding profile, it updates the onboarding_completed_at column as expected. Only thing is rails automatically inserts a new Activity with empty values into the database, which throws errors on the user dashboard.
(0.0ms) begin transaction
SQL (1.7ms) UPDATE "users" SET "onboarding_completed_at" = ?, "updated_at" = ? WHERE "users"."id" = ? [["onboarding_completed_at", "2019-07-23 05:54:51.413467"], ["updated_at", "2019-07-23 05:54:51.750723"], ["id", 3]]
SQL (0.2ms) INSERT INTO "activities" ("user_id", "created_at", "updated_at") VALUES (?, ?, ?) [["user_id", 3], ["created_at", "2019-07-23 05:54:51.754118"], ["updated_at", "2019-07-23 05:54:51.754118"]]
(13.4ms) commit transaction
Here is the error. Specifically it is talking about hte lookup_context line:
undefined method empty?' for nil:NilClass
<% if @feed_items.any? %>
<% @feed_items.each do |item| %>
<% if lookup_context.template_exists?(item.eventable_type, "dashboards/types", true) %>
<div class="row p-2">
<div class="col-3 col-md-2">
<% if item.user.image? %>
My module here is exactly like the one in the video, I have only added other steps. (Also, the :has_followed? method appears in my user model already, and it works. Nothing in my users controller calls for an Activity to be created. In fact, this only occurs in specific controllers where something like a comment or a new post is created.
Why might this be happening?
module UserOnboarding
extend ActiveSupport::Concern
def should_see_onboarding?
!onboarding_completed_at? || onboarding_completed_at > 1.day.ago
end
def onboarding_percent
return 100 if onboarding_completed_at?
steps = [:image?, :bio?, :has_favorite?, :has_followed?, :has_topic?, :has_comment?, :has_review?]
complete = steps.select{ |step| send(step) }
percent = complete.length / steps.length.to_f * 100
update(onboarding_completed_at: Time.current) if percent == 100
percent
end
def has_favorite?
favorites.any?
end
def has_topic?
topics.any?
end
def has_comment?
comments.any?
end
def has_review?
reviews.any?
end
end
Finally went through this in Rails 6, thanks again...didn't think it would be so cut and dried. Now that same HTML div tag can be generated as follows:
tag.div class: ["fa-check", color]
<div class="fa-check text-success">
</div>