Credit start

app/controllers/accounts_controller.rb

@@ -1,10 +1,6 @@
 class AccountsController < ApplicationController
   before_action :authenticate_user!
 
-  def index
-    @accounts = current_family.accounts
-  end
-
   def new
   end
 
@@ -12,6 +8,10 @@ class AccountsController < ApplicationController
     @account = Depository.new
   end
 
+  def new_credit
+    @account = Credit.new
+  end
+
   def show
   end
 
@@ -20,7 +20,7 @@ class AccountsController < ApplicationController
     @account.family = current_family
 
     if @account.save
-      redirect_to accounts_path
+      redirect_to root_path
     else
       render :new
     end

app/models/credit.rb

@@ -0,0 +1,2 @@
+class Credit < Account
+end

app/views/accounts/index.html.erb

@@ -1,14 +0,0 @@
-
-<h2 class="text-2xl font-semibold font-display">Cash</h2>
-<h3 class="mt-1 mb-4 text-sm text-gray-500"><%#= number_to_currency current_family.cash_balance %></h3>
-
-<% current_family.accounts.depository.each do |account| %>
-    <div class="flex items-center justify-between px-3 py-3 mb-2 bg-white shadow-sm rounded-xl">
-      <div class="flex items-center text-sm">
-        <%= account.name %> 
-      </div>
-      <p class="text-sm text-right">
-        <span class="block mb-1"><%= number_to_currency account.balance %></span>
-      </p>
-    </div>
-  <% end %>

app/views/accounts/new.html.erb

@@ -11,6 +11,16 @@
     <% end %>
   </div>
 
+  <div class="relative flex-col items-center px-5 py-4 space-x-3 text-center bg-white border border-gray-100 shadow-sm rounded-xl hover:border-gray-200">
+    <%= link_to new_credit_path, class: "flex flex-col items-center justify-center w-full text-center focus:outline-none" do %>
+      <span class="absolute inset-0" aria-hidden="true"></span>
+      <span class="flex w-10 h-10 shrink-0 grow-0 items-center justify-center rounded-xl bg-[#E6F6FA] mb-2">
+        <%= inline_svg_tag('icon-credit-card.svg', class: 'text-[#189FC7] stroke-current') %>
+      </span>
+      Credit cards
+    <% end %>
+  </div>
+
   <div class="relative flex-col items-center px-5 py-4 space-x-3 text-center bg-white border border-gray-100 shadow-sm rounded-xl hover:border-gray-200">
     <%= link_to "new_investment_path", class: "flex flex-col items-center justify-center w-full text-center focus:outline-none" do %>
       <span class="absolute inset-0" aria-hidden="true"></span>
@@ -21,16 +31,6 @@
     <% end %>
   </div>
 
-  <div class="relative flex-col items-center px-5 py-4 space-x-3 text-center bg-white border border-gray-100 shadow-sm rounded-xl hover:border-gray-200">
-    <%= link_to "new_credit_path", class: "flex flex-col items-center justify-center w-full text-center focus:outline-none" do %>
-      <span class="absolute inset-0" aria-hidden="true"></span>
-      <span class="flex w-10 h-10 shrink-0 grow-0 items-center justify-center rounded-xl bg-[#E6F6FA] mb-2">
-        <%= inline_svg_tag('icon-credit-card.svg', class: 'text-[#189FC7] stroke-current') %>
-      </span>
-      Credit cards
-    <% end %>
-  </div>
-
   <div class="relative flex-col items-center px-5 py-4 space-x-3 text-center bg-white border border-gray-100 shadow-sm rounded-xl hover:border-gray-200">
     <%= link_to "new_real_estate_path", class: "flex flex-col items-center justify-center w-full text-center focus:outline-none" do %>
       <span class="absolute inset-0" aria-hidden="true"></span>

app/views/accounts/new_credit.html.erb

@@ -0,0 +1,37 @@
+<div class="relative flex items-center mb-5 space-x-2">
+    <%= link_to new_account_path, class: "" do %>
+      <%= inline_svg_tag('icon-arrow-left.svg', class: 'text-gray-500 fill-current') %>
+    <% end %>
+  <h2 class="text-2xl font-semibold font-display">Enter credit card account</h2>
+</div>
+
+<%= form_with model: @account, url: accounts_path, scope: :account, html: { class: "space-y-4" } do |f| %>
+  <%= f.hidden_field :type, value: "Credit" %>
+  
+  <div class="relative p-4 border border-gray-100 bg-offwhite rounded-xl focus-within:bg-white focus-within:shadow focus-within:opacity-100">
+    <%# <span class="absolute px-2 py-1 text-xs font-medium text-gray-400 uppercase bg-gray-200 rounded-full opacity-50 right-3">Optional</span> %>
+    <label for="account_name" class="block text-sm font-medium opacity-50 focus-within:opacity-100">Name</label>
+    <%= f.text_field :name, placeholder: "Account name", required: 'required', class: "p-0 mt-1 bg-transparent border-none opacity-50 focus:outline-none focus:ring-0 focus-within:opacity-100" %>
+  </div>
+
+  <div class="relative p-4 border border-gray-100 bg-offwhite rounded-xl focus-within:bg-white focus-within:shadow focus-within:opacity-100">
+    <span class="absolute px-2 py-1 text-xs font-medium text-gray-400 uppercase bg-gray-200 rounded-full opacity-50 right-3">Optional</span>
+    <label for="credit_limit" class="block text-sm font-medium opacity-50 focus-within:opacity-100">Limit</label>
+    <div class="flex">
+      <%= f.number_field :credit_limit, placeholder: "$0.00", in: 0.00..100000000.00, class: "p-0 mt-1 bg-transparent border-none opacity-50 focus:outline-none focus:ring-0 focus-within:opacity-100" %>
+    </div>
+  </div>
+
+  <div class="relative p-4 border border-gray-100 bg-offwhite rounded-xl focus-within:bg-white focus-within:shadow focus-within:opacity-100">
+    <label for="account_name" class="block text-sm font-medium opacity-50 focus-within:opacity-100">Balance</label>
+    <div class="flex">
+      <%= f.number_field :balance, placeholder: "$0.00", in: 0.00..100000000.00, required: 'required', class: "p-0 mt-1 bg-transparent border-none opacity-50 focus:outline-none focus:ring-0 focus-within:opacity-100" %>
+    </div>
+  </div>
+
+  <div class="absolute right-5 bottom-5">
+    <button type="submit" class="flex items-center justify-center w-12 h-12 mb-2 bg-black rounded-full shrink-0 grow-0 hover:bg-gray-600">
+        <i class="text-xl text-white fa-regular fa-check"></i>
+    </button>
+  </div>
+<% end %>

config/routes.rb

@@ -10,6 +10,10 @@ Rails.application.routes.draw do
     scope "bank" do
       get "", to: "accounts#new_bank", as: "new_bank"
     end
+
+    scope "credit" do
+      get "", to: "accounts#new_credit", as: "new_credit"
+    end
   end
 
   # Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500.