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

packages/ui/src/components/base/Avatar.vue

@@ -35,10 +35,10 @@
 </template>
 
 <script setup>
-import { ref } from "vue";
+import { ref } from 'vue'
 
-const pixelated = ref(false);
-const img = ref(null);
+const pixelated = ref(false)
+const img = ref(null)
 
 defineProps({
   src: {
@@ -47,13 +47,13 @@ defineProps({
   },
   alt: {
     type: String,
-    default: "",
+    default: '',
   },
   size: {
     type: String,
-    default: "sm",
+    default: 'sm',
     validator(value) {
-      return ["xxs", "xs", "sm", "md", "lg", "none"].includes(value);
+      return ['xxs', 'xs', 'sm', 'md', 'lg', 'none'].includes(value)
     },
   },
   circle: {
@@ -66,16 +66,16 @@ defineProps({
   },
   loading: {
     type: String,
-    default: "lazy",
+    default: 'lazy',
   },
   raised: {
     type: Boolean,
     default: false,
   },
-});
+})
 
 function updatePixelated() {
-  pixelated.value = Boolean(img.value && img.value.naturalWidth && img.value.naturalWidth <= 96);
+  pixelated.value = Boolean(img.value && img.value.naturalWidth && img.value.naturalWidth <= 96)
 }
 </script>
 

packages/ui/src/components/base/Button.vue

@@ -46,7 +46,7 @@ const props = defineProps({
 })
 
 const accentedButton = computed(() =>
-  ['danger', 'primary', 'red', 'orange', 'green', 'blue', 'purple', 'gray'].includes(props.color)
+  ['danger', 'primary', 'red', 'orange', 'green', 'blue', 'purple', 'gray'].includes(props.color),
 )
 </script>
 

packages/ui/src/components/base/Card.vue

@@ -13,7 +13,7 @@ const props = withDefaults(
     collapsible: false,
     defaultCollapsed: false,
     noAutoBody: false,
-  }
+  },
 )
 
 const state = reactive({

packages/ui/src/components/base/Checkbox.vue

@@ -46,7 +46,7 @@ const props = withDefaults(
     modelValue: false,
     clickEvent: () => {},
     collapsingToggleStyle: false,
-  }
+  },
 )
 
 function toggle() {
@@ -89,7 +89,9 @@ function toggle() {
   color: var(--color-contrast);
   background-color: var(--color-button-bg);
   border-radius: var(--radius-xs);
-  box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+  box-shadow:
+    var(--shadow-inset-sm),
+    0 0 0 0 transparent;
 
   &.checked {
     background-color: var(--color-brand);

packages/ui/src/components/base/Chips.vue

@@ -95,7 +95,9 @@ export default defineComponent({
   .selected {
     color: var(--color-contrast);
     background-color: var(--color-brand-highlight);
-    box-shadow: inset 0 0 0 transparent, 0 0 0 2px var(--color-brand);
+    box-shadow:
+      inset 0 0 0 transparent,
+      0 0 0 2px var(--color-brand);
   }
 }
 </style>

packages/ui/src/components/base/CopyCode.vue

@@ -39,7 +39,10 @@ async function copyText() {
   width: min-content;
   border-radius: 10px;
   user-select: text;
-  transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, transform 0.05s ease-in-out,
+  transition:
+    opacity 0.5s ease-in-out,
+    filter 0.2s ease-in-out,
+    transform 0.05s ease-in-out,
     outline 0.2s ease-in-out;
 
   @media (prefers-reduced-motion) {

packages/ui/src/components/base/DropArea.vue

@@ -21,7 +21,7 @@ const props = withDefaults(
   }>(),
   {
     accept: '*',
-  }
+  },
 )
 
 const emit = defineEmits(['change'])
@@ -77,7 +77,9 @@ onMounted(() => {
   z-index: 10;
   visibility: hidden;
   background-color: hsla(0, 0%, 0%, 0.5);
-  transition: visibility 0.2s ease-in-out, background-color 0.1s ease-in-out;
+  transition:
+    visibility 0.2s ease-in-out,
+    background-color 0.1s ease-in-out;
   display: flex;
   &::before {
     --indent: 4rem;

packages/ui/src/components/base/DropdownSelect.vue

@@ -125,7 +125,7 @@ watch(
   () => props.modelValue,
   (newValue) => {
     selectedValue.value = newValue
-  }
+  },
 )
 
 const toggleDropdown = () => {
@@ -212,7 +212,9 @@ const isChildOfDropdown = (element) => {
     cursor: pointer;
     user-select: none;
     border-radius: var(--radius-md);
-    box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+    box-shadow:
+      var(--shadow-inset-sm),
+      0 0 0 0 transparent;
 
     transition: 0.05s;
 
@@ -253,7 +255,9 @@ const isChildOfDropdown = (element) => {
     z-index: 10;
     max-height: 18.75rem;
     overflow-y: auto;
-    box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+    box-shadow:
+      var(--shadow-inset-sm),
+      0 0 0 0 transparent;
 
     .option {
       background-color: var(--color-button-bg);

packages/ui/src/components/base/Notifications.vue

@@ -28,7 +28,7 @@ defineExpose({
       (x) =>
         x.text === notification.text &&
         x.title === notification.title &&
-        x.type === notification.type
+        x.type === notification.type,
     )
     if (existingNotif) {
       setNotificationTimer(existingNotif)

packages/ui/src/components/base/OverflowMenu.vue

@@ -47,8 +47,8 @@
 
 <script setup>
 import { ref } from 'vue'
-import Button from "./Button.vue"
-import PopoutMenu from "./PopoutMenu.vue"
+import Button from './Button.vue'
+import PopoutMenu from './PopoutMenu.vue'
 
 defineProps({
   options: {

packages/ui/src/components/base/Pagination.vue

@@ -67,7 +67,7 @@ const props = withDefaults(
     page: 1,
     count: 1,
     linkFunction: (page: number) => void page,
-  }
+  },
 )
 
 const pages = computed(() => {
@@ -116,7 +116,10 @@ a {
   background: var(--color-raised-bg);
   cursor: pointer;
 
-  transition: opacity 0.5s ease-in-out, filter 0.2s ease-in-out, transform 0.05s ease-in-out,
+  transition:
+    opacity 0.5s ease-in-out,
+    filter 0.2s ease-in-out,
+    transform 0.05s ease-in-out,
     outline 0.2s ease-in-out;
 
   @media (prefers-reduced-motion) {

packages/ui/src/components/base/PopoutMenu.vue

@@ -102,8 +102,13 @@ onBeforeUnmount(() => {
     box-shadow: var(--shadow-floating);
     z-index: 10;
     opacity: 0;
-    transition: bottom 0.125s ease-in-out, top 0.125s ease-in-out, left 0.125s ease-in-out,
-      right 0.125s ease-in-out, opacity 0.125s ease-in-out, scale 0.125s ease-in-out;
+    transition:
+      bottom 0.125s ease-in-out,
+      top 0.125s ease-in-out,
+      left 0.125s ease-in-out,
+      right 0.125s ease-in-out,
+      opacity 0.125s ease-in-out,
+      scale 0.125s ease-in-out;
 
     @media (prefers-reduced-motion) {
       transition: none !important;

packages/ui/src/components/base/ProjectCard.vue

@@ -80,7 +80,6 @@ import EnvironmentIndicator from './EnvironmentIndicator.vue'
 </script>
 
 <script>
-
 dayjs.extend(relativeTime)
 export default defineComponent({
   props: {
@@ -200,7 +199,7 @@ export default defineComponent({
       const b = color & 0xff
       const g = (color & 0xff00) >>> 8
       const r = (color & 0xff0000) >>> 16
-      return `rgba(${  [r, g, b, 1].join(',')  })`
+      return `rgba(${[r, g, b, 1].join(',')})`
     },
     createdDate() {
       return dayjs(this.createdAt).format('MMMM D, YYYY [at] h:mm:ss A')
@@ -301,7 +300,9 @@ export default defineComponent({
     img,
     svg {
       border-radius: var(--radius-lg);
-      box-shadow: -2px -2px 0 2px var(--color-raised-bg), 2px -2px 0 2px var(--color-raised-bg);
+      box-shadow:
+        -2px -2px 0 2px var(--color-raised-bg),
+        2px -2px 0 2px var(--color-raised-bg);
     }
   }
 

packages/ui/src/components/base/Promotion.vue

@@ -35,7 +35,7 @@ const props = withDefaults(
   {
     external: true,
     queryParam: '',
-  }
+  },
 )
 
 const target = computed(() => (props.external ? '_blank' : '_self'))

packages/ui/src/components/chart/Chart.vue

@@ -6,7 +6,6 @@ import { defineAsyncComponent, ref } from 'vue'
 import Button from '../base/Button.vue'
 import Checkbox from '../base/Checkbox.vue'
 
-
 const VueApexCharts = defineAsyncComponent(() => import('vue3-apexcharts'))
 
 const props = defineProps({
@@ -138,23 +137,22 @@ const chartOptions = ref({
     },
   },
   tooltip: {
-    custom ({ series, seriesIndex, dataPointIndex, w }) {
+    custom({ series, seriesIndex, dataPointIndex, w }) {
       console.log(seriesIndex, w)
       return (
         `<div class="bar-tooltip">` +
         `<div class="seperated-entry title">` +
-        `<div class="label">${
-        props.formatLabels(w.globals.lastXAxis.categories[dataPointIndex])
-        }</div>${
-        !props.hideTotal
-          ? `<div class="value">
+        `<div class="label">${props.formatLabels(
+          w.globals.lastXAxis.categories[dataPointIndex],
+        )}</div>${
+          !props.hideTotal
+            ? `<div class="value">
         ${props.prefix}
         ${formatNumber(series.reduce((a, b) => a + b[dataPointIndex], 0).toString(), false)}
         ${props.suffix}
         </div>`
-          : ``
-        }</div><hr class="card-divider" />${
-        series
+            : ``
+        }</div><hr class="card-divider" />${series
           .map((value, index) =>
             value[dataPointIndex] > 0
               ? `<div class="list-entry">
@@ -168,11 +166,10 @@ const chartOptions = ref({
                   ${props.suffix}
                 </div>
               </div>`
-              : ''
+              : '',
           )
           .reverse()
-          .reduce((a, b) => a + b)
-        }</div>`
+          .reduce((a, b) => a + b)}</div>`
       )
     },
   },
@@ -183,7 +180,7 @@ const chart = ref(null)
 const legendValues = ref(
   [...props.data].map((project, index) => {
     return { name: project.name, visible: true, color: props.colors[index] }
-  })
+  }),
 )
 
 const flipLegend = (legend, newVal) => {
@@ -192,11 +189,9 @@ const flipLegend = (legend, newVal) => {
 }
 
 const downloadCSV = () => {
-  const csvContent =
-    `data:text/csv;charset=utf-8,${
-    props.labels.join(',')
-    }\n${
-    props.data.map((project) => project.data.join(',')).reduce((a, b) => `${a  }\n${  b}`)}`
+  const csvContent = `data:text/csv;charset=utf-8,${props.labels.join(',')}\n${props.data
+    .map((project) => project.data.join(','))
+    .reduce((a, b) => `${a}\n${b}`)}`
 
   const encodedUri = encodeURI(csvContent)
   const link = document.createElement('a')

packages/ui/src/components/chart/CompactChart.vue

@@ -109,7 +109,6 @@ const chartOptions = ref({
   },
   tooltip: {
     custom({ series, seriesIndex, dataPointIndex, w }) {
-       
       console.log(seriesIndex, w)
       return `<div class="bar-tooltip">${series
         .map((value) =>
@@ -128,7 +127,7 @@ const chartOptions = ref({
                   ${props.suffix}
                 </div>
               </div>`
-            : ''
+            : '',
         )
         .reverse()
         .reduce((a, b) => a + b)}</div>`

packages/ui/src/components/modal/ShareModal.vue

@@ -50,7 +50,7 @@ const share = () => {
       : {
           title: props.shareTitle.toString(),
           text: content.value,
-        }
+        },
   )
 }
 
@@ -87,19 +87,20 @@ const sendEmail = computed(
   () =>
     `mailto:user@test.com
     ?subject=${encodeURIComponent(props.shareTitle)}
-    &body=${  encodeURIComponent(content.value)}`
+    &body=${encodeURIComponent(content.value)}`,
 )
 
 const sendTweet = computed(
-  () => `https://twitter.com/intent/tweet?text=${  encodeURIComponent(content.value)}`
+  () => `https://twitter.com/intent/tweet?text=${encodeURIComponent(content.value)}`,
 )
 
-const sendToot = computed(() => `https://tootpick.org/#text=${  encodeURIComponent(content.value)}`)
+const sendToot = computed(() => `https://tootpick.org/#text=${encodeURIComponent(content.value)}`)
 
 const postOnReddit = computed(
   () =>
-    `https://www.reddit.com/submit?title=${encodeURIComponent(props.shareTitle)}&text=${ 
-    encodeURIComponent(content.value)}`
+    `https://www.reddit.com/submit?title=${encodeURIComponent(props.shareTitle)}&text=${encodeURIComponent(
+      content.value,
+    )}`,
 )
 
 defineExpose({

packages/ui/src/components/nav/NavRow.vue

@@ -81,7 +81,7 @@ export default {
     pickLink() {
       this.activeIndex = this.query
         ? this.filteredLinks.findIndex(
-            (x) => (x.href === '' ? undefined : x.href) === this.$route.path[this.query]
+            (x) => (x.href === '' ? undefined : x.href) === this.$route.path[this.query],
           )
         : this.filteredLinks.findIndex((x) => x.href === decodeURIComponent(this.$route.path))
 

packages/ui/src/components/search/SearchDropdown.vue

@@ -130,7 +130,7 @@ const selectOption = (option) => {
 const onFocus = () => {
   if (!props.disabled) {
     focusedOptionIndex.value = props.options.findIndex(
-      (option) => option === props.modelValue.value
+      (option) => option === props.modelValue.value,
     )
     dropdownVisible.value = true
   }
@@ -197,7 +197,9 @@ const isChildOfDropdown = (element) => {
     cursor: pointer;
     user-select: none;
     border-radius: var(--radius-md);
-    box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent;
+    box-shadow:
+      var(--shadow-inset-sm),
+      0 0 0 0 transparent;
 
     &.disabled {
       cursor: not-allowed;
@@ -315,7 +317,9 @@ const isChildOfDropdown = (element) => {
 }
 
 .text-input {
-  box-shadow: var(--shadow-inset-sm), 0 0 0 0 transparent !important;
+  box-shadow:
+    var(--shadow-inset-sm),
+    0 0 0 0 transparent !important;
   width: 100%;
 
   transition: 0.05s;

packages/ui/src/vue-shims.d.ts

@@ -1,6 +1,6 @@
 declare module '*.vue' {
-  import { defineComponent } from 'vue';
+  import { defineComponent } from 'vue'
 
-  const component: ReturnType<typeof defineComponent>;
-  export default component;
+  const component: ReturnType<typeof defineComponent>
+  export default component
 }