Turbo stream federal tax index.

app/controllers/federal_tax_brackets_controller.rb

@@ -4,6 +4,10 @@ class FederalTaxBracketsController < ApplicationController
   # GET /federal_tax_brackets or /federal_tax_brackets.json
   def index
     @federal_tax_brackets = FederalTaxBracket.order_by_range
+    respond_to do |format|
+      format.turbo_stream
+      format.html
+    end
   end
 
   # GET /federal_tax_brackets/1 or /federal_tax_brackets/1.json

app/views/components/_toolbar.html.erb

@@ -1,17 +1,17 @@
-<ul class="flex flex-wrap text-sm font-medium text-center text-gray-500 border-b border-gray-200 dark:border-gray-700 dark:text-gray-400">
+<ul class="flex flex-wrap text-sm font-medium text-center text-gray-500 border-b border-gray-200">
   <li class="mx-auto">
-    <a href="<%= root_path %>" aria-current="page" class="inline-block p-4 text-blue-600 bg-gray-100 rounded-t-lg active dark:bg-gray-800 dark:text-blue-500">Budget Calculator</a>
+    <a href="<%= root_path %>" aria-current="page" class="inline-block p-4 text-blue-600 bg-gray-100 rounded-t-lg active">Budget Calculator</a>
   </li>
   <li class="mx-auto">
-    <a href="<%= federal_tax_brackets_path %>" class="inline-block p-4 rounded-t-lg hover:text-gray-600 hover:bg-gray-50 dark:hover:bg-gray-800 dark:hover:text-gray-300">Federal Tax Brackets</a>
+    <%= link_to "Federal Tax Brackets", federal_tax_brackets_path, data: { turbo_stream: true }, class: "inline-block p-4 rounded-t-lg hover:text-gray-600 hover:bg-gray-50" %>
   </li>
   <li class="mx-auto">
-    <a href="#" class="inline-block p-4 rounded-t-lg hover:text-gray-600 hover:bg-gray-50 dark:hover:bg-gray-800 dark:hover:text-gray-300">State Income Tax</a>
+    <a href="#" class="inline-block p-4 rounded-t-lg hover:text-gray-600 hover:bg-gray-50">State Income Tax</a>
   </li>
   <li class="mx-auto">
-    <a href="#" class="inline-block p-4 rounded-t-lg hover:text-gray-600 hover:bg-gray-50 dark:hover:bg-gray-800 dark:hover:text-gray-300">Incomes</a>
+    <a href="#" class="inline-block p-4 rounded-t-lg hover:text-gray-600 hover:bg-gray-50">Incomes</a>
   </li>
   <li class="mx-auto">
-    <a class="inline-block p-4 text-gray-400 rounded-t-lg cursor-not-allowed dark:text-gray-500">Fixed Expenses</a>
+    <a href="#"  class="inline-block p-4 rounded-t-lg hover:text-gray-600 hover:bg-gray-50">Fixed Expenses</a>
   </li>
 </ul>

app/views/federal_tax_brackets/_index.html.erb

@@ -1,15 +1,17 @@
 <%= turbo_frame_tag :federal_tax_brackets do %>
-  <div class=" py-6 sm:px-6 lg:px-8">
-    <div class="grid grid-cols-7">
-      <% tax_headings = ["Filing Status", "Tier", "From", "To", "Rate", "Cumulative"] %>
-      <% tax_headings.each do |tax_heading| %>
-        <div>
-          <strong><%= tax_heading %></strong>
-        </div>
-      <% end %>
-      <div> </div>
-    </div>
+  <div class="primary-card">
+    <div class=" py-6 sm:px-6 lg:px-8">
+      <div class="grid grid-cols-7">
+        <% tax_headings = ["Filing Status", "Tier", "From", "To", "Rate", "Cumulative"] %>
+        <% tax_headings.each do |tax_heading| %>
+          <div>
+            <strong><%= tax_heading %></strong>
+          </div>
+        <% end %>
+        <div> </div>
+      </div>
 
-    <%= render @federal_tax_brackets %>
+      <%= render @federal_tax_brackets %>
+    </div>
   </div>
 <% end %>

app/views/federal_tax_brackets/index.html.erb

@@ -10,7 +10,5 @@
     </div>
   </div>
 
-  <div class="primary-card">
-    <%= render partial: "federal_tax_brackets/index" %>
-  </div>
+  <%= render partial: "federal_tax_brackets/index" %>
 </div>

app/views/federal_tax_brackets/index.turbo_stream.erb

@@ -0,0 +1 @@
+<%= turbo_stream.replace "primary_frame", partial: "federal_tax_brackets/index" %>