SelinaLaveryDev / Project4-Budget-Plan-pal

Budget Plan Pal, SEI Project 04 at General Assembly. A full-stack budgeting app made using Ruby on Rails, PostgreSQL, Devise authentication and SASS. Solo project built in 6 days.
https://morning-anchorage-14468.herokuapp.com/
0 stars 0 forks source link

Need help with icons #1

Open SelinaLaveryDev opened 1 year ago

SelinaLaveryDev commented 1 year ago

I would like specific icons to appear when the user picks their category, could you let me know the best way I could do this?

I added icons to the transactions.rb file but couldn't get it to work:

class Transaction < ApplicationRecord

The CATEGORIES constant is used to populate the category dropdown in the form.

CATEGORIES = [ { name: "Groceries", icon: "fa-solid fa-burger-lettuce" }, { name: "Transportation", icon: "fa-solid fa-bus" }, { name: "Travel", icon: "fa-duotone fa-plane-departure" }, { name: "Food", icon: "fa-regular fa-utensils" }, { name: "Entertainment", icon: "fa-regular fa-masks-theater" }, { name: "Housing", icon: "fa-duotone fa-house" }, { name: "Utilities", icon: "fa-duotone fa-lightbulb" }, { name: "Personal Care", icon: "fa-duotone fa-bags-shopping" }, { name: "Education", icon: "fa-sharp fa-solid fa-graduation-cap" }, { name: "Health/fitness", icon: "fa-duotone fa-heart-pulse" }, { name: "Miscellaneous", icon: "fa-duotone fa-circle-question" } ]

belongs_to :user

validates :amount, presence: true end

This is the dashboard where i want the icons to render depending on the transaction.category chosen:

<%= link_to "Hello", profile_path, style: "color: white; text-decoration: none" %> <%= @user.first_name %>!

<% @transactions.each do |transaction| %>

<%= transaction.category %>

<%= transaction.title %>

<%= transaction.transaction_date %>

<%= number_to_currency(transaction.amount) %>

<%= link_to 'Edit', edit_transaction_path(transaction), style: "text-decoration: none" %> | <%= link_to 'Delete', transaction_path(transaction), style: "text-decoration: none", data: { turbo_method: :delete, turbo_confirm: "Are you sure you want to delete this transaction?" } %>

  <% end %>
</div>

usmanbashir commented 1 year ago

@sml-40 Do you want these icons to appear in a dropdown list or just a ul?

SelinaLaveryDev commented 1 year ago

@usmanbashir I was hoping for the icons to to appear when the user picked the 'category' of the transaction. So if the user is adding a transaction they would fill out a form - title, cost, and then a category from the dropdown i.e. travel, entertainment , groceries. When they click the add button, their transaction appears in their dashboard and it was here that I wanted the corresponding icon to appear with whatever the user had chosen. I wasn't sure if it was possible though, or how to go about doing it.