Move pull and push states from SyncSitesProvider to a new Redux slice

[gcsecsey]

Related issues

Fixes STU-711

Proposed Changes

• Removed SyncSitesProvider completely
• Added a new syncOperations Redux slice
• Moved logic from use-sync-pull and use-sync-push hooks to Redux thunks
• Kept the hooks as think wrappers of the tunks
• Implement syncOperations Redux slice
• Removed some unused callback props

Testing Instructions

• Run npm start
• Go to the Sync tab
• Connect a site
• Pull changes from the site and check that there are no regressions
• Push changes to the site and check that there are no regressions

Pre-merge Checklist

• Have you checked for TypeScript, React or other console errors?

[github-actions]

📊 Performance Test Results

Comparing c108a94 vs trunk

site-editor

Metric	trunk	c108a94	Diff	Change
load	10814.00 ms	17986.00 ms	+7172.00 ms	🔴 66.3%

site-startup

Metric	trunk	c108a94	Diff	Change
siteCreation	22705.00 ms	22344.00 ms	-361.00 ms	🟢 -1.6%
siteStartup	9034.00 ms	9005.00 ms	-29.00 ms	🟢 -0.3%

---

Results are median values from multiple test runs.

Legend: 🟢 Improvement (faster) | 🔴 Regression (slower) | ⚪ No change

[nightnei]

Push: it seems it stucks at "Creating backup..." step. Tried a few times and also tried in trunk - worked quickly for me.

Pull: not related to the changes, since I reproduce the error in trunk too, but if you are working there - take a look please at this error when pull is finished, maybe it's a quck win:

[gcsecsey]

Push: it seems it stucks at "Creating backup..." step. Tried a few times and also tried in trunk - worked quickly for me.

Pull: not related to the changes, since I reproduce the error in trunk too, but if you are working there - take a look please at this error when pull is finished, maybe it's a quck win:

Thanks for reviewing this @nightnei! I took another look at this, and found that earlier we used a ref to keep track of the state, which let us read it back immediately after updating it. For now, I added the ref to the hooks that were previously in the usePullPushStates hook.

I'm also testing a simpler approach that updated the state objects directly where needed. If it works reliably, I'll update the PR with this approach.

[fredrikekelund]

@gcsecsey, I would challenge us to remove src/hooks/sync-sites/sync-sites-context.tsx completely as part of this refactor.

With this change, we are preserving functions like updatePushState in the React context, even though they are now essentially Redux action creators (or thunks, I guess). The logic around sync operations would be much easier to follow if we moved src/hooks/sync-sites/use-sync-push.ts and src/hooks/sync-sites/use-sync-pull.ts into src/stores/sync/sync-operations-slice.ts.

[gcsecsey]

@gcsecsey, I would challenge us to remove src/hooks/sync-sites/sync-sites-context.tsx completely as part of this refactor.

With this change, we are preserving functions like updatePushState in the React context, even though they are now essentially Redux action creators (or thunks, I guess). The logic around sync operations would be much easier to follow if we moved src/hooks/sync-sites/use-sync-push.ts and src/hooks/sync-sites/use-sync-pull.ts into src/stores/sync/sync-operations-slice.ts.

That's a good point @fredrikekelund, thanks! I'll try to move as much as possible to the Redux slice, and ping for another review.

[gcsecsey]

I carried out the changes to move most of the logic into thunks within src/stores/sync/sync-operations-slice.ts. I experimented with removing the src/hooks/sync-sites/use-sync-push.ts and src/hooks/sync-sites/use-sync-pull.ts hooks completely too, and update the components to directly use the thunks, but I found this needed quite a bit of boilerplate in each component, so for the time being, I kept the hooks as thin wrappers.

@fredrikekelund could you please take another look when you're back? Thanks!

[nightnei]

Thanks for addressing feedback, works well now, no regressions 👍