Add notifications to greet screen

src/App.ts

@@ -49,6 +49,7 @@ import { InformationWindow } from '/@/components/Windows/Common/Information/Info
 import { BottomPanel } from '/@/components/BottomPanel/BottomPanel'
 import { SolidWindowManager } from './components/Solid/Window/Manager'
 import { setupActions } from './components/Actions/Actions'
+import { createNotification } from './components/Notifications/create'
 
 if (import.meta.env.VITE_IS_TAURI_APP) {
 	// Import Tauri updater for native builds
@@ -275,10 +276,7 @@ export class App {
 			`--- Running bridge. ${appVersion} on a "${platform()}" machine ---`
 		)
 		console.time('[APP] beforeStartUp()')
-		// @ts-expect-error
-		if (navigator.clearAppBadge)
-			// @ts-expect-error
-			navigator.clearAppBadge()
+		if (navigator.clearAppBadge) navigator.clearAppBadge()
 
 		setupSidebar()
 		setupDefaultMenus(this)

src/components/Greet/Greet.vue

@@ -3,7 +3,7 @@
 		<div class="d-flex flex-column projects-container">
 			<Logo
 				style="height: 160px; width: 160px"
-				class="ml-auto mr-auto mb-24 -mt-24"
+				class="ml-auto mr-auto mb-20 -mt-36"
 				alt="Logo of bridge. v2"
 			/>
 
@@ -172,16 +172,54 @@
 					{{ t('windows.settings.general.selectBridgeFolder.name') }}
 				</p>
 			</div>
+
+			<div class="flex">
+				<SidebarButton
+					v-for="notification in NotificationStore"
+					v-if="notification.isVisible"
+					:key="notification.id"
+					:displayName="notification.message"
+					:icon="notification.icon"
+					:color="notification.color"
+					:iconColor="notification.textColor"
+					@click="notification.onClick()"
+					@middleClick="notification.onMiddleClick()"
+				/>
+
+				<SidebarButton
+					v-for="(task, i) in tasks"
+					:key="`${i}`"
+					:displayName="task.name"
+					:icon="task.icon"
+					color="primary"
+					isLoading
+					alwaysAllowClick
+					@click="task.createWindow()"
+				>
+					<v-progress-circular
+						rotate="-90"
+						size="24"
+						width="2"
+						color="white"
+						:indeterminate="task.progress === undefined"
+						:value="task.progress"
+					/>
+				</SidebarButton>
+			</div>
 		</div>
 	</main>
 </template>
 
 <script setup lang="ts">
 import Logo from '/@/components/UIElements/Logo.vue'
+import SidebarButton from '/@/components/Sidebar/Button.vue'
+
 import { App } from '/@/App'
 import { computed, onMounted, onUnmounted, Ref, ref } from 'vue'
 import { useTranslations } from '/@/components/Composables/useTranslations'
 import { isUsingFileSystemPolyfill } from '/@/components/FileSystem/Polyfill'
+import { NotificationStore } from '/@/components/Notifications/state'
+import { tasks } from '/@/components/TaskManager/TaskManager'
 
 const tauri = import.meta.env.VITE_IS_TAURI_APP
 
@@ -267,6 +305,10 @@ async function pin(project: any) {
 	await saveProjects()
 }
 
+const hasVisibleNotifications = computed(() => {
+	return Object.values(NotificationStore).some(({ isVisible }) => isVisible)
+})
+
 onMounted(async () => {
 	loadProjects()
 

src/components/Notifications/Notification.ts

@@ -16,7 +16,7 @@ export interface INotificationConfig {
 }
 
 export class Notification {
-	protected id: string
+	public id: string
 	protected _isVisible: boolean = false
 
 	constructor(protected config: INotificationConfig) {
@@ -69,9 +69,7 @@ export class Notification {
 	}
 
 	protected updateAppBadge() {
-		// @ts-expect-error
 		if (typeof navigator.setAppBadge === 'function')
-			// @ts-expect-error
 			navigator.setAppBadge(
 				Object.values(NotificationStore).filter(
 					({ isVisible }) => isVisible

src/components/Sidebar/Button.vue

@@ -14,6 +14,7 @@
 					transform: isSelected ? 'scale(1.1)' : undefined,
 					cursor: canInteractWith ? 'pointer' : undefined,
 					height: smallerSidebarElements ? `34px` : `40px`,
+					width: smallerSidebarElements ? `34px` : `40px`,
 				}"
 				:class="{
 					loading: isLoading,