fix: i18n의 타입 수정

This commit is contained in:
2026-02-14 21:55:54 +09:00
parent 82e2c08262
commit 1ccb9e517a
3 changed files with 58 additions and 37 deletions

View File

@@ -1,17 +1,20 @@
'use client';
"use client";
import { useEffect, useRef } from 'react';
import { useEffect, useRef } from "react";
import { projectFlightStar, createVanishingPoint } from '@/features/flight-starfield/lib/projection';
import {
createVanishingPoint,
projectFlightStar,
} from "@/features/flight-starfield/lib/projection";
import {
createFlightStar,
createFlightVanishXJitter,
getFlightStarCount,
shouldRecycleFlightStar,
} from '@/features/flight-starfield/model/starfieldModel';
import { FlightStar } from '@/features/flight-starfield/model/types';
import { clamp } from '@/shared/lib/math/number';
import { getPrefersReducedMotionMediaQuery } from '@/shared/lib/motion/prefersReducedMotion';
} from "@/features/flight-starfield/model/starfieldModel";
import { FlightStar } from "@/features/flight-starfield/model/types";
import { clamp } from "@/shared/lib/math/number";
import { getPrefersReducedMotionMediaQuery } from "@/shared/lib/motion/prefersReducedMotion";
export function FlightStarfieldCanvas({
vanishYOffset = -68,
@@ -30,7 +33,7 @@ export function FlightStarfieldCanvas({
const canvas = canvasRef.current;
if (!canvas) return;
const context = canvas.getContext('2d');
const context = canvas.getContext("2d");
if (!context) return;
let width = window.innerWidth;
@@ -102,7 +105,7 @@ export function FlightStarfieldCanvas({
if (star.tailLength < 1 || movementLength < 0.001) {
context.globalAlpha = visibleAlpha;
context.fillStyle = '#f8fbff';
context.fillStyle = "#f8fbff";
context.beginPath();
context.arc(toX, toY, star.radius, 0, Math.PI * 2);
context.fill();
@@ -116,7 +119,7 @@ export function FlightStarfieldCanvas({
const tailY = toY - directionY * star.tailLength;
const gradient = context.createLinearGradient(tailX, tailY, toX, toY);
gradient.addColorStop(0, 'rgba(248, 251, 255, 0)');
gradient.addColorStop(0, "rgba(248, 251, 255, 0)");
gradient.addColorStop(1, `rgba(248, 251, 255, ${visibleAlpha})`);
context.strokeStyle = gradient;
@@ -127,9 +130,15 @@ export function FlightStarfieldCanvas({
context.stroke();
context.globalAlpha = Math.min(1, visibleAlpha + 0.08);
context.fillStyle = '#f8fbff';
context.fillStyle = "#f8fbff";
context.beginPath();
context.arc(toX, toY, clamp(star.radius * 0.72, 0.6, 1.45), 0, Math.PI * 2);
context.arc(
toX,
toY,
clamp(star.radius * 0.72, 0.6, 1.45),
0,
Math.PI * 2,
);
context.fill();
context.globalAlpha = 1;
};
@@ -144,9 +153,9 @@ export function FlightStarfieldCanvas({
vp.y,
centerProtectRadius * 1.35,
);
veil.addColorStop(0, 'rgba(160, 185, 235, 0.08)');
veil.addColorStop(0.55, 'rgba(90, 114, 170, 0.03)');
veil.addColorStop(1, 'rgba(0, 0, 0, 0)');
veil.addColorStop(0, "rgba(160, 185, 235, 0.08)");
veil.addColorStop(0.55, "rgba(90, 114, 170, 0.03)");
veil.addColorStop(1, "rgba(0, 0, 0, 0)");
context.fillStyle = veil;
context.fillRect(0, 0, width, height);
@@ -161,14 +170,14 @@ export function FlightStarfieldCanvas({
height / 2,
Math.max(width, height) * 0.95,
);
vignette.addColorStop(0, 'rgba(0, 0, 0, 0)');
vignette.addColorStop(1, 'rgba(0, 0, 0, 0.82)');
vignette.addColorStop(0, "rgba(0, 0, 0, 0)");
vignette.addColorStop(1, "rgba(0, 0, 0, 0.82)");
context.fillStyle = vignette;
context.fillRect(0, 0, width, height);
};
const drawFrame = (moveStars: boolean) => {
context.fillStyle = 'rgba(2, 5, 10, 0.3)';
context.fillStyle = "rgba(2, 5, 10, 0.3)";
context.fillRect(0, 0, width, height);
drawCenterVeil();
@@ -254,8 +263,8 @@ export function FlightStarfieldCanvas({
}
};
window.addEventListener('resize', handleResize);
motionQuery.addEventListener('change', handleMotionChange);
window.addEventListener("resize", handleResize);
motionQuery.addEventListener("change", handleMotionChange);
if (prefersReducedMotion || isPaused) {
renderStatic();
@@ -264,11 +273,16 @@ export function FlightStarfieldCanvas({
}
return () => {
window.removeEventListener('resize', handleResize);
motionQuery.removeEventListener('change', handleMotionChange);
window.removeEventListener("resize", handleResize);
motionQuery.removeEventListener("change", handleMotionChange);
stopAnimation();
};
}, [vanishYOffset, centerProtectRadius, isPaused]);
return <canvas ref={canvasRef} className="fixed inset-0 z-0 bg-black pointer-events-none" />;
return (
<canvas
ref={canvasRef}
className="fixed inset-0 z-0 bg-black pointer-events-none"
/>
);
}