From ba879b954cac51e42adce2697b0ddd006f854a20 Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Wed, 19 Feb 2025 10:03:39 +0100 Subject: [PATCH 1/8] Add notification when the preview site is created --- src/hooks/use-archive-site.ts | 14 +++++++++++++- src/ipc-types.d.ts | 1 + 2 files changed, 14 insertions(+), 1 deletion(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index c7437e3b0..2912998be 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -48,6 +48,17 @@ export function useArchiveSite() { ...snapshot, isLoading: false, } ); + + // Show notification only when site is actually ready + await getIpcApi().showNotification( { + title: __( 'Preview created' ), + body: snapshot.localSiteName + ? sprintf( + __( "Preview site for '%s' has been created." ), + snapshot.localSiteName + ) + : __( 'Preview site has been created.' ), + } ); } } catch ( error ) { updateSnapshot( { @@ -61,7 +72,7 @@ export function useArchiveSite() { return () => { clearInterval( intervalId ); }; - }, [ client, snapshots, updateSnapshot ] ); + }, [ __, client, snapshots, updateSnapshot ] ); const getNextSequenceNumber = ( siteId: string, @@ -171,6 +182,7 @@ export function useArchiveSite() { ), sequence: nextSequence, userId: user.id, + localSiteName: selectedSite?.name, } ); } catch ( error ) { if ( isWpcomNetworkError( error ) ) { diff --git a/src/ipc-types.d.ts b/src/ipc-types.d.ts index 5d137151e..1c6fa324d 100644 --- a/src/ipc-types.d.ts +++ b/src/ipc-types.d.ts @@ -50,6 +50,7 @@ interface Snapshot { name?: string; sequence?: number; userId?: number; + localSiteName?: string; } type InstalledApps = { From c3ae74fd8e6568dab7852effdd1f894f80034bfd Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Wed, 19 Feb 2025 11:08:29 +0100 Subject: [PATCH 2/8] Cleanup comments --- src/hooks/use-archive-site.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index 2912998be..f88d656e0 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -49,7 +49,6 @@ export function useArchiveSite() { isLoading: false, } ); - // Show notification only when site is actually ready await getIpcApi().showNotification( { title: __( 'Preview created' ), body: snapshot.localSiteName From c5b7b083a6be30e3cb617a5f139826b3f307ad94 Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Wed, 19 Feb 2025 15:24:40 +0100 Subject: [PATCH 3/8] Ensure the notification is shown once --- src/hooks/use-archive-site.ts | 26 ++++++++++++++++---------- 1 file changed, 16 insertions(+), 10 deletions(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index f88d656e0..220e908cc 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -32,6 +32,9 @@ export function useArchiveSite() { if ( loadingSnapshots.length === 0 ) { return; } + + let activeSnapshot: Snapshot | null = null; + const intervalId = setInterval( async () => { for ( const snapshot of loadingSnapshots ) { if ( snapshot.isLoading ) { @@ -48,16 +51,7 @@ export function useArchiveSite() { ...snapshot, isLoading: false, } ); - - await getIpcApi().showNotification( { - title: __( 'Preview created' ), - body: snapshot.localSiteName - ? sprintf( - __( "Preview site for '%s' has been created." ), - snapshot.localSiteName - ) - : __( 'Preview site has been created.' ), - } ); + activeSnapshot = snapshot; } } catch ( error ) { updateSnapshot( { @@ -70,6 +64,18 @@ export function useArchiveSite() { }, 3000 ); return () => { clearInterval( intervalId ); + if ( activeSnapshot ) { + console.log( 'Showing notification...' ); + getIpcApi().showNotification( { + title: __( 'Preview created' ), + body: activeSnapshot.localSiteName + ? sprintf( + __( "Preview site for '%s' has been created." ), + activeSnapshot.localSiteName + ) + : __( 'Preview site has been created.' ), + } ); + } }; }, [ __, client, snapshots, updateSnapshot ] ); From fdfa53beb34336d6399a9a24899957248b2d365f Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Wed, 19 Feb 2025 15:28:20 +0100 Subject: [PATCH 4/8] Cleanup console logs --- src/hooks/use-archive-site.ts | 1 - 1 file changed, 1 deletion(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index 220e908cc..7056cdc21 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -65,7 +65,6 @@ export function useArchiveSite() { return () => { clearInterval( intervalId ); if ( activeSnapshot ) { - console.log( 'Showing notification...' ); getIpcApi().showNotification( { title: __( 'Preview created' ), body: activeSnapshot.localSiteName From 8228e476ab8d4d19485b36a9c516c7434ad2f2ae Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Wed, 19 Feb 2025 15:34:27 +0100 Subject: [PATCH 5/8] Simplify notification --- src/hooks/use-archive-site.ts | 12 +++++------- 1 file changed, 5 insertions(+), 7 deletions(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index 7056cdc21..efd6a3998 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -66,13 +66,11 @@ export function useArchiveSite() { clearInterval( intervalId ); if ( activeSnapshot ) { getIpcApi().showNotification( { - title: __( 'Preview created' ), - body: activeSnapshot.localSiteName - ? sprintf( - __( "Preview site for '%s' has been created." ), - activeSnapshot.localSiteName - ) - : __( 'Preview site has been created.' ), + title: activeSnapshot.localSiteName, + body: sprintf( + __( "Preview site for '%s' has been created." ), + activeSnapshot.localSiteName + ), } ); } }; From 76b67a7978efab7615e78a6e7f12cfbd5d17bec9 Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Thu, 20 Feb 2025 09:53:25 +0100 Subject: [PATCH 6/8] Update notification to pass preview site name and url --- src/hooks/use-archive-site.ts | 8 ++------ src/ipc-types.d.ts | 1 - 2 files changed, 2 insertions(+), 7 deletions(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index efd6a3998..75b5ad5d1 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -66,11 +66,8 @@ export function useArchiveSite() { clearInterval( intervalId ); if ( activeSnapshot ) { getIpcApi().showNotification( { - title: activeSnapshot.localSiteName, - body: sprintf( - __( "Preview site for '%s' has been created." ), - activeSnapshot.localSiteName - ), + title: activeSnapshot.name, + body: sprintf( __( "Preview site '%s' has been created." ), activeSnapshot.url ), } ); } }; @@ -184,7 +181,6 @@ export function useArchiveSite() { ), sequence: nextSequence, userId: user.id, - localSiteName: selectedSite?.name, } ); } catch ( error ) { if ( isWpcomNetworkError( error ) ) { diff --git a/src/ipc-types.d.ts b/src/ipc-types.d.ts index 1c6fa324d..5d137151e 100644 --- a/src/ipc-types.d.ts +++ b/src/ipc-types.d.ts @@ -50,7 +50,6 @@ interface Snapshot { name?: string; sequence?: number; userId?: number; - localSiteName?: string; } type InstalledApps = { From 5b767ea5f3b782fc2c9f6d5f48f44c110488dc88 Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Fri, 21 Feb 2025 09:50:06 +0100 Subject: [PATCH 7/8] Move notification inside the loop --- src/hooks/use-archive-site.ts | 13 ++++--------- 1 file changed, 4 insertions(+), 9 deletions(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index 75b5ad5d1..66bfce194 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -33,8 +33,6 @@ export function useArchiveSite() { return; } - let activeSnapshot: Snapshot | null = null; - const intervalId = setInterval( async () => { for ( const snapshot of loadingSnapshots ) { if ( snapshot.isLoading ) { @@ -51,7 +49,10 @@ export function useArchiveSite() { ...snapshot, isLoading: false, } ); - activeSnapshot = snapshot; + getIpcApi().showNotification( { + title: snapshot.name, + body: sprintf( __( "Preview site '%s' has been created." ), snapshot.url ), + } ); } } catch ( error ) { updateSnapshot( { @@ -64,12 +65,6 @@ export function useArchiveSite() { }, 3000 ); return () => { clearInterval( intervalId ); - if ( activeSnapshot ) { - getIpcApi().showNotification( { - title: activeSnapshot.name, - body: sprintf( __( "Preview site '%s' has been created." ), activeSnapshot.url ), - } ); - } }; }, [ __, client, snapshots, updateSnapshot ] ); From 2872b40c2974ebbfd2c314a3b8b2f11f1864cdc0 Mon Sep 17 00:00:00 2001 From: Kateryna Kodonenko Date: Fri, 21 Feb 2025 10:17:01 +0100 Subject: [PATCH 8/8] Move to context --- src/hooks/use-archive-site.ts | 52 ++--------------------------------- src/hooks/use-snapshots.tsx | 47 +++++++++++++++++++++++++++++++ 2 files changed, 50 insertions(+), 49 deletions(-) diff --git a/src/hooks/use-archive-site.ts b/src/hooks/use-archive-site.ts index 66bfce194..583e5bf03 100644 --- a/src/hooks/use-archive-site.ts +++ b/src/hooks/use-archive-site.ts @@ -1,19 +1,19 @@ import * as Sentry from '@sentry/electron/renderer'; import { sprintf } from '@wordpress/i18n'; import { useI18n } from '@wordpress/react-i18n'; -import { useCallback, useEffect, useMemo } from 'react'; +import { useCallback, useMemo } from 'react'; import { DEMO_SITE_SIZE_LIMIT_BYTES, DEMO_SITE_SIZE_LIMIT_GB } from 'src/constants'; import { useSyncSites } from 'src/hooks/sync-sites'; import { useArchiveErrorMessages } from 'src/hooks/use-archive-error-messages'; import { useAuth } from 'src/hooks/use-auth'; import { useSiteDetails } from 'src/hooks/use-site-details'; -import { SnapshotStatus, SnapshotStatusResponse, useSnapshots } from 'src/hooks/use-snapshots'; +import { useSnapshots } from 'src/hooks/use-snapshots'; import { getIpcApi } from 'src/lib/get-ipc-api'; import { isWpcomNetworkError } from 'src/lib/is-wpcom-network-error'; export function useArchiveSite() { const { uploadingSites, setUploadingSites, selectedSite } = useSiteDetails(); - const { snapshots, addSnapshot, updateSnapshot, fetchSnapshotUsage } = useSnapshots(); + const { snapshots, addSnapshot, fetchSnapshotUsage } = useSnapshots(); const isUploadingSiteId = useCallback( ( localSiteId: string ) => uploadingSites[ localSiteId ] || false, [ uploadingSites ] @@ -22,52 +22,6 @@ export function useArchiveSite() { const { __ } = useI18n(); const { connectedSites } = useSyncSites(); - useEffect( () => { - if ( ! client ) { - // Can't poll for snapshots if logged out - return; - } - - const loadingSnapshots = snapshots.filter( ( snapshot ) => snapshot.isLoading ); - if ( loadingSnapshots.length === 0 ) { - return; - } - - const intervalId = setInterval( async () => { - for ( const snapshot of loadingSnapshots ) { - if ( snapshot.isLoading ) { - try { - const response: SnapshotStatusResponse = await client.req.get( - '/jurassic-ninja/status', - { - apiNamespace: 'wpcom/v2', - site_id: snapshot.atomicSiteId, - } - ); - if ( response.status === SnapshotStatus.Active ) { - updateSnapshot( { - ...snapshot, - isLoading: false, - } ); - getIpcApi().showNotification( { - title: snapshot.name, - body: sprintf( __( "Preview site '%s' has been created." ), snapshot.url ), - } ); - } - } catch ( error ) { - updateSnapshot( { - ...snapshot, - isLoading: false, - } ); - } - } - } - }, 3000 ); - return () => { - clearInterval( intervalId ); - }; - }, [ __, client, snapshots, updateSnapshot ] ); - const getNextSequenceNumber = ( siteId: string, snapshots: Array< Snapshot >, diff --git a/src/hooks/use-snapshots.tsx b/src/hooks/use-snapshots.tsx index 6fd926252..da0fb1c66 100644 --- a/src/hooks/use-snapshots.tsx +++ b/src/hooks/use-snapshots.tsx @@ -1,4 +1,5 @@ import * as Sentry from '@sentry/electron/renderer'; +import { sprintf } from '@wordpress/i18n'; import { useI18n } from '@wordpress/react-i18n'; import React, { createContext, @@ -307,6 +308,52 @@ export const SnapshotProvider: React.FC< { children: ReactNode } > = ( { childre fetchStats(); }, [ client, fetchSnapshotUsage, initiated, snapshots.length ] ); + useEffect( () => { + if ( ! client ) { + // Can't poll for snapshots if logged out + return; + } + + const loadingSnapshots = snapshots.filter( ( snapshot ) => snapshot.isLoading ); + if ( loadingSnapshots.length === 0 ) { + return; + } + + const intervalId = setInterval( async () => { + for ( const snapshot of loadingSnapshots ) { + if ( snapshot.isLoading ) { + try { + const response: SnapshotStatusResponse = await client.req.get( + '/jurassic-ninja/status', + { + apiNamespace: 'wpcom/v2', + site_id: snapshot.atomicSiteId, + } + ); + if ( response.status === SnapshotStatus.Active ) { + updateSnapshot( { + ...snapshot, + isLoading: false, + } ); + getIpcApi().showNotification( { + title: snapshot.name, + body: sprintf( __( "Preview site '%s' has been created." ), snapshot.url ), + } ); + } + } catch ( error ) { + updateSnapshot( { + ...snapshot, + isLoading: false, + } ); + } + } + } + }, 3000 ); + return () => { + clearInterval( intervalId ); + }; + }, [ __, client, snapshots, updateSnapshot ] ); + const value: SnapshotContextType = useMemo( () => ( { snapshots,