fix: 요청 URL 파라미터 변경

- 로컬 커밋이 미동작해서 직접 수정

Author: anveloper

frontend/src/components/UnsplashUploader.tsx

@@ -1,9 +1,9 @@
+import { Icon } from '@iconify/react';
+import { useEffect, useMemo, useRef, useState } from 'react';
 import { useRecoilState, useRecoilValue } from 'recoil';
 import { isImageBright, previewImage, ratioAtom } from '../atom';
-import { Icon } from '@iconify/react';
-import { useEffect, useRef, useState } from 'react';
 
-const FIXED_HEIGHT = 280;
+const HEIGHT = 280;
 
 const UnsplashUploader = () => {
   let timer: NodeJS.Timer | null = null;
@@ -12,10 +12,11 @@ const UnsplashUploader = () => {
   const previewRatio = useRecoilValue(ratioAtom);
   const [isLoading, setIsLoading] = useState<boolean>(false);
   const mounted = useRef(false);
-  
+  const width = useMemo(() => Math.round(HEIGHT * previewRatio), [previewRatio]);
+
   const getRandomImage = async () => {
     if (!timer) {
-      const response = await fetch(`https://picsum.photos/${FIXED_HEIGHT * previewRatio}/${FIXED_HEIGHT}?random=${Date.now()}`);
+      const response = await fetch(`https://picsum.photos/${width}/${HEIGHT}?random=${Date.now()}`);
       setIsLoading(true);
       timer = setTimeout(function () {
         timer = null;
@@ -29,7 +30,7 @@ const UnsplashUploader = () => {
   };
   useEffect(() => {
     if (imageSrc === '') {
-      fetch(`https://picsum.photos/${FIXED_HEIGHT * previewRatio}/${FIXED_HEIGHT}?random=${Date.now()}`).then((response) => {
+      fetch(`https://picsum.photos/${width}/${HEIGHT}?random=${Date.now()}`).then((response) => {
         setImageSrc(response.url);
       });
     }
@@ -45,7 +46,7 @@ const UnsplashUploader = () => {
           }
         >
           <Icon className={'w-6 h-6 ' + `${isLoading && `animate-spinner`}`} icon="tabler:refresh" vFlip={true} />
-          <div className="text-sm">Unsplash 랜덤 이미지 삽입</div>
+          <div className="text-sm">PICSUM 랜덤 이미지 삽입</div>
         </div>
       </button>
       <label className={`${isBright ? 'text-darken' : 'text-muted'} flex justify-start items-center mt-3`}>