feat: white sockets

src/components/filters/FiltersBlock.vue

@@ -6,6 +6,8 @@
       <div v-if="filters.mapBlighted" class="trade-tag">Blighted</div>
       <button v-if="filters.itemLevel" class="trade-tag" :class="{ disabled: filters.itemLevel.disabled }"
         @click="filters.itemLevel.disabled = !filters.itemLevel.disabled">Item Level: {{ filters.itemLevel.value }}</button>
+      <button v-if="filters.whiteSockets" class="trade-tag" :class="{ disabled: filters.whiteSockets.disabled }"
+        @click="filters.whiteSockets.disabled = !filters.whiteSockets.disabled">White: {{ filters.whiteSockets.value }}</button>
       <div v-if="filters.gemLevel" class="trade-tag">Level: {{ filters.gemLevel.min }}</div>
       <div v-if="filters.quality" class="trade-tag">Quality: {{ filters.quality.min }}%</div>
       <template v-if="filters.influences">

src/components/filters/create-item-filters.ts

@@ -95,6 +95,13 @@ export function createFilters (item: ParsedItem): ItemFilters {
     }
   }
 
+  if (item.sockets.white) {
+    filters.whiteSockets = {
+      value: item.sockets.white,
+      disabled: false
+    }
+  }
+
   if (
     item.rarity === ItemRarity.Normal ||
     item.rarity === ItemRarity.Magic ||

src/components/filters/interfaces.ts

@@ -18,6 +18,10 @@ export interface ItemFilters {
     value: number
     disabled: boolean
   }
+  whiteSockets?: {
+    value: number
+    disabled: boolean
+  }
   corrupted?: {
     value: boolean
   }

src/components/parser/ParsedItem.ts

@@ -23,8 +23,7 @@ export interface ParsedItem {
   quality?: number
   sockets: {
     linked?: number // only 5 or 6
-    // @TODO "white?: number"
-    // PoE 4.0 "count?: number"
+    white?: number
   }
   stackSize?: number
   isUnidentified: boolean

src/components/parser/Parser.ts

@@ -277,6 +277,9 @@ function parseStackSize (section: string[], item: ParsedItem) {
 function parseSockets (section: string[], item: ParsedItem) {
   if (section[0].startsWith(TAG_SOCKETS)) {
     let sockets = section[0].substr(TAG_SOCKETS.length)
+
+    item.sockets.white = (sockets.split('W').length - 1)
+
     sockets = sockets.replace(/[^ -]/g, '#')
     if (sockets === '#-#-#-#-#-#') {
       item.sockets.linked = 6

src/components/trade/pathofexile-trade.ts

@@ -74,6 +74,9 @@ interface TradeRequest { /* eslint-disable camelcase */
       socket_filters?: {
         filters: {
           links?: FilterRange
+          sockets?: {
+            w?: number
+          }
         }
       }
       misc_filters?: {
@@ -224,6 +227,10 @@ export function createTradeRequest (filters: ItemFilters, stats: StatFilter[]) {
     prop.set(query.filters, 'socket_filters.filters.links.min', filters.linkedSockets.value)
   }
 
+  if (filters.whiteSockets && !filters.whiteSockets.disabled) {
+    prop.set(query.filters, 'socket_filters.filters.sockets.w', filters.whiteSockets.value)
+  }
+
   if (filters.mapTier) {
     prop.set(query.filters, 'map_filters.filters.map_tier.min', filters.mapTier.value)
     prop.set(query.filters, 'map_filters.filters.map_tier.max', filters.mapTier.value)