v1.2.0 Side Bar & Menu rework (#189)

* Basic side tool bar skeleton + Theme toggle (#164)

* Side bar skeleton

* Fix grid layout

* nit

* Add theme toggle logic

* Change primevue color theme to blue to match beta menu UI

* Add litegraph canvas splitter overlay (#177)

* Add vue wrapper

* Splitter overlay

* Move teleport to side bar comp

* Toolbar placeholder

* Move settings button from top menu to side bar (#178)

* Reverse relationship between splitter overlay and sidebar component (#180)

* Reverse relationship between splitter overlay and sidebar component

* nit

* Remove border on splitter

* Fix canvas shift (#186)

* Move queue/history display to side bar (#185)

* Side bar placeholder

* Pinia store for queue items

* Flatten task item

* Fix schema

* computed

* Switch running / pending order

* Use class-transformer

* nit

* Show display status

* Add tag severity style

* Add execution time

* nit

* Rename to execution success

* Add time display

* Sort queue desc order

* nit

* Add remove item feature

* Load workflow

* Add confirmation popup

* Add empty table placeholder

* Remove beta menu UI's queue button/list

* Add tests on litegraph widget text truncate (#191)

* Add tests on litegraph widget text truncate

* Updated screenshots

* Revert port change

* Remove screenshots

* Update test expectations [skip ci]

* Add back menu.settingsGroup for compatibility (#192)

* Close side bar on menu location set as disabled (#194)

* Remove placeholder side bar tabs (#196)

---------

Co-authored-by: bymyself <abolkonsky.rem@gmail.com>
Co-authored-by: github-actions <github-actions@github.com>

src/main.ts

@@ -1,12 +1,24 @@
 import { createApp } from "vue";
 import PrimeVue from "primevue/config";
 import Aura from "@primevue/themes/aura";
+import { definePreset } from "@primevue/themes";
+import ConfirmationService from "primevue/confirmationservice";
+import ToastService from "primevue/toastservice";
 import "primeicons/primeicons.css";
 
 import App from "./App.vue";
 import { app as comfyApp } from "@/scripts/app";
+import { createPinia } from "pinia";
+
+const ComfyUIPreset = definePreset(Aura, {
+  semantic: {
+    // @ts-ignore
+    primary: Aura.primitive.blue,
+  },
+});
 
 const app = createApp(App);
+const pinia = createPinia();
 
 comfyApp.setup().then(() => {
   window["app"] = comfyApp;
@@ -15,7 +27,7 @@ comfyApp.setup().then(() => {
   app
     .use(PrimeVue, {
       theme: {
-        preset: Aura,
+        preset: ComfyUIPreset,
         options: {
           prefix: "p",
           cssLayer: false,
@@ -25,5 +37,8 @@ comfyApp.setup().then(() => {
         },
       },
     })
+    .use(ConfirmationService)
+    .use(ToastService)
+    .use(pinia)
     .mount("#vue-app");
 });