antialias/soroban-abacus-flashcards
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(complement-race): fix react-spring interpolation TypeScript errors

Browse Source 
Fixed TypeScript errors in transform interpolation by using correct react-spring
syntax: to([spring1, spring2, spring3], (a, b, c) => ...) instead of the
incorrect spring1.to((a, b, c) => ..., spring2, spring3) syntax.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
Thomas Hallock
2025-10-22 14:05:11 -05:00
parent 3eb85d7d72
commit 0add9e4ef1
1 changed files with 7 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
apps/web/src/app/arcade/complement-race/components/RaceTrack/GhostTrain.tsx
View File

@@ -1,6 +1,6 @@
'use client' 'use client'
import { useSpring, useSprings, animated } from '@react-spring/web' import { useSpring, useSprings, animated, to } from '@react-spring/web'
import { useMemo, useRef } from 'react' import { useMemo, useRef } from 'react'
import type { PlayerState } from '@/arcade-games/complement-race/types' import type { PlayerState } from '@/arcade-games/complement-race/types'
import type { RailroadTrackGenerator } from '../../lib/RailroadTrackGenerator' import type { RailroadTrackGenerator } from '../../lib/RailroadTrackGenerator'
@@ -146,10 +146,9 @@ export function GhostTrain({
<g ref={ghostRef} data-component="ghost-train" data-player-id={player.id}> <g ref={ghostRef} data-component="ghost-train" data-player-id={player.id}>
{/* Ghost locomotive - animated */} {/* Ghost locomotive - animated */}
<animated.g <animated.g
transform={locomotiveSpring.x.to( transform={to(
(x, y, rot) => `translate(${x}, ${y}) rotate(${rot}) scale(-1, 1)`, [locomotiveSpring.x, locomotiveSpring.y, locomotiveSpring.rotation],
locomotiveSpring.y, (x, y, rot) => `translate(${x}, ${y}) rotate(${rot}) scale(-1, 1)`
locomotiveSpring.rotation
)} )}
opacity={locomotiveSpring.opacity} opacity={locomotiveSpring.opacity}
> >
@@ -208,10 +207,9 @@ export function GhostTrain({
{carSprings.map((spring, index) => ( {carSprings.map((spring, index) => (
<animated.g <animated.g
key={`car-${index}`} key={`car-${index}`}
transform={spring.x.to( transform={to(
(x, y, rot) => `translate(${x}, ${y}) rotate(${rot}) scale(-1, 1)`, [spring.x, spring.y, spring.rotation],
spring.y, (x, y, rot) => `translate(${x}, ${y}) rotate(${rot}) scale(-1, 1)`
spring.rotation
)} )}
opacity={spring.opacity} opacity={spring.opacity}
> >