add update notification to sidebar, fix aborted requests on navigate

resources/js/Components/UpdateSidebarNotification.vue

@@ -0,0 +1,46 @@
+<script setup lang="ts">
+import { BellAlertIcon, XMarkIcon } from '@heroicons/vue/20/solid';
+import { SecondaryButton } from '@/packages/ui/src';
+import { useStorage } from '@vueuse/core';
+const showReleaseInfo = useStorage('showReleaseInfo-desktop', true);
+
+function openDesktopGithubRepo() {
+    window
+        .open('https://github.com/solidtime-io/solidtime-desktop', '_blank')
+        ?.focus();
+}
+</script>
+
+<template>
+    <div class="py-4 hidden lg:block" v-if="showReleaseInfo">
+        <div
+            class="rounded-lg px-2.5 py-2 bg-card-background border border-border-secondary">
+            <div class="flex items-start justify-between">
+                <div
+                    class="text-xs pb-1.5 font-semibold text-text-tertiary flex items-center space-x-1">
+                    <BellAlertIcon class="w-3.5"></BellAlertIcon>
+                    <span> New Update </span>
+                </div>
+                <button>
+                    <XMarkIcon
+                        @click="showReleaseInfo = false"
+                        class="w-3.5 text-text-tertiary hover:text-text-secondary"></XMarkIcon>
+                </button>
+            </div>
+
+            <p class="text-xs">
+                <span class="font-semibold">Solidtime Desktop Beta</span> is
+                here! Test our brand new clients for Windows, macOS and Linux
+                now.
+            </p>
+            <SecondaryButton
+                @click="openDesktopGithubRepo"
+                size="small"
+                class="w-full text-center justify-center mt-1.5"
+                >Download now</SecondaryButton
+            >
+        </div>
+    </div>
+</template>
+
+<style scoped></style>