fix: desktop: service worker

package.json

@@ -1,7 +1,7 @@
 {
 	"name": "@filen/web",
 	"private": false,
-	"version": "0.1.78",
+	"version": "0.1.79",
 	"type": "module",
 	"description": "Filen Web & Desktop app",
 	"scripts": {
@@ -23,7 +23,7 @@
 		"@alptugidin/react-circular-progress-bar": "^1.1.2",
 		"@emoji-mart/data": "^1.1.2",
 		"@emoji-mart/react": "^1.1.1",
-		"@filen/desktop": "^3.0.36",
+		"@filen/desktop": "^3.0.38",
 		"@filen/network-drive": "^0.9.38",
 		"@filen/sdk": "^0.1.189",
 		"@filen/sync": "^0.1.91",

src/components/dialogs/previewDialog/index.tsx

@@ -38,6 +38,7 @@ import { cn, isValidFileName } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
 import useErrorToast from "@/hooks/useErrorToast"
 import useIsServiceWorkerOnline from "@/hooks/useIsServiceWorkerOnline"
+import useIsDesktopHTTPServerOnline from "@/hooks/useIsDesktopHTTPServerOnline"
 
 const goToPreviewTypes = ["audio", "docx", "image", "pdf"]
 
@@ -83,6 +84,7 @@ export const PreviewDialog = memo(() => {
 	const location = useLocation()
 	const errorToast = useErrorToast()
 	const isServiceWorkerOnline = useIsServiceWorkerOnline()
+	const isDesktopHTTPServerOnline = useIsDesktopHTTPServerOnline()
 
 	const itemsOrdered = useMemo(() => {
 		if (!open) {
@@ -272,7 +274,7 @@ export const PreviewDialog = memo(() => {
 
 			const previewType = fileNameToPreviewType(itm.name)
 			const maxPreviewSize =
-				isServiceWorkerOnline && itm.type === "file" && isFileStreamable(itm.name, itm.mime)
+				(isServiceWorkerOnline || isDesktopHTTPServerOnline) && itm.type === "file" && isFileStreamable(itm.name, itm.mime)
 					? MAX_PREVIEW_SIZE_SW
 					: MAX_PREVIEW_SIZE_WEB
 
@@ -282,7 +284,7 @@ export const PreviewDialog = memo(() => {
 
 			try {
 				if (
-					isServiceWorkerOnline &&
+					(isServiceWorkerOnline || isDesktopHTTPServerOnline) &&
 					(previewType === "audio" || previewType === "video" || previewType === "image") &&
 					isFileStreamable(itm.name, itm.mime)
 				) {
@@ -333,7 +335,7 @@ export const PreviewDialog = memo(() => {
 				cleanup()
 			}
 		},
-		[cleanup, isServiceWorkerOnline]
+		[cleanup, isServiceWorkerOnline, isDesktopHTTPServerOnline]
 	)
 
 	const saveFile = useCallback(async () => {

src/components/drive/list/item/contextMenu/index.tsx

@@ -57,6 +57,7 @@ import { type WorkerToMainMessage } from "@/lib/worker/types"
 import Input from "@/components/input"
 import useIsServiceWorkerOnline from "@/hooks/useIsServiceWorkerOnline"
 import worker from "@/lib/worker"
+import useIsDesktopHTTPServerOnline from "@/hooks/useIsDesktopHTTPServerOnline"
 
 const iconSize = 16
 
@@ -97,6 +98,7 @@ export const ContextMenu = memo(
 		const successToast = useSuccessToast()
 		const publicLinkURLState = usePublicLinkURLState()
 		const isServiceWorkerOnline = useIsServiceWorkerOnline()
+		const isDesktopHTTPServerOnline = useIsDesktopHTTPServerOnline()
 
 		const isInsidePublicLink = useMemo(() => {
 			return location.includes("/f/") || location.includes("/d/")
@@ -692,7 +694,7 @@ export const ContextMenu = memo(
 		const contextMenuContent = useMemo((): React.ReactNode => {
 			const groups: Record<string, React.ReactNode[]> = {}
 			const maxPreviewSize =
-				isServiceWorkerOnline && item.type === "file" && isFileStreamable(item.name, item.mime)
+				(isServiceWorkerOnline || isDesktopHTTPServerOnline) && item.type === "file" && isFileStreamable(item.name, item.mime)
 					? MAX_PREVIEW_SIZE_SW
 					: MAX_PREVIEW_SIZE_WEB
 
@@ -1091,7 +1093,8 @@ export const ContextMenu = memo(
 			isServiceWorkerOnline,
 			item,
 			manageShareOut,
-			removeShared
+			removeShared,
+			isDesktopHTTPServerOnline
 		])
 
 		useEffect(() => {

src/components/drive/list/item/index.tsx

@@ -28,6 +28,7 @@ import useDriveListColumnSize from "@/hooks/useDriveListColumnSize"
 import { useDoubleTap } from "use-double-tap"
 import useIsMobile from "@/hooks/useIsMobile"
 import useIsServiceWorkerOnline from "@/hooks/useIsServiceWorkerOnline"
+import useIsDesktopHTTPServerOnline from "@/hooks/useIsDesktopHTTPServerOnline"
 
 let draggedItems: DriveCloudItem[] = []
 
@@ -89,6 +90,7 @@ export const ListItem = memo(({ item, index, type }: { item: DriveCloudItem; ind
 	const driveListColumnSize = useDriveListColumnSize()
 	const isMobile = useIsMobile()
 	const isServiceWorkerOnline = useIsServiceWorkerOnline()
+	const isDesktopHTTPServerOnline = useIsDesktopHTTPServerOnline()
 
 	const previewType = useMemo(() => {
 		return fileNameToPreviewType(item.name)
@@ -135,7 +137,7 @@ export const ListItem = memo(({ item, index, type }: { item: DriveCloudItem; ind
 	const onDoubleClick = useCallback(
 		(e?: React.MouseEvent<HTMLDivElement, MouseEvent>) => {
 			const maxPreviewSize =
-				isServiceWorkerOnline && item.type === "file" && isFileStreamable(item.name, item.mime)
+				(isServiceWorkerOnline || isDesktopHTTPServerOnline) && item.type === "file" && isFileStreamable(item.name, item.mime)
 					? MAX_PREVIEW_SIZE_SW
 					: MAX_PREVIEW_SIZE_WEB
 
@@ -191,7 +193,8 @@ export const ListItem = memo(({ item, index, type }: { item: DriveCloudItem; ind
 			navigating,
 			setSearch,
 			isServiceWorkerOnline,
-			triggerMoreIconContextMenu
+			triggerMoreIconContextMenu,
+			isDesktopHTTPServerOnline
 		]
 	)
 

src/components/publicLink/file/file.tsx

@@ -19,8 +19,9 @@ import DocXPreview from "@/components/dialogs/previewDialog/docx"
 import VideoPreview from "@/components/dialogs/previewDialog/video"
 import useIsMobile from "@/hooks/useIsMobile"
 import AudioPreview from "@/components/dialogs/previewDialog/audio"
-import { MAX_PREVIEW_SIZE_WEB, MAX_PREVIEW_SIZE_SW } from "@/constants"
+import { MAX_PREVIEW_SIZE_WEB, MAX_PREVIEW_SIZE_SW, DESKTOP_HTTP_SERVER_PORT } from "@/constants"
 import useIsServiceWorkerOnline from "@/hooks/useIsServiceWorkerOnline"
+import useIsDesktopHTTPServerOnline from "@/hooks/useIsDesktopHTTPServerOnline"
 
 export const File = memo(({ info }: { info?: Omit<FileLinkInfoResponse, "size"> & { size: number } }) => {
 	const filePublicLinkInfo = useFilePublicLinkInfo(info)
@@ -33,6 +34,7 @@ export const File = memo(({ info }: { info?: Omit<FileLinkInfoResponse, "size">
 	const [hidePreview, setHidePreview] = useState<boolean>(false)
 	const isMobile = useIsMobile()
 	const isServiceWorkerOnline = useIsServiceWorkerOnline()
+	const isDesktopHTTPServerOnline = useIsDesktopHTTPServerOnline()
 
 	const downloadEnabled = useMemo(() => {
 		if (!filePublicLinkInfo.status) {
@@ -77,10 +79,10 @@ export const File = memo(({ info }: { info?: Omit<FileLinkInfoResponse, "size">
 			return null
 		}
 
-		return isServiceWorkerOnline && item.type === "file" && isFileStreamable(item.name, item.mime)
+		return (isServiceWorkerOnline || isDesktopHTTPServerOnline) && item.type === "file" && isFileStreamable(item.name, item.mime)
 			? MAX_PREVIEW_SIZE_SW
 			: MAX_PREVIEW_SIZE_WEB
-	}, [isServiceWorkerOnline, item])
+	}, [isServiceWorkerOnline, item, isDesktopHTTPServerOnline])
 
 	const previewType = useMemo(() => {
 		if (!item || urlState.hidePreview) {
@@ -244,7 +246,7 @@ export const File = memo(({ info }: { info?: Omit<FileLinkInfoResponse, "size">
 
 		try {
 			if (
-				isServiceWorkerOnline &&
+				(isServiceWorkerOnline || isDesktopHTTPServerOnline) &&
 				(previewType === "audio" || previewType === "video" || previewType === "image") &&
 				isFileStreamable(item.name, item.mime)
 			) {
@@ -263,7 +265,11 @@ export const File = memo(({ info }: { info?: Omit<FileLinkInfoResponse, "size">
 					"utf-8"
 				).toString("base64")
 
-				setURLObject(`${window.location.origin}/sw/stream?file=${encodeURIComponent(fileBase64)}`)
+				setURLObject(
+					isServiceWorkerOnline
+						? `${window.location.origin}/sw/stream?file=${encodeURIComponent(fileBase64)}`
+						: `http://localhost:${DESKTOP_HTTP_SERVER_PORT}/stream?file=${encodeURIComponent(fileBase64)}`
+				)
 
 				return
 			}
@@ -287,7 +293,7 @@ export const File = memo(({ info }: { info?: Omit<FileLinkInfoResponse, "size">
 		} catch (e) {
 			console.error(e)
 		}
-	}, [item, canLoadItem, maxPreviewSize, isServiceWorkerOnline])
+	}, [item, canLoadItem, maxPreviewSize, isServiceWorkerOnline, isDesktopHTTPServerOnline])
 
 	useEffect(() => {
 		if (item && canLoadItem && !didLoadItemRef.current) {

src/hooks/useIsDesktopHTTPServerOnline.tsx

@@ -8,7 +8,8 @@ export async function isDesktopHTTPServerOnline(): Promise<boolean> {
 				url: `http://localhost:${DESKTOP_HTTP_SERVER_PORT}/ping`,
 				expectedStatusCode: 200,
 				method: "GET",
-				timeout: 5000
+				timeout: 5000,
+				expectedBodyText: "pong"
 			})
 		: false
 }

src/hooks/useIsServiceWorkerOnline.ts

@@ -1,14 +1,17 @@
 import worker from "@/lib/worker"
 import { useQuery } from "@tanstack/react-query"
+import { IS_DESKTOP } from "@/constants"
 
 export async function isServiceWorkerOnline(): Promise<boolean> {
-	return await worker.httpHealthCheck({
-		url: `${window.origin}/sw/ping`,
-		expectedStatusCode: 200,
-		method: "GET",
-		timeout: 5000,
-		expectedBodyText: "OK"
-	})
+	return IS_DESKTOP
+		? false
+		: await worker.httpHealthCheck({
+				url: `${window.origin}/sw/ping`,
+				expectedStatusCode: 200,
+				method: "GET",
+				timeout: 5000,
+				expectedBodyText: "OK"
+			})
 }
 
 export default function useIsServiceWorkerOnline(): boolean {

src/lib/setup.ts

@@ -244,7 +244,7 @@ export async function setup(config?: FilenSDKConfig, connectToSocket: boolean =
 	await Promise.allSettled([
 		setItem(sdkConfigLocalStorageKey, initConfig),
 		setItem(desktopConfigLocalStorageKey, desktopConfig),
-		registerServiceWorker()
+		IS_DESKTOP ? Promise.resolve() : registerServiceWorker()
 	]).catch(console.error)
 
 	await Promise.all([worker.initializeSDK(initConfig), IS_DESKTOP ? window.desktopAPI.setConfig(desktopConfig) : Promise.resolve()])