Monorepo missing features (#1273)

* fix tauri config

* fix package patch

* regen pnpm lock

* use new workflow

* New GH actions

* Update lockfile

* update scripts

* Fix build script

* Fix missing deps

* Fix assets eslint

* Update libraries lint

* Fix all lint configs

* update lockfile

* add fmt + clippy fails

* Separate App Tauri portion

* fix app features

* Fix lints

* install tauri cli

* update lockfile

* corepack, fix lints

* add store path

* fix unused import

* Fix tests

* Issue templates + port over tauri release

* fix actions

* fix before build command

* Add X86 target

* Update build matrix

* finalize actions

* make debug build smaller

* Use debug build to make cache smaller

* dummy commit

* change proj name

* update file name

* Use release builds for less space use

* Remove rust cache

* Readd for app build

* add merge queue trigger

apps/app-frontend/src/store/breadcrumbs.js

@@ -0,0 +1,36 @@
+import { defineStore } from 'pinia'
+
+export const useBreadcrumbs = defineStore('breadcrumbsStore', {
+  state: () => ({
+    names: new Map(),
+    context: null,
+    rootContext: null,
+  }),
+  actions: {
+    getName(route) {
+      return this.names.get(route) ?? ''
+    },
+    setName(route, title) {
+      this.names.set(route, title)
+    },
+    // resets breadcrumbs to only included ones as to not have stale breadcrumbs
+    resetToNames(breadcrumbs) {
+      // names is an array of every breadcrumb.name that starts with a ?
+      const names = breadcrumbs
+        .filter((breadcrumb) => breadcrumb.name.charAt(0) === '?')
+        .map((breadcrumb) => breadcrumb.name.slice(1))
+      // remove all names that are not in the names array
+      for (const [route] of this.names) {
+        if (!names.includes(route)) {
+          this.names.delete(route)
+        }
+      }
+    },
+    setContext(context) {
+      this.context = context
+    },
+    setRootContext(context) {
+      this.rootContext = context
+    },
+  },
+})

apps/app-frontend/src/store/error.js

@@ -0,0 +1,21 @@
+import { defineStore } from 'pinia'
+
+export const useError = defineStore('errorsStore', {
+  state: () => ({
+    errorModal: null,
+  }),
+  actions: {
+    setErrorModal(ref) {
+      this.errorModal = ref
+    },
+    showError(error) {
+      this.errorModal.show(error)
+    },
+  },
+})
+
+export const handleSevereError = (err) => {
+  const error = useError()
+  error.showError(err)
+  console.error(err)
+}

apps/app-frontend/src/store/loading.js

@@ -0,0 +1,13 @@
+import { defineStore } from 'pinia'
+
+export const useLoading = defineStore('loadingStore', {
+  state: () => ({ loading: false }),
+  actions: {
+    startLoading() {
+      this.loading = true
+    },
+    stopLoading() {
+      this.loading = false
+    },
+  },
+})

apps/app-frontend/src/store/notifications.js

@@ -0,0 +1,29 @@
+import { defineStore } from 'pinia'
+
+export const useNotifications = defineStore('notificationsStore', {
+  state: () => ({
+    notificationsWrapper: null,
+  }),
+  actions: {
+    setNotifs(notifs) {
+      this.notificationsWrapper = notifs
+    },
+    addNotification(notif) {
+      this.notificationsWrapper.addNotification(notif)
+    },
+  },
+})
+
+export const handleError = (err) => {
+  const notifs = useNotifications()
+  notifs.addNotification({
+    title: 'An error occurred',
+    text: err.message ?? err,
+    type: 'error',
+  })
+  console.error(err)
+}
+
+export const handleMixpanelError = (err) => {
+  console.error(err)
+}

apps/app-frontend/src/store/state.js

@@ -0,0 +1,6 @@
+import { useTheming } from './theme'
+import { useBreadcrumbs } from './breadcrumbs'
+import { useLoading } from './loading'
+import { useNotifications, handleError } from './notifications'
+
+export { useTheming, useBreadcrumbs, useLoading, useNotifications, handleError }

apps/app-frontend/src/store/theme.js

@@ -0,0 +1,23 @@
+import { defineStore } from 'pinia'
+
+export const useTheming = defineStore('themeStore', {
+  state: () => ({
+    themeOptions: ['dark', 'light', 'oled'],
+    advancedRendering: true,
+    selectedTheme: 'dark',
+  }),
+  actions: {
+    setThemeState(newTheme) {
+      if (this.themeOptions.includes(newTheme)) this.selectedTheme = newTheme
+      else console.warn('Selected theme is not present. Check themeOptions.')
+
+      this.setThemeClass()
+    },
+    setThemeClass() {
+      for (const theme of this.themeOptions) {
+        document.getElementsByTagName('html')[0].classList.remove(`${theme}-mode`)
+      }
+      document.getElementsByTagName('html')[0].classList.add(`${this.selectedTheme}-mode`)
+    },
+  },
+})