@@ -127,61 +127,61 @@ const Versions = () => {
127127 </ Show >
128128 }
129129 >
130- < div
131- style = { {
132- height : `${ virtualizer . getTotalSize ( ) } px` ,
133- width : "100%" ,
134- position : "relative"
135- } }
136- >
137- < For each = { virtualizer . getVirtualItems ( ) } >
138- { ( virtualItem ) => {
139- const version = rows ( ) [ virtualItem . index ]
140- if ( ! version ) return null
130+ < div
131+ style = { {
132+ height : `${ virtualizer . getTotalSize ( ) } px` ,
133+ width : "100%" ,
134+ position : "relative"
135+ } }
136+ >
137+ < For each = { virtualizer . getVirtualItems ( ) } >
138+ { ( virtualItem ) => {
139+ const version = rows ( ) [ virtualItem . index ]
140+ if ( ! version ) return null
141141
142- if (
143- virtualItem . index >= rows ( ) . length - 5 &&
144- infiniteQuery . infiniteQuery . hasNextPage &&
145- ! infiniteQuery . infiniteQuery . isFetchingNextPage
146- ) {
147- infiniteQuery . infiniteQuery . fetchNextPage ( ) . catch ( ( ) => { } )
148- }
142+ if (
143+ virtualItem . index >= rows ( ) . length - 5 &&
144+ infiniteQuery . infiniteQuery . hasNextPage &&
145+ ! infiniteQuery . infiniteQuery . isFetchingNextPage
146+ ) {
147+ infiniteQuery . infiniteQuery . fetchNextPage ( ) . catch ( ( ) => { } )
148+ }
149149
150- return (
151- < div
152- style = { {
153- position : "absolute" ,
154- top : "0" ,
155- left : "0" ,
156- width : "100%" ,
157- height : `${ virtualItem . size } px` ,
158- transform : `translateY(${ virtualItem . start } px)`
159- } }
160- class = "border-darkSlate-700 hover:bg-darkSlate-700/30 grid grid-cols-[4fr_130px_100px_120px_150px] gap-4 border-b py-2 transition-colors duration-150"
161- classList = { {
162- "bg-green-500/5 border-green-500/20" :
163- installedMod ( ) ?. remoteId . toString ( ) ===
164- version ?. fileId . toString ( )
165- } }
166- >
167- < VersionRow
168- project = { mod ?. data }
169- modVersion = { version }
170- installedFile = { installedMod ( ) }
171- instanceId = { instanceId ( ) }
172- type = { mod ?. data ?. type }
173- instanceMods = { instanceMods . data || undefined }
174- instanceDetails = { instanceDetails . data || undefined }
175- />
176- </ div >
177- )
178- } }
179- </ For >
150+ return (
151+ < div
152+ style = { {
153+ position : "absolute" ,
154+ top : "0" ,
155+ left : "0" ,
156+ width : "100%" ,
157+ height : `${ virtualItem . size } px` ,
158+ transform : `translateY(${ virtualItem . start } px)`
159+ } }
160+ class = "border-darkSlate-700 hover:bg-darkSlate-700/30 grid grid-cols-[4fr_130px_100px_120px_150px] gap-4 border-b py-2 transition-colors duration-150"
161+ classList = { {
162+ "bg-green-500/5 border-green-500/20" :
163+ installedMod ( ) ?. remoteId . toString ( ) ===
164+ version ?. fileId . toString ( )
165+ } }
166+ >
167+ < VersionRow
168+ project = { mod ?. data }
169+ modVersion = { version }
170+ installedFile = { installedMod ( ) }
171+ instanceId = { instanceId ( ) }
172+ type = { mod ?. data ?. type }
173+ instanceMods = { instanceMods . data || undefined }
174+ instanceDetails = { instanceDetails . data || undefined }
175+ />
176+ </ div >
177+ )
178+ } }
179+ </ For >
180+ </ div >
181+ < Show when = { infiniteQuery . infiniteQuery . isFetchingNextPage } >
182+ < div class = "flex h-20 items-center justify-center" >
183+ < Spinner class = "h-8 w-8" />
180184 </ div >
181- < Show when = { infiniteQuery . infiniteQuery . isFetchingNextPage } >
182- < div class = "flex h-20 items-center justify-center" >
183- < Spinner class = "h-8 w-8" />
184- </ div >
185185 </ Show >
186186 </ Show >
187187 </ div >
0 commit comments