Now that we have a fully functional homepage for our admin users, let's now create one for our employees. But, before we get there, I want to quickly refactor our code in static_controller.rb. I want to use the enum we created earlier because that's faster and makes the code a lot more readable. Also, I want this code to run only if the user is of type admin.

# app/controllers/static_controller.rb

class StaticController < ApplicationController
  def homepage
    if current_user.type == 'AdminUser'
      @pending_approvals = Post.submitted
      @recent_audit_items = AuditLog.last(10)
    else
      #something else
    end
  end
end

As you may have guessed, it's not a good idea to check the user type directly because it may change. So, we are going to copy the admin_types method from application_helper.rb, and paste it in our application_controller.rb. This should ensure that the method is available throughout the application. So, change the code to:

# app/controllers/static_controller.rb

class StaticController < ApplicationController
  def homepage
    if admin_types.include?(current_user.type)
      @pending_approvals = Post.submitted
      @recent_audit_items = AuditLog.last(10)
    else
      #something else
    end
  end
end

Ok, now that our refactor is done, let's see what our employee page should have. I want them to be able to add a new time entry or confirm that they've not had any overtime for that particular week. For this, I want to try a different design. To start off, I want to create a div class that'll hold some blocks.

<!-- app/views/static/_employee.html.erb -->

<div class='container-fluid'>
  <div class='row'>
    <div class='col-md-5 column jumbotron employee-blocks'>
      asdf
    </div>

    <div class='col-md-5 column jumbotron employee-blocks'>
      asdf
    </div>
  </div>
</div>

I'm going to create a file called employee_homepage.css and include this in our main application.css.scss file.

In employee_homepage.css, let's create the style for our employee_blocks. To start off, I want a margin of 45px.

/* app/assets/stylesheets/employee_homepage.css */

.employee-blocks {
  margin: 45px;
}

This should give a skeletal structure, like this:

Resources

• Code at this stage