Better 404’s

app/assets/stylesheets/application.scss

@@ -4,6 +4,7 @@
 @import "normailze";
 @import "tipTip";
 @import "new-new-home";
+@import "error";
 
 .user-mosaic, .team-mosiac {
   float: left;
@@ -619,7 +620,7 @@ body#sign-in {
   width: 940px;
   margin: 50px auto 75px auto;
   text-align: center;
-  
+
   h2 {
     color: #777;
     text-transform: uppercase;

app/assets/stylesheets/error.scss

@@ -0,0 +1,52 @@
+.error-body {
+  p.error-desc {
+    margin: 20px 0 40px;
+    font-size: 16px;
+    line-height: 2;
+    a {
+      color: #000;
+      border-bottom: 1px solid #000;
+    }
+  }
+}
+
+.column {
+  display: inline-block;
+  &.popular-list {
+    background: #FFF;
+    padding: 20px;
+    box-sizing: border-box;
+    h3 {
+      margin-bottom: 10px;
+    }
+    ol {
+      list-style-type: decimal;
+      line-height: 2;
+      margin-left: 20px;
+      li {
+        font-size: 16px;
+        a {
+          color: #000;
+          border-bottom: 1px solid #000;
+        }
+      }
+    }
+  }
+  &.signup-list {
+    background: #3a3a3a;
+    width: 525px;
+    padding: 3em 4em;
+    -o-border-radius: 4px;
+    border-radius: 4px;
+    margin: 0 0 0 40px;
+    overflow: hidden;
+    @include sign-up-btns;
+    .sign-btns {
+      text-align: center;
+      li {
+        float: none;
+        display: inline-block;
+      }
+    }
+  }
+}

app/assets/stylesheets/new-new-home.scss

@@ -306,7 +306,7 @@
   .content .avatar {
     margin-top: 1em;
   }
-} 
+}
 
 .tip-sidebar {
   width: 30%;
@@ -1380,8 +1380,6 @@
     .join-panel {
       text-align: center;
       float: none;
-      .sign-btns {
-      }
     }
   }
 }

app/controllers/application_controller.rb

@@ -173,17 +173,11 @@ def not_on_achievements?
     params[:controller] != 'achievements'
   end
 
-  unless Rails.env.development? || Rails.env.test?
-    rescue_from(ActiveRecord::RecordNotFound) { |e| render_404 }
-    rescue_from(ActionController::RoutingError) { |e| render_404 }
-    # rescue_from(RuntimeError) { |e| render_500 }
-  end
+  rescue_from ActiveRecord::RecordNotFound, with: :render_404
+  rescue_from ActionController::RoutingError, with: :render_404
 
   def render_404
-    respond_to do |type|
-      type.html { render file: File.join(Rails.root, 'public', '404.html'), layout: nil, status: 404 }
-      type.all { render nothing: true, status: 404 }
-    end
+    render template: 'error/not_found', status: :not_found
   end
 
   def render_500

app/helpers/error_helper.rb

@@ -0,0 +1,5 @@
+module ErrorHelper
+  def protips_list(type, count)
+    Protip.method(type).call.first(count)
+  end
+end

app/views/error/_helpful_links.html.haml

@@ -0,0 +1,9 @@
+%div.columns
+  %div.column.popular-list
+    %h3="Top 5 Most Popular Protips"
+    %ol
+      - protips_list(:trending, 5).each do |protip|
+        %li
+          =link_to "#{protip.title} by #{protip.user.name}", protip_path(protip.public_id)
+  %div.column.signup-list
+    =render :partial => "sessions/join_buttons", :locals => {:message => "Join to start earning badges for your open source contributions, discover protips and connect with other developers"}

app/views/error/not_found.html.haml

@@ -0,0 +1,13 @@
+%div.error-body
+  %section.not-found
+    %header.cf
+      %h2 Uh oh, something went wrong!
+      %p.error-desc
+        Unfortunately, you are looking for something that isn't here. Maybe we can help you find something?
+        Use the links below to check out a few of the most popular protips or
+        #{ link_to "sign up and start submitting your own protips", signin_path }.
+        If you don't believe you should be seeing this error,
+        #{ link_to "please contact us", contact_us_path }!
+
+      = render partial: "error/helpful_links"
+

config/environments/development.rb

@@ -1,6 +1,6 @@
 Coderwall::Application.configure do
   config.threadsafe! unless $rails_rake_task
-  
+
   require 'sidekiq/testing/inline'
 
   config.action_controller.perform_caching = false
@@ -27,6 +27,6 @@
   config.cache_store = [:file_store,"/tmp/codewall-cache/"]
   config.assets.cache_store = [:file_store,"/tmp/codewall-cache/assets/"]
   Rails.application.config.sass.cache_location = "/tmp/codewall-cache/sass/"
-  
+
   BetterErrors::Middleware.allow_ip! ENV['TRUSTED_IP'] if ENV['TRUSTED_IP']
 end