fix: pull pr monitor and checks monitor creation into each series

apps/desktop/src/lib/branch/BranchLane.svelte

@@ -51,13 +51,17 @@
 	const sourceBranch = $derived(listedPr?.sourceBranch);
 	const prNumber = $derived(listedPr?.number);
 
-	const gitHostPrMonitorStore = createGitHostPrMonitorStore(undefined);
+	if (!$stackingFeature) {
-	const prMonitor = $derived(prNumber ? $prService?.prMonitor(prNumber) : undefined);
+		const gitHostPrMonitorStore = createGitHostPrMonitorStore(undefined);
-	$effect(() => gitHostPrMonitorStore.set(prMonitor));
+		const prMonitor = $derived(prNumber ? $prService?.prMonitor(prNumber) : undefined);
+		$effect(() => gitHostPrMonitorStore.set(prMonitor));
 
-	const gitHostChecksMonitorStore = createGitHostChecksMonitorStore(undefined);
+		const gitHostChecksMonitorStore = createGitHostChecksMonitorStore(undefined);
-	const checksMonitor = $derived(sourceBranch ? $gitHost?.checksMonitor(sourceBranch) : undefined);
+		const checksMonitor = $derived(
-	$effect(() => gitHostChecksMonitorStore.set(checksMonitor));
+			sourceBranch ? $gitHost?.checksMonitor(sourceBranch) : undefined
+		);
+		$effect(() => gitHostChecksMonitorStore.set(checksMonitor));
+	}
 
 	// BRANCH
 	const branchStore = createContextStore(VirtualBranch, branch);

apps/desktop/src/lib/pr/StackingPullRequestCard.svelte

@@ -32,7 +32,6 @@
 	const project = getContext(Project);
 
 	const gitHostListingService = getGitHostListingService();
-
 	const prStore = $derived($gitHostListingService?.prs);
 	const prs = $derived(prStore ? $prStore : undefined);
 
@@ -52,7 +51,9 @@
 	// While the pr monitor is set to fetch updates by interval, we want
 	// frequent updates while checks are running.
 	$effect(() => {
-		if ($checks) prMonitor?.refresh();
+		if ($checks) {
+			prMonitor?.refresh();
+		}
 	});
 
 	let isMerging = $state(false);
@@ -111,7 +112,7 @@
 	});
 </script>
 
-{#if pr}
+{#if $pr}
 	<div class="pr-header">
 		<div class="text-13 text-semibold pr-header-title">
 			<span style="color: var(--clr-scale-ntrl-50)">PR #{$pr?.number}:</span>
@@ -164,7 +165,7 @@
         determining "no checks will run for this PR" such that we can show the merge button
         immediately.
         -->
-		{#if pr}
+		{#if $pr}
 			<div class="pr-header-actions">
 				<MergeButton
 					wide

apps/desktop/src/lib/stack/Stack.svelte

@@ -8,9 +8,7 @@
 	import Dropzones from '$lib/branch/Dropzones.svelte';
 	import CommitDialog from '$lib/commit/CommitDialog.svelte';
 	import BranchFiles from '$lib/file/BranchFiles.svelte';
-	import { getGitHostChecksMonitor } from '$lib/gitHost/interface/gitHostChecksMonitor';
 	import { getGitHostListingService } from '$lib/gitHost/interface/gitHostListingService';
-	import { getGitHostPrMonitor } from '$lib/gitHost/interface/gitHostPrMonitor';
 	import ScrollableContainer from '$lib/scroll/ScrollableContainer.svelte';
 	import { SETTINGS, type Settings } from '$lib/settings/userSettings';
 	import Resizer from '$lib/shared/Resizer.svelte';
@@ -74,8 +72,6 @@
 	});
 
 	const listingService = getGitHostListingService();
-	const prMonitor = getGitHostPrMonitor();
-	const checksMonitor = getGitHostChecksMonitor();
 	const hostedListingServiceStore = getGitHostListingService();
 
 	const stackBranches = $derived(branch.series.map((s) => s.name));
@@ -87,8 +83,7 @@
 		try {
 			await branchController.pushBranch(branch.id, branch.requiresForce, true);
 			$listingService?.refresh();
-			$prMonitor?.refresh();
+			// TODO: Refresh prMonitor and checksMonitor upon push
-			$checksMonitor?.update();
 		} finally {
 			isPushingCommits = false;
 		}

apps/desktop/src/lib/stack/StackCurrentSeries.svelte

@@ -0,0 +1,57 @@
+<script lang="ts">
+	import { getGitHost } from '$lib/gitHost/interface/gitHost';
+	import { createGitHostChecksMonitorStore } from '$lib/gitHost/interface/gitHostChecksMonitor';
+	import { getGitHostListingService } from '$lib/gitHost/interface/gitHostListingService';
+	import { createGitHostPrMonitorStore } from '$lib/gitHost/interface/gitHostPrMonitor';
+	import { getGitHostPrService } from '$lib/gitHost/interface/gitHostPrService';
+	import type { PatchSeries } from '$lib/vbranches/types';
+	import type { Snippet } from 'svelte';
+
+	interface Props {
+		currentSeries: PatchSeries;
+		children: Snippet;
+	}
+
+	const { currentSeries, children }: Props = $props();
+
+	// Setup PR Store and Monitor on a per-series basis
+	const gitHost = getGitHost();
+	const prService = getGitHostPrService();
+
+	// Pretty cumbersome way of getting the PR number, would be great if we can
+	// make it more concise somehow.
+	const hostedListingServiceStore = getGitHostListingService();
+	const prStore = $derived($hostedListingServiceStore?.prs);
+	const prs = $derived(prStore ? $prStore : undefined);
+
+	const listedPr = $derived(prs?.find((pr) => pr.sourceBranch === currentSeries.name));
+	const prNumber = $derived(listedPr?.number);
+
+	const prMonitor = $derived(prNumber ? $prService?.prMonitor(prNumber) : undefined);
+	const pr = $derived(prMonitor?.pr);
+
+	const gitHostPrMonitorStore = createGitHostPrMonitorStore(undefined);
+	$effect(() => gitHostPrMonitorStore.set(prMonitor));
+
+	const checksMonitor = $derived(
+		$pr?.sourceBranch ? $gitHost?.checksMonitor($pr.sourceBranch) : undefined
+	);
+	const gitHostChecksMonitorStore = createGitHostChecksMonitorStore(undefined);
+	$effect(() => gitHostChecksMonitorStore.set(checksMonitor));
+</script>
+
+<div class="branch-group">
+	{@render children()}
+</div>
+
+<style>
+	.branch-group {
+		border: 1px solid var(--clr-border-2);
+		border-radius: var(--radius-m);
+		background: var(--clr-bg-1);
+
+		&:last-child {
+			margin-bottom: 12px;
+		}
+	}
+</style>

apps/desktop/src/lib/stack/StackSeries.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import StackCurrentSeries from './StackCurrentSeries.svelte';
 	import StackSeriesDividerLine from './StackSeriesDividerLine.svelte';
 	import StackingSeriesHeader from '$lib/branch/StackingSeriesHeader.svelte';
 	import StackingCommitList from '$lib/commit/StackingCommitList.svelte';
@@ -27,7 +28,7 @@
 	{#if !isTopSeries}
 		<StackSeriesDividerLine {currentSeries} />
 	{/if}
-	<div class="branch-group">
+	<StackCurrentSeries {currentSeries}>
 		<StackingSeriesHeader {currentSeries} {isTopSeries} />
 		{#if currentSeries.upstreamPatches.length > 0 || currentSeries.patches.length > 0}
 			<StackingCommitList
@@ -40,17 +41,5 @@
 				{hasConflicts}
 			/>
 		{/if}
-	</div>
+	</StackCurrentSeries>
 {/each}
-
-<style>
-	.branch-group {
-		border: 1px solid var(--clr-border-2);
-		border-radius: var(--radius-m);
-		background: var(--clr-bg-1);
-
-		&:last-child {
-			margin-bottom: 12px;
-		}
-	}
-</style>