PrimeVue basic migration

dashboard/app/package.json

@@ -6,7 +6,7 @@
     "@fontsource/jetbrains-mono": "5.1.0",
     "new-dashboard": "workspace:*",
     "pinia": "^2.2.2",
-    "primevue": "3.50.0",
+    "primevue": "4.0.7",
     "rxjs": "8.0.0-alpha.14",
     "vue": "3.5.6",
     "vue-router": "4.4.5"

dashboard/new-dashboard/package.json

@@ -4,6 +4,7 @@
   "dependencies": {
     "@headlessui/vue": "^1.7.23",
     "@heroicons/vue": "2.1.5",
+    "@primevue/core": "^4.0.7",
     "@vueuse/core": "^11.1.0",
     "compare-versions": "6.1.1",
     "echarts": "5.5.1",
@@ -12,7 +13,7 @@
     "humanize-duration": "3.32.1",
     "p-limit": "^6.1.0",
     "pinia": "^2.2.2",
-    "primevue": "3.50.0",
+    "primevue": "4.0.7",
     "rxjs": "8.0.0-alpha.14",
     "vue": "3.5.6",
     "vue-router": "4.4.5"

dashboard/new-dashboard/src/components.d.ts

@@ -7,31 +7,34 @@ export {}
 /* prettier-ignore */
 declare module 'vue' {
   export interface GlobalComponents {
-    Accordion: typeof import('primevue/accordion/Accordion.vue')['default']
-    AccordionTab: typeof import('primevue/accordiontab/AccordionTab.vue')['default']
-    Button: typeof import('primevue/button/Button.vue')['default']
-    Calendar: typeof import('primevue/calendar/Calendar.vue')['default']
-    Card: typeof import('primevue/card/Card.vue')['default']
-    Checkbox: typeof import('primevue/checkbox/Checkbox.vue')['default']
-    Column: typeof import('primevue/column/Column.vue')['default']
-    DataTable: typeof import('primevue/datatable/DataTable.vue')['default']
-    DeferredContent: typeof import('primevue/deferredcontent/DeferredContent.vue')['default']
-    Dialog: typeof import('primevue/dialog/Dialog.vue')['default']
-    Dropdown: typeof import('primevue/dropdown/Dropdown.vue')['default']
-    FloatLabel: typeof import('primevue/floatlabel/FloatLabel.vue')['default']
-    InputNumber: typeof import('primevue/inputnumber/InputNumber.vue')['default']
-    InputSwitch: typeof import('primevue/inputswitch/InputSwitch.vue')['default']
-    InputText: typeof import('primevue/inputtext/InputText.vue')['default']
-    Message: typeof import('primevue/message/Message.vue')['default']
-    MultiSelect: typeof import('primevue/multiselect/MultiSelect.vue')['default']
-    ScrollTop: typeof import('primevue/scrolltop/ScrollTop.vue')['default']
-    SelectButton: typeof import('primevue/selectbutton/SelectButton.vue')['default']
-    Slider: typeof import('primevue/slider/Slider.vue')['default']
-    SplitButton: typeof import('primevue/splitbutton/SplitButton.vue')['default']
-    TabPanel: typeof import('primevue/tabpanel/TabPanel.vue')['default']
-    TabView: typeof import('primevue/tabview/TabView.vue')['default']
-    Textarea: typeof import('primevue/textarea/Textarea.vue')['default']
-    Toolbar: typeof import('primevue/toolbar/Toolbar.vue')['default']
-    TreeSelect: typeof import('primevue/treeselect/TreeSelect.vue')['default']
+    Accordion: typeof import('primevue/accordion')['default']
+    AccordionTab: typeof import('primevue/accordiontab')['default']
+    Button: typeof import('primevue/button')['default']
+    Calendar: typeof import('primevue/calendar')['default']
+    Card: typeof import('primevue/card')['default']
+    Checkbox: typeof import('primevue/checkbox')['default']
+    Column: typeof import('primevue/column')['default']
+    DataTable: typeof import('primevue/datatable')['default']
+    DeferredContent: typeof import('primevue/deferredcontent')['default']
+    Dialog: typeof import('primevue/dialog')['default']
+    Dropdown: typeof import('primevue/dropdown')['default']
+    FloatLabel: typeof import('primevue/floatlabel')['default']
+    InputNumber: typeof import('primevue/inputnumber')['default']
+    InputSwitch: typeof import('primevue/inputswitch')['default']
+    InputText: typeof import('primevue/inputtext')['default']
+    Message: typeof import('primevue/message')['default']
+    MultiSelect: typeof import('primevue/multiselect')['default']
+    ScrollTop: typeof import('primevue/scrolltop')['default']
+    SelectButton: typeof import('primevue/selectbutton')['default']
+    Slider: typeof import('primevue/slider')['default']
+    SplitButton: typeof import('primevue/splitbutton')['default']
+    TabPanel: typeof import('primevue/tabpanel')['default']
+    TabView: typeof import('primevue/tabview')['default']
+    Textarea: typeof import('primevue/textarea')['default']
+    Toolbar: typeof import('primevue/toolbar')['default']
+    TreeSelect: typeof import('primevue/treeselect')['default']
+  }
+  export interface ComponentCustomProperties {
+    Tooltip: typeof import('primevue/tooltip')['default']
   }
 }

dashboard/new-dashboard/src/components/common/TestComparisonTable.vue

@@ -66,7 +66,7 @@
 </template>
 
 <script setup lang="ts">
-import { FilterMatchMode } from "primevue/api"
+import { FilterMatchMode } from "@primevue/core/api"
 import { ColumnFilterModelType } from "primevue/column"
 
 import { Observable } from "rxjs"

dashboard/new-dashboard/src/components/common/compare/CompareBuilds.vue

@@ -112,7 +112,7 @@
 </template>
 
 <script setup lang="ts">
-import { FilterMatchMode, FilterService } from "primevue/api"
+import { FilterMatchMode, FilterService } from "@primevue/core/api"
 import { ColumnFilterModelType } from "primevue/column"
 import { combineLatest, Observable } from "rxjs"
 import { provide, ref, useTemplateRef } from "vue"

dashboard/new-dashboard/src/components/metrics/MetricDescriptions.vue

@@ -47,7 +47,7 @@
 </template>
 
 <script setup lang="ts">
-import { FilterMatchMode } from "primevue/api"
+import { FilterMatchMode } from "@primevue/core/api"
 import { ref } from "vue"
 import { metricsDescription } from "../../shared/metricsDescription"
 

dashboard/new-dashboard/src/configurators/ServerWithCompressConfigurator.ts

@@ -5,7 +5,7 @@ import { dbTypeStore } from "../shared/dbTypes"
 import { injectOrError, serverUrlObservableKey } from "../shared/injectionKeys"
 
 export class ServerWithCompressConfigurator implements ServerConfigurator {
-  static readonly DEFAULT_SERVER_URL = "https://ij-perf.labs.jb.gg"
+  static readonly DEFAULT_SERVER_URL = "https://ij-perf-api.labs.jb.gg"
 
   private readonly observable: Observable<null>
   private _serverUrl: string = ServerWithCompressConfigurator.DEFAULT_SERVER_URL

package.json

@@ -14,6 +14,7 @@
     "test": "vitest run"
   },
   "devDependencies": {
+    "@primevue/auto-import-resolver": "^4.0.7",
     "@tailwindcss/forms": "^0.5.9",
     "@tailwindcss/typography": "^0.5.15",
     "@typescript-eslint/eslint-plugin": "^8.6.0",