1
1
import './style.css' ;
2
- import React , { useState , useEffect } from 'react' ;
2
+ import React , { useState , useEffect , useRef } from 'react' ;
3
3
import { createRoot } from 'react-dom/client' ;
4
4
import { SemVer } from 'semver' ;
5
5
import { ErrorMessage } from './ErrorMessage.js' ;
6
6
import { PackageItem } from './PackageItem.js' ;
7
7
import { Package , RELEASE_TYPE_OPTIONS , ReleaseType } from './types.js' ;
8
8
9
+ // Helper function to compare sets
10
+ const setsAreEqual = ( a : Set < string > , b : Set < string > ) => {
11
+ if ( a . size !== b . size ) return false ;
12
+ return [ ...a ] . every ( ( value ) => b . has ( value ) ) ;
13
+ } ;
14
+
9
15
type SubmitButtonProps = {
10
16
selections : Record < string , string > ;
11
17
packageDependencyErrors : Record <
@@ -67,16 +73,35 @@ function App() {
67
73
new Set ( ) ,
68
74
) ;
69
75
const [ showCheckboxes , setShowCheckboxes ] = useState ( false ) ;
76
+ const previousPackages = useRef < Set < string > > ( new Set ( ) ) ;
70
77
71
78
useEffect ( ( ) => {
72
- fetch ( '/api/packages' )
79
+ const majorBumps = Object . entries ( selections )
80
+ . filter ( ( [ _ , type ] ) => type === 'major' )
81
+ . map ( ( [ pkgName ] ) => pkgName ) ;
82
+
83
+ fetch ( `/api/packages?majorBumps=${ majorBumps . join ( ',' ) } ` )
73
84
. then ( ( res ) => {
74
85
if ( ! res . ok ) {
75
86
throw new Error ( `Received ${ res . status } ` ) ;
76
87
}
77
88
return res . json ( ) ;
78
89
} )
79
90
. then ( ( data : Package [ ] ) => {
91
+ const newPackageNames = new Set ( data . map ( ( pkg ) => pkg . name ) ) ;
92
+
93
+ // Only clean up selections if the package list actually changed
94
+ if ( ! setsAreEqual ( previousPackages . current , newPackageNames ) ) {
95
+ setSelections ( ( prev ) =>
96
+ Object . fromEntries (
97
+ Object . entries ( prev ) . filter ( ( [ pkgName ] ) =>
98
+ newPackageNames . has ( pkgName ) ,
99
+ ) ,
100
+ ) ,
101
+ ) ;
102
+ previousPackages . current = newPackageNames ;
103
+ }
104
+
80
105
setPackages ( data ) ;
81
106
setLoadingChangelogs (
82
107
data . reduce ( ( acc , pkg ) => ( { ...acc , [ pkg . name ] : false } ) , { } ) ,
@@ -86,7 +111,7 @@ function App() {
86
111
setError ( err . message ) ;
87
112
console . error ( 'Error fetching packages:' , err ) ;
88
113
} ) ;
89
- } , [ ] ) ;
114
+ } , [ selections ] ) ;
90
115
91
116
const checkDependencies = async ( selectionData : Record < string , string > ) => {
92
117
if ( Object . keys ( selectionData ) . length === 0 ) return ;
0 commit comments