Merge pull request #27 from pythonkr/fix/sponsor-api-call

Fix: 테스트용 API 주소 제거

Author: jungmir

src/api/sponsor.ts

@@ -6,7 +6,7 @@ import { Sponsor, SponsorBenefit, SponsorLevel, SponsorLevelWithSponsor } from "
 
 export function detailSponsor(id: string): Promise<Sponsor> {
   return new Promise((resolve, reject) => {
-    instance.get<APISponsor>(`http://localhost:8888/2024/sponsors/list/${id}/`).then(response => {
+    instance.get<APISponsor>(`/2024/sponsors/list/${id}/`).then(response => {
       resolve(Sponsor.fromAPI(response.data));
     }).catch(error => {
       console.error(error);
@@ -18,7 +18,7 @@ export function detailSponsor(id: string): Promise<Sponsor> {
 
 export function listSponsorLevels(): Promise<SponsorLevel[]> {
   return new Promise((resolve, reject) => {
-    instance.get<APISponsorLevel[]>("http://localhost:8888/2024/sponsors/levels").then((response) => {
+    instance.get<APISponsorLevel[]>("/2024/sponsors/levels").then((response) => {
       resolve(SponsorLevel.fromAPIs(response.data));
     }).catch((error) => {
       console.error(error);
@@ -31,7 +31,7 @@ export function listSponsorLevels(): Promise<SponsorLevel[]> {
 export function listSponsors(): Promise<Sponsor[]> {
   return new Promise((resolve, reject) => {
     instance
-      .get<APISponsor[]>("http://localhost:8888/2024/sponsors/list/")
+      .get<APISponsor[]>("/2024/sponsors/list/")
       .then((response) => {
         resolve(Sponsor.fromAPIs(response.data));
       })
@@ -44,7 +44,7 @@ export function listSponsors(): Promise<Sponsor[]> {
 export function listSponsorLevelWithSponsor(): Promise<SponsorLevelWithSponsor[]> {
   return new Promise((resolve, reject) => {
     instance
-      .get<APISponsorLevelWithSponsor[]>("http://localhost:8888/2024/sponsors/levels/with-sponsor/")
+      .get<APISponsorLevelWithSponsor[]>("/2024/sponsors/levels/with-sponsor/")
       .then((response) => {
         console.log("debug", response);
         resolve(SponsorLevelWithSponsor.fromAPIs(response.data));
@@ -58,7 +58,7 @@ export function listSponsorLevelWithSponsor(): Promise<SponsorLevelWithSponsor[]
 
 export function listSponsorBenefits(): Promise<SponsorBenefit[]> {
   return new Promise((resolve, reject) => {
-    instance.get<APISponsorBenefit[]>("http://localhost:8888/2024/sponsors/benefits/").then(response => {
+    instance.get<APISponsorBenefit[]>("/2024/sponsors/benefits/").then(response => {
       resolve(SponsorBenefit.fromAPIs(response.data));
     }).catch(error => {
       console.error(error);

src/components/Footer/SponsorTable.tsx

@@ -16,14 +16,19 @@ function SponsorTable({ max, levelName, sponsors, ...rest }: Props) {
       <div style={{ gridTemplateColumns: `repeat(${max}, 1fr)` }}>
         {sponsors.map((sponsor) => (
           <Link to={`/sponsoring/sponsor/${sponsor.id}`} relative="path">
-            <img src={sponsor.logo_image} alt={sponsor.name} />
+            <LogoImage src={sponsor.logo_image} alt={sponsor.name} />
           </Link>
         ))}
       </div>
     </SponsorCard>
   );
 }
 
+const LogoImage = styled.img`
+  background: white;
+  color: black;
+`;
+
 const SponsorCard = styled.div`
   border: 1px solid #b0a8fe;
   border-radius: 16px;

src/pages/Sponsor/SponsorDetail.tsx

@@ -13,7 +13,7 @@ const SponsorDetail: React.FC<{ sponsor: APISponsor }> = ({ sponsor }) => {
     <Vertical>
       <H1>{sponsor.name}</H1>
       <a href={sponsor.url}>
-        <img src={sponsor.logo_image} alt={sponsor.name} />
+        <LogoImage src={sponsor.logo_image} alt={sponsor.name} />
       </a>
       <H3 dangerouslySetInnerHTML={{ __html: sponsor.desc }}></H3>
     </Vertical>
@@ -48,6 +48,12 @@ const SponsorDetailPage = () => {
 
 export default SponsorDetailPage;
 
+const LogoImage = styled.img`
+  background: white;
+  color: black;
+  max-width: 50%;
+`;
+
 const Container = styled.div`
   display: flex;
   justify-content: center;