[ENG-1723] better sync status (#2299)

* better sync status

* cleanup

core/src/api/sync.rs

@@ -78,15 +78,26 @@ pub(crate) fn mount() -> AlphaRouter<Ctx> {
 		.procedure("active", {
 			R.with2(library())
 				.subscription(|(_, library), _: ()| async move {
+					#[derive(serde::Serialize, specta::Type)]
+					#[specta(rename = "SyncStatus")]
+					struct Data {
+						ingest: bool,
+						cloud_send: bool,
+						cloud_receive: bool,
+						cloud_ingest: bool,
+					}
+
 					async_stream::stream! {
 						let cloud_sync = &library.cloud.sync;
 						let sync = &library.sync.shared;
 
 						loop {
-							yield sync.active.load(Ordering::Relaxed)
-								|| cloud_sync.send_active.load(Ordering::Relaxed)
-								|| cloud_sync.receive_active.load(Ordering::Relaxed)
-								|| cloud_sync.ingest_active.load(Ordering::Relaxed);
+							yield Data {
+							  ingest: sync.active.load(Ordering::Relaxed),
+								cloud_send: cloud_sync.send_active.load(Ordering::Relaxed),
+								cloud_receive: cloud_sync.receive_active.load(Ordering::Relaxed),
+								cloud_ingest: cloud_sync.ingest_active.load(Ordering::Relaxed),
+							};
 
 							tokio::select! {
 								_ = cloud_sync.notifier.notified() => {},

interface/app/$libraryId/Layout/Sidebar/SidebarLayout/Footer.tsx

@@ -1,12 +1,15 @@
+import { inferSubscriptionResult } from '@oscartbeaumont-sd/rspc-client';
 import { Gear } from '@phosphor-icons/react';
 import { useState } from 'react';
 import { useNavigate } from 'react-router';
 import {
 	JobManagerContextProvider,
 	LibraryContextProvider,
+	Procedures,
 	useClientContext,
 	useDebugState,
-	useLibrarySubscription
+	useLibrarySubscription,
+	useUnsafeStreamedQuery
 } from '@sd/client';
 import { Button, ButtonLink, Popover, Tooltip, usePopover } from '@sd/ui';
 import { useKeysMatcher, useLocale, useShortcut } from '~/hooks';
@@ -115,10 +118,10 @@ export default () => {
 };
 
 function SyncStatusIndicator() {
-	const [syncing, setSyncing] = useState(false);
+	const [status, setStatus] = useState<inferSubscriptionResult<Procedures, 'sync.active'>>();
 
 	useLibrarySubscription(['sync.active'], {
-		onData: setSyncing
+		onData: setStatus
 	});
 
 	return null;

packages/client/src/core.ts

@@ -138,7 +138,7 @@ export type Procedures = {
         { key: "notifications.listen", input: never, result: Notification } | 
         { key: "p2p.events", input: never, result: P2PEvent } | 
         { key: "search.ephemeralPaths", input: LibraryArgs<EphemeralPathSearchArgs>, result: EphemeralPathsResultItem } | 
-        { key: "sync.active", input: LibraryArgs<null>, result: boolean } | 
+        { key: "sync.active", input: LibraryArgs<null>, result: SyncStatus } | 
         { key: "sync.newMessage", input: LibraryArgs<null>, result: null }
 };
 
@@ -598,6 +598,8 @@ export type Statistics = { id: number; date_captured: string; total_object_count
 
 export type StatisticsResponse = { statistics: Statistics | null }
 
+export type SyncStatus = { ingest: boolean; cloud_send: boolean; cloud_receive: boolean; cloud_ingest: boolean }
+
 export type SystemLocations = { desktop: string | null; documents: string | null; downloads: string | null; pictures: string | null; music: string | null; videos: string | null }
 
 export type Tag = { id: number; pub_id: number[]; name: string | null; color: string | null; is_hidden: boolean | null; date_created: string | null; date_modified: string | null }