Allow user to reload fallback data

renderer/public/data/en/app_i18n.json

@@ -437,7 +437,10 @@
     "parse_error": "For some reason this item's stats did not parse.",
     "parse_error2": "It likely has a mod that is not supported yet.",
     "parse_error3": "(Potentially new or changed wording from poe1)",
-    "bulk_exchange": "Bulk exchange rates are not implemented yet"
+    "bulk_exchange": "Bulk exchange rates are not implemented yet",
+    "found_data": "Found {0} items and {1} stats",
+    "no_data": "No new data found",
+    "failed_to_load": "Loading fallback data failed, try again later"
   },
   "tips": {
     "tip_1": "You can add your own images to the cheat sheet widget by hitting \"edit\"",

renderer/src/parser/Parser.ts

@@ -7,7 +7,6 @@ import {
   BaseType,
   ITEM_BY_TRANSLATED,
   TRADE_ITEM_BY_REF,
-  TRADE_STAT_BY_STAT_ID,
 } from "@/assets/data";
 import { ModifierType, StatCalculated, sumStatsByModType } from "./modifiers";
 import {
@@ -1633,18 +1632,19 @@ function parseStatsFromMod(
       continue;
     }
 
-    const validTradeIds = parsedStat?.stat.trade.ids[
-      modifier.info.type
-    ]?.filter((id) =>
-      TRADE_STAT_BY_STAT_ID(
-        id +
-          (parsedStat.stat.trade.option
-            ? "|" + parsedStat.translation.value
-            : ""),
-      ),
-    );
+    // const validTradeIds = parsedStat?.stat.trade.ids[
+    //   modifier.info.type
+    // ]?.filter((id) =>
+    //   TRADE_STAT_BY_STAT_ID(
+    //     id +
+    //       (parsedStat.stat.trade.option
+    //         ? "|" + parsedStat.translation.value
+    //         : ""),
+    //   ),
+    // );
 
-    if (parsedStat && validTradeIds && validTradeIds.length) {
+    // if (parsedStat && validTradeIds && validTradeIds.length) {
+    if (parsedStat) {
       modifier.stats.push(parsedStat);
 
       stat = statIterator.next(true);

renderer/src/web/price-check/PriceCheckWindow.vue

@@ -90,6 +90,11 @@
         <template v-if="item?.isErr()">
           <ui-error-box class="m-4">
             <template #name>{{ t(item.error.name) }}</template>
+            <template #actions
+              ><reload-trade-data
+                :item-text="item.error.rawText"
+                :pos="checkPosition"
+            /></template>
             <p>{{ t(item.error.message) }}</p>
           </ui-error-box>
           <pre class="bg-gray-900 rounded m-4 overflow-x-hidden p-2">{{
@@ -189,6 +194,7 @@ import {
 import { translatedEffectsPseudos } from "./filters/pseudo";
 import { ItemEditorType } from "@/parser/meta";
 import { getItemEditorType } from "./filters/util";
+import ReloadTradeData from "./fallback/ReloadTradeData.vue";
 
 type ParseError = {
   name: string;
@@ -247,6 +253,7 @@ export default defineComponent({
     ItemQuickPrice,
     UiErrorBox,
     UiPopover,
+    ReloadTradeData,
   },
   props: {
     config: {

renderer/src/web/price-check/fallback/ReloadTradeData.vue

@@ -0,0 +1,101 @@
+<template>
+  <div
+    v-if="loadedCounts && (loadedCounts.foundItems || loadedCounts.foundStats)"
+    class="flex flex-col"
+  >
+    <div>
+      {{
+        t("poe2_new.found_data", [
+          loadedCounts.foundItems,
+          loadedCounts.foundStats,
+        ])
+      }}
+    </div>
+    <button class="btn w-fit" @click="retryItem">{{ t("Retry Item") }}</button>
+  </div>
+  <div v-else-if="loadedCounts">
+    {{ t("poe2_new.no_data") }}
+  </div>
+  <div v-else-if="err">{{ t(err) }}</div>
+  <button
+    v-else-if="!isLoading"
+    class="btn"
+    :class="{ 'my-2': buttonMargin }"
+    @click="reloadData"
+  >
+    {{ t("Reload fallback data") }}
+  </button>
+  <div v-else>{{ t("Loading...") }}</div>
+</template>
+
+<script lang="ts">
+import { defineComponent, PropType, shallowRef } from "vue";
+import { useTradeData } from "@/web/background/TradeData";
+import { useI18n } from "vue-i18n";
+import { Host } from "@/web/background/IPC";
+
+export default defineComponent({
+  props: {
+    buttonMargin: {
+      type: Boolean,
+    },
+    itemText: {
+      type: String,
+      required: true,
+    },
+    pos: {
+      type: Object as PropType<{ x: number; y: number }>,
+      default: () => ({ x: 0, y: 0 }),
+    },
+  },
+  setup(props) {
+    const { load, isLoading } = useTradeData();
+    const { t } = useI18n();
+
+    const loadedCounts = shallowRef<
+      undefined | { foundItems: number; foundStats: number }
+    >(undefined);
+
+    const err = shallowRef<string | undefined>(undefined);
+
+    const reloadData = () => {
+      const res = load(true); // force to go around timer
+      res.then(
+        (updatedNumbers) => {
+          if (!updatedNumbers) {
+            err.value = "poe2_new.failed_to_load";
+          } else {
+            loadedCounts.value = updatedNumbers;
+          }
+        },
+        () => {
+          // shouldn't happen, load is internally try caught
+          err.value = "unhandled internal error, please report on github";
+        },
+      );
+    };
+
+    const retryItem = () => {
+      console.log("retrying item");
+      Host.selfDispatch({
+        name: "MAIN->CLIENT::item-text",
+        payload: {
+          target: "price-check",
+          clipboard: props.itemText,
+          position: props.pos,
+          focusOverlay: true,
+        },
+      });
+    };
+
+    return {
+      t,
+      reloadData,
+      retryItem,
+      isLoading,
+      loadedCounts,
+      err,
+    };
+  },
+});
+</script>

renderer/src/web/price-check/filters/FiltersBlock.vue

@@ -236,6 +236,7 @@
             v-for="stat of item.unknownModifiers"
             :key="stat.type + '/' + stat.text"
             :stat="stat"
+            :item-text="item.rawText"
           />
         </template>
         <template v-if="showMissingFracturedWarning">

renderer/src/web/price-check/filters/UnknownModifier.vue

@@ -1,33 +1,52 @@
 <template>
-  <div class="py-2 border-b border-gray-700 flex flex-col">
-    <div class="pb-1 flex items-baseline">
-      <i class="w-5 shrink-0 fas fa-exclamation-triangle text-orange-400"></i>
-      <div
-        class="search-text mr-1 relative flex min-w-0"
-        style="line-height: 1rem"
-      >
-        <span class="truncate"><ItemModifierText :text="stat.text" /></span>
-        <span class="search-text-full whitespace-pre-wrap cursor-default"
-          ><ItemModifierText :text="stat.text"
-        /></span>
+  <div class="flex flex-row justify-between border-b border-gray-700">
+    <div class="py-2 flex flex-col">
+      <div class="pb-1 flex items-baseline">
+        <i class="w-5 shrink-0 fas fa-exclamation-triangle text-orange-400"></i>
+        <div
+          class="search-text mr-1 relative flex min-w-0"
+          style="line-height: 1rem"
+        >
+          <span class="truncate"><ItemModifierText :text="stat.text" /></span>
+          <span class="search-text-full whitespace-pre-wrap cursor-default"
+            ><ItemModifierText :text="stat.text"
+          /></span>
+        </div>
+      </div>
+      <div class="ml-5 text-xs leading-none">
+        <span class="text-gray-600">{{ t(stat.type) }} &mdash; </span>
+        <span class="text-orange-400">{{ t("Not recognized modifier") }}</span>
       </div>
     </div>
-    <div class="ml-5 text-xs leading-none">
-      <span class="text-gray-600">{{ t(stat.type) }} &mdash; </span>
-      <span class="text-orange-400">{{ t("Not recognized modifier") }}</span>
+    <div class="text-xs max-w-48 m-1">
+      <reload-trade-data button-margin :item-text="itemText" />
     </div>
   </div>
 </template>
 
-<script setup lang="ts">
+<script lang="ts">
 import { useI18n } from "vue-i18n";
 import { ParsedItem } from "@/parser";
-
 import ItemModifierText from "../../ui/ItemModifierText.vue";
+import { defineComponent, PropType } from "vue";
+import ReloadTradeData from "../fallback/ReloadTradeData.vue";
 
-defineProps<{
-  stat: ParsedItem["unknownModifiers"][number];
-}>();
+export default defineComponent({
+  components: { ItemModifierText, ReloadTradeData },
+  props: {
+    stat: {
+      type: Object as PropType<ParsedItem["unknownModifiers"][number]>,
+      required: true,
+    },
+    itemText: {
+      type: String,
+      required: true,
+    },
+  },
+  setup() {
+    const { t } = useI18n();
 
-const { t } = useI18n();
+    return { t };
+  },
+});
 </script>