feat: add selected badge for selected path

TheOdinProject · Apr 24, 2024 · 04f0e19 · 04f0e19
1 parent be53c1b
commit 04f0e19
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 2 deletions.
diff --git a/app/controllers/paths_controller.rb b/app/controllers/paths_controller.rb
@@ -2,6 +2,7 @@ class PathsController < ApplicationController
   def index
     @foundations = Path.default_path
     @fullstack_paths = Path.fullstack_paths
+    @badge_text = 'Selected'
   end
 
   def show

diff --git a/app/views/paths/index.html.erb b/app/views/paths/index.html.erb
@@ -4,7 +4,7 @@
   <div class="max-w-4xl mx-auto">
     <h1 class="page-heading-title">All Paths</h1>
 
-    <%= render CardComponent.new do |card| %>
+    <%= render CardComponent.new(classes: "relative") do |card| %>
       <% card.with_header(classes: 'md:pb-6 md:border-b border-gray-200 dark:border-gray-600') do %>
         <div class=" flex justify-between items-center flex-col sm:flex-row space-y-4 sm:space-y-0">
           <div class="flex flex-col space-y-5 sm:space-x-6 sm:space-y-0 sm:flex-row items-center">
@@ -16,6 +16,13 @@
                 <h2 class="text-3xl font-medium text-gray-800 dark:text-gray-300">Foundations</h2>
               <% end %>
             </div>
+            <% if current_user.present? and current_user.on_path?(@foundations) %>
+              <div class="absolute top-3.5 right-3.5 !mt-0 md:static">
+                <%= render Ui::BadgeComponent.new(color: 'green') do %>
+                  <%= @badge_text %>
+                <% end %>
+              </div>
+            <% end %>
           </div>
 
           <div class="space-x-6 justify-center hidden md:flex">
@@ -49,8 +56,15 @@
     <div class="flex gap-x-10 gap-y-6 flex-col md:flex-row">
       <% @fullstack_paths.each do |path| %>
 
-        <%= render CardComponent.new(classes: 'flex flex-col') do |card| %>
+        <%= render CardComponent.new(classes: 'flex flex-col relative') do |card| %>
           <% card.with_header(classes: 'flex flex-col justify-between items-center') do %>
+            <div class="absolute top-3.5 right-3.5">
+              <% if current_user.present? and current_user.on_path?(path) %>
+                <%= render Ui::BadgeComponent.new(color: 'green') do %>
+                  <%= @badge_text %>
+                <% end %>
+              <% end %>
+            </div>
             <%= link_to path_path(path), class: 'p-2 dark:bg-gray-700/50 rounded-full' do %>
               <%= image_tag path.badge_uri, alt: path.title, class: 'w-24 h-24' %>
             <% end %>