Skip to content

Commit 6d8a8f3

Browse files
emscbemscb
committed
Edit API
1 parent 16d3eaf commit 6d8a8f3

File tree

6 files changed

+135
-49
lines changed

6 files changed

+135
-49
lines changed

‎.env.development‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
1-
REACT_APP_PYCONKR_API=https://api-dev.pycon.kr
1+
REACT_APP_PYCONKR_API=https://api-dev.pycon.kr
2+
REACT_APP_PYCONKR_SHOP_API=https://shop-api.dev.pycon.kr

‎.env.production‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1 +1,2 @@
11
REACT_APP_PYCONKR_API=https://api.pycon.kr
2+
REACT_APP_PYCONKR_SHOP_API=https://shop-api.pycon.kr

‎src/api/sponsor.ts‎

Lines changed: 82 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,46 @@
1-
import { getErrorMessage } from "api"
2-
import instance from "lib/axios"
3-
import { APISponsor, APISponsorBenefit, APISponsorLevel, APISponsorLevelWithSponsor } from "models/api/sponsor"
4-
import { Sponsor, SponsorBenefit, SponsorLevel, SponsorLevelWithSponsor } from "models/sponsor"
5-
1+
import { getErrorMessage } from "api";
2+
import instance from "lib/axios";
3+
import {
4+
APIPatron,
5+
APISponsor,
6+
APISponsorBenefit,
7+
APISponsorLevel,
8+
APISponsorLevelWithSponsor,
9+
} from "models/api/sponsor";
10+
import {
11+
Patron,
12+
Sponsor,
13+
SponsorBenefit,
14+
SponsorLevel,
15+
SponsorLevelWithSponsor,
16+
} from "models/sponsor";
617

718
export function detailSponsor(id: string): Promise<Sponsor> {
819
return new Promise((resolve, reject) => {
9-
instance.get<APISponsor>(`/2024/sponsors/list/${id}/`).then(response => {
10-
resolve(Sponsor.fromAPI(response.data));
11-
}).catch(error => {
12-
console.error(error);
13-
reject(getErrorMessage(error));
14-
})
20+
instance
21+
.get<APISponsor>(`/2024/sponsors/list/${id}/`)
22+
.then((response) => {
23+
resolve(Sponsor.fromAPI(response.data));
24+
})
25+
.catch((error) => {
26+
console.error(error);
27+
reject(getErrorMessage(error));
28+
});
1529
return;
16-
})
30+
});
1731
}
1832

1933
export function listSponsorLevels(): Promise<SponsorLevel[]> {
2034
return new Promise((resolve, reject) => {
21-
instance.get<APISponsorLevel[]>("/2024/sponsors/levels").then((response) => {
22-
resolve(SponsorLevel.fromAPIs(response.data));
23-
}).catch((error) => {
24-
console.error(error);
25-
reject(getErrorMessage(error));
26-
})
35+
instance
36+
.get<APISponsorLevel[]>("/2024/sponsors/levels")
37+
.then((response) => {
38+
resolve(SponsorLevel.fromAPIs(response.data));
39+
})
40+
.catch((error) => {
41+
console.error(error);
42+
reject(getErrorMessage(error));
43+
});
2744
return;
2845
});
2946
}
@@ -58,11 +75,51 @@ export function listSponsorLevelWithSponsor(): Promise<SponsorLevelWithSponsor[]
5875

5976
export function listSponsorBenefits(): Promise<SponsorBenefit[]> {
6077
return new Promise((resolve, reject) => {
61-
instance.get<APISponsorBenefit[]>("/2024/sponsors/benefits/").then(response => {
62-
resolve(SponsorBenefit.fromAPIs(response.data));
63-
}).catch(error => {
64-
console.error(error);
65-
reject(getErrorMessage(error));
66-
})
67-
})
78+
instance
79+
.get<APISponsorBenefit[]>("/2024/sponsors/benefits/")
80+
.then((response) => {
81+
resolve(SponsorBenefit.fromAPIs(response.data));
82+
})
83+
.catch((error) => {
84+
console.error(error);
85+
reject(getErrorMessage(error));
86+
});
87+
});
88+
}
89+
90+
export function listPatrons(): Promise<Patron[]> {
91+
return new Promise((resolve, reject) => {
92+
resolve([
93+
{
94+
name: "김파이썬",
95+
message: "후원 합니다! ",
96+
sequence: 1,
97+
},
98+
{
99+
name: "이파이썬",
100+
message: "후원 합니다!",
101+
sequence: 2,
102+
},
103+
{
104+
name: "이파이썬",
105+
message: "",
106+
sequence: 3,
107+
},
108+
{
109+
name: "이파이썬",
110+
message: "후원 합니다!",
111+
sequence: 4,
112+
},
113+
]);
114+
115+
// instance
116+
// .get<APIPatron[]>("${process.env.REACT_APP_PYCONKR_SHOP_API}/2024/sponsors/benefits/")
117+
// .then((response) => {
118+
// resolve(Patron.fromAPIs(response.data));
119+
// })
120+
// .catch((error) => {
121+
// console.error(error);
122+
// reject(getErrorMessage(error));
123+
// });
124+
});
68125
}

‎src/models/api/sponsor.ts‎

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,7 @@ export type APISponsorBenefit = {
1414
is_countable: boolean;
1515
offer: number;
1616
uncountable_offer: string;
17-
}
17+
};
1818

1919
export type APISponsorLevel = {
2020
id: number;
@@ -25,7 +25,7 @@ export type APISponsorLevel = {
2525
limit: number;
2626
order: number;
2727
benefits: APISponsorBenefit[];
28-
}
28+
};
2929

3030
export type APISponsorLevelOnly = {
3131
id: number;
@@ -35,7 +35,7 @@ export type APISponsorLevelOnly = {
3535
price: number;
3636
limit: number;
3737
order: number;
38-
}
38+
};
3939

4040
export type APISponsorLevelWithSponsor = {
4141
id: number;
@@ -44,4 +44,10 @@ export type APISponsorLevelWithSponsor = {
4444
visible: boolean;
4545
order: number;
4646
sponsor: APISponsor[];
47-
}
47+
};
48+
49+
export type APIPatron = {
50+
name: string;
51+
message?: string | null;
52+
sequence: number;
53+
};

‎src/models/sponsor.ts‎

Lines changed: 14 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import {
44
APISponsor,
55
APISponsorLevelOnly,
66
APISponsorLevelWithSponsor,
7+
APIPatron,
78
} from "./api/sponsor";
89

910
export class SponsorBenefit {
@@ -178,12 +179,24 @@ export class Sponsor {
178179

179180
export class Patron {
180181
name: string;
181-
message?: string;
182+
message?: string | null;
182183
sequence: number;
183184

184185
private constructor(p: Patron) {
185186
this.name = p.name;
186187
this.message = p.message;
187188
this.sequence = p.sequence;
188189
}
190+
191+
static fromAPI(d: APIPatron): Patron {
192+
return new Patron({
193+
name: d.name,
194+
message: d.message,
195+
sequence: d.sequence,
196+
});
197+
}
198+
199+
static fromAPIs(data: APIPatron[]): Patron[] {
200+
return data.map((d) => Patron.fromAPI(d));
201+
}
189202
}

‎src/pages/Sponsor/patron.tsx‎

Lines changed: 26 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,4 @@
1+
import { SponsorAPI } from "api";
12
import Page from "components/common/Page";
23
import { Patron } from "models/sponsor";
34
import React, { useEffect, useState } from "react";
@@ -6,21 +7,26 @@ import useTranslation from "utils/hooks/useTranslation";
67

78
const PatronList = () => {
89
const t = useTranslation();
9-
const [patrons, setPatrons] = useState<Patron[]>([
10-
{
11-
name: "김파이썬",
12-
message:
13-
"후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다! 후원 합니다!",
14-
sequence: 1,
15-
},
16-
{
17-
name: "이파이썬",
18-
message: "후원 합니다!",
19-
sequence: 2,
20-
},
21-
]);
10+
const [patrons, setPatrons] = useState<Patron[]>([]);
11+
const [isLoading, setIsLoading] = useState<boolean>(false);
2212

23-
useEffect(() => {}, []);
13+
useEffect(() => {
14+
setIsLoading(true);
15+
SponsorAPI.listPatrons()
16+
.then(setPatrons)
17+
.catch(() => {})
18+
.finally(() => {
19+
setIsLoading(false);
20+
});
21+
}, []);
22+
23+
if (isLoading)
24+
return (
25+
<Page>
26+
<h1>{t("개인 후원자")}</h1>
27+
<p>{t("불러오는 중입니다...")}</p>
28+
</Page>
29+
);
2430

2531
return (
2632
<Page>
@@ -36,7 +42,7 @@ const PatronList = () => {
3642
.map((p) => (
3743
<PatronContainer>
3844
<h4>{p.name}</h4>
39-
<p>{p.message ?? ""}</p>
45+
<div>{p.message}</div>
4046
</PatronContainer>
4147
))}
4248
</Page>
@@ -46,19 +52,21 @@ const PatronList = () => {
4652
export default PatronList;
4753

4854
const PatronContainer = styled.div`
49-
padding-top: 0.5rem;
50-
padding-bottom: 0.5rem;
55+
width: 50%;
56+
margin: 0 auto;
57+
padding: 0.5rem 0;
5158
5259
h4 {
5360
color: #febd99;
5461
margin-bottom: 0.2rem;
5562
}
5663
57-
p {
64+
& > div {
5865
margin-bottom: 0.3rem;
5966
color: var(--pico-h3-color);
6067
font-size: 0.8rem;
6168
font-weight: bold;
69+
min-height: 1rem;
6270
}
6371
6472
@media only screen and (max-width: 809px) {

0 commit comments

Comments
 (0)