Pre-launch design sync with Figma spec (#2154)

* Add lookbook + viewcomponent, organize design system file

* Build menu component

* Button updates

* More button fixes

* Replace all menus with new ViewComponent

* Checkpoint: fix tests, all buttons and menus converted

* Split into Link and Button components for clarity

* Button cleanup

* Simplify custom confirmation configuration in views

* Finalize button, link component API

* Add toggle field to custom form builder + Component

* Basic tabs component

* Custom tabs, convert all menu / tab instances in app

* Gem updates

* Centralized icon helper

* Update all icon usage to central helper

* Lint fixes

* Centralize all disclosure instances

* Dialog replacements

* Consolidation of all dialog styles

* Test fixes

* Fix app layout issues, move to component with slots

* Layout simplification

* Flakey test fix

* Fix dashboard mobile issues

* Finalize homepage

* Lint fixes

* Fix shadows and borders in dark mode

* Fix tests

* Remove stale class

* Fix filled icon logic

* Move transparent? to public interface

test/system/accounts_test.rb

@@ -92,7 +92,8 @@ class AccountsTest < ApplicationSystemTestCase
 
       click_button "Create Account"
 
-      within "[data-controller='tabs']" do
+      within_testid("account-sidebar-tabs") do
+        click_on "All"
         find("details", text: Accountable.from_type(accountable_type).display_name).click
         assert_text account_name
       end
@@ -104,8 +105,8 @@ class AccountsTest < ApplicationSystemTestCase
 
       visit account_url(created_account)
 
-      within "header:has(button[data-menu-target='button'])" do
-        find('button[data-menu-target="button"]').click
+      within_testid("account-menu") do
+        find("button").click
         click_on "Edit"
       end
 

test/system/chats_test.rb

@@ -12,7 +12,7 @@ class ChatsTest < ApplicationSystemTestCase
     visit root_path
 
     within "#chat-container" do
-      assert_selector "h3", text: "Enable Personal Finance AI"
+      assert_selector "h3", text: "Enable Maybe AI"
     end
   end
 

test/system/imports_test.rb

@@ -15,11 +15,15 @@ class ImportsTest < ApplicationSystemTestCase
 
     click_on "Import transactions"
 
-    find("button[data-id='csv-paste-tab']").click
+    within_testid("import-tabs") do
+      click_on "Copy & Paste"
+    end
 
     fill_in "import[raw_file_str]", with: file_fixture("imports/transactions.csv").read
 
-    find('input[type="submit"][value="Upload CSV"]').click
+    within "form" do
+      click_on "Upload CSV"
+    end
 
     select "Date", from: "import[date_col_label]"
     select "YYYY-MM-DD", from: "import[date_format]"
@@ -61,11 +65,15 @@ class ImportsTest < ApplicationSystemTestCase
 
     click_on "Import investments"
 
-    find("button[data-id='csv-paste-tab']").click
+    within_testid("import-tabs") do
+      click_on "Copy & Paste"
+    end
 
     fill_in "import[raw_file_str]", with: file_fixture("imports/trades.csv").read
 
-    find('input[type="submit"][value="Upload CSV"]').click
+    within "form" do
+      click_on "Upload CSV"
+    end
 
     select "date", from: "import[date_col_label]"
     select "YYYY-MM-DD", from: "import[date_format]"
@@ -99,11 +107,15 @@ class ImportsTest < ApplicationSystemTestCase
 
     click_on "Import accounts"
 
-    find("button[data-id='csv-paste-tab']").click
+    within_testid("import-tabs") do
+      click_on "Copy & Paste"
+    end
 
     fill_in "import[raw_file_str]", with: file_fixture("imports/accounts.csv").read
 
-    find('input[type="submit"][value="Upload CSV"]').click
+    within "form" do
+      click_on "Upload CSV"
+    end
 
     select "type", from: "import[entity_type_col_label]"
     select "name", from: "import[name_col_label]"
@@ -143,11 +155,15 @@ class ImportsTest < ApplicationSystemTestCase
 
     click_on "Import from Mint"
 
-    find("button[data-id='csv-paste-tab']").click
+    within_testid("import-tabs") do
+      click_on "Copy & Paste"
+    end
 
     fill_in "import[raw_file_str]", with: file_fixture("imports/mint.csv").read
 
-    find('input[type="submit"][value="Upload CSV"]').click
+    within "form" do
+      click_on "Upload CSV"
+    end
 
     click_on "Apply configuration"
 

test/system/settings_test.rb

@@ -39,7 +39,7 @@ class SettingsTest < ApplicationSystemTestCase
     click_link "Self hosting"
     assert_current_path settings_hosting_path
     assert_selector "h1", text: "Self-Hosting"
-    check "setting_require_invite_for_signup", allow_label_click: true
+    check "setting[require_invite_for_signup]", allow_label_click: true
     click_button "Generate new code"
     assert_selector 'span[data-clipboard-target="source"]', visible: true, count: 1 # invite code copy widget
     copy_button = find('button[data-action="clipboard#copy"]', match: :first) # Find the first copy button (adjust if needed)
@@ -56,7 +56,9 @@ class SettingsTest < ApplicationSystemTestCase
   private
 
     def open_settings_from_sidebar
-      find("#user-menu").click
+      within "div[data-testid=user-menu]" do
+        find("button").click
+      end
       click_link "Settings"
     end
 end

test/system/trades_test.rb

@@ -29,12 +29,12 @@ class TradesTest < ApplicationSystemTestCase
     visit_trades
 
     within_trades do
-      assert_text "Purchase 10 shares of AAPL"
       assert_text "Buy #{shares_qty} shares of AAPL"
     end
   end
 
   test "can create sell transaction" do
+    qty = 10
     aapl = @account.holdings.find { |h| h.security.ticker == "AAPL" }
 
     open_new_trade_modal
@@ -42,7 +42,7 @@ class TradesTest < ApplicationSystemTestCase
     select "Sell", from: "Type"
     fill_in "Ticker symbol", with: aapl.ticker
     fill_in "Date", with: Date.current
-    fill_in "Quantity", with: aapl.qty
+    fill_in "Quantity", with: qty
     fill_in "entry[price]", with: 215.33
 
     click_button "Add transaction"
@@ -50,7 +50,7 @@ class TradesTest < ApplicationSystemTestCase
     visit_trades
 
     within_trades do
-      assert_text "Sell #{aapl.qty.round} shares of AAPL"
+      assert_text "Sell #{qty} shares of AAPL"
     end
   end