From a007acee8dcf67615e8a795bc6e44567fab38568 Mon Sep 17 00:00:00 2001
From: andrewlalis <me@andrewlalis.com>
Date: Sat, 14 Mar 2026 22:58:57 -0400
Subject: [PATCH] Run formatting.

---
 web-app/src/pages/TransactionSearchPage.vue | 94 +++++++++++++++++----
 1 file changed, 79 insertions(+), 15 deletions(-)

diff --git a/web-app/src/pages/TransactionSearchPage.vue b/web-app/src/pages/TransactionSearchPage.vue
index 79f23a5..047f7c2 100644
--- a/web-app/src/pages/TransactionSearchPage.vue
+++ b/web-app/src/pages/TransactionSearchPage.vue
@@ -233,42 +233,83 @@ function loadAllParamValues(key: string): string[] {
   <AppPage title="Transactions">
     <AppForm>
       <FormGroup>
-        <FormControl label="Search" hint="Free-form text search against description, tags, vendor, category, account.">
-          <input v-model="searchQuery" type="text" placeholder="Search for transactions..." />
+        <FormControl
+          label="Search"
+          hint="Free-form text search against description, tags, vendor, category, account."
+        >
+          <input
+            v-model="searchQuery"
+            type="text"
+            placeholder="Search for transactions..."
+          />
         </FormControl>
       </FormGroup>
       <FormGroup>
         <div class="vueselect-control">
           <h5>Tag</h5>
-          <VueSelect v-model="tagFilters" :options="tagOptions" placeholder="Select tags" is-multi />
+          <VueSelect
+            v-model="tagFilters"
+            :options="tagOptions"
+            placeholder="Select tags"
+            is-multi
+          />
         </div>
         <div class="vueselect-control">
           <h5>Vendor</h5>
-          <VueSelect v-model="vendorFilters" :options="vendorOptions" placeholder="Select vendors" is-multi />
+          <VueSelect
+            v-model="vendorFilters"
+            :options="vendorOptions"
+            placeholder="Select vendors"
+            is-multi
+          />
         </div>
         <div class="vueselect-control">
           <h5>Category</h5>
-          <VueSelect v-model="categoryFilters" :options="categoryOptions" placeholder="Select categories" is-multi />
+          <VueSelect
+            v-model="categoryFilters"
+            :options="categoryOptions"
+            placeholder="Select categories"
+            is-multi
+          />
         </div>
         <div class="vueselect-control">
           <h5>Account</h5>
-          <VueSelect v-model="accountFilters" :options="accountOptions" placeholder="Select accounts" is-multi />
+          <VueSelect
+            v-model="accountFilters"
+            :options="accountOptions"
+            placeholder="Select accounts"
+            is-multi
+          />
         </div>
       </FormGroup>
 
       <FormGroup>
         <FormControl label="Max Amount">
-          <input v-model="maxAmountFilter" type="number" min="0" step="1" />
+          <input
+            v-model="maxAmountFilter"
+            type="number"
+            min="0"
+            step="1"
+          />
         </FormControl>
         <FormControl label="Min Amount">
-          <input v-model="minAmountFilter" type="number" min="0" step="1" />
+          <input
+            v-model="minAmountFilter"
+            type="number"
+            min="0"
+            step="1"
+          />
         </FormControl>
       </FormGroup>
 
       <FormGroup>
         <FormControl label="Sort By">
           <select v-model="selectedSort">
-            <option v-for="sortOpt in SORT_PROPERTIES" :key="sortOpt.property" :value="sortOpt.property">
+            <option
+              v-for="sortOpt in SORT_PROPERTIES"
+              :key="sortOpt.property"
+              :value="sortOpt.property"
+            >
               {{ sortOpt.label }}
             </option>
           </select>
@@ -281,19 +322,42 @@ function loadAllParamValues(key: string): string[] {
         </FormControl>
       </FormGroup>
       <ButtonBar>
-        <AppButton size="sm" icon="home" @click="goToHome()">Back to Homepage</AppButton>
-        <AppButton size="sm" icon="trash" @click="clearFilters()">Clear Filters</AppButton>
-        <AppButton size="sm" icon="file-export" @click="exportToFile()">Export to CSV</AppButton>
+        <AppButton
+          size="sm"
+          icon="home"
+          @click="goToHome()"
+          >Back to Homepage</AppButton
+        >
+        <AppButton
+          size="sm"
+          icon="trash"
+          @click="clearFilters()"
+          >Clear Filters</AppButton
+        >
+        <AppButton
+          size="sm"
+          icon="file-export"
+          @click="exportToFile()"
+          >Export to CSV</AppButton
+        >
       </ButtonBar>
     </AppForm>
 
-    <PaginationControls :page="page" @update="(pr) => fetchPage(pr.page, pr.size)" class="align-right" />
+    <PaginationControls
+      :page="page"
+      @update="(pr) => fetchPage(pr.page, pr.size)"
+      class="align-right"
+    />
     <AppBadge size="sm">
       {{ page.totalElements }} search
       {{ page.totalElements == 1 ? 'result' : 'results' }}
       in {{ lastFetchTime }} milliseconds
     </AppBadge>
-    <TransactionCard v-for="txn in page.items" :key="txn.id" :tx="txn" />
+    <TransactionCard
+      v-for="txn in page.items"
+      :key="txn.id"
+      :tx="txn"
+    />
   </AppPage>
 </template>
 <style lang="css" scoped>
@@ -302,7 +366,7 @@ function loadAllParamValues(key: string): string[] {
   margin: 0.5rem;
 }
 
-.vueselect-control>h5 {
+.vueselect-control > h5 {
   font-size: 0.9rem;
   font-weight: 700;
   margin: 0;