Skip to content

Commit 1ca5dfa

Browse files
createhb21createhb21
committed
chore: metadata (#develop)
1 parent 1ecb409 commit 1ca5dfa

File tree

22 files changed

+535
-33
lines changed

22 files changed

+535
-33
lines changed

‎packages/utils/src/object.ts‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,12 @@ export function removeFalsyValues<T extends Record<string, any>>(
2626
}, {} as Partial<T>);
2727
}
2828

29+
export function objectKeys<Type extends Record<PropertyKey, unknown>>(
30+
obj: Type,
31+
): Array<ObjectKeys<Type>> {
32+
return Object.keys(obj) as Array<ObjectKeys<Type>>;
33+
}
34+
2935
export function objectEntries<Type extends Record<PropertyKey, unknown>>(
3036
obj: Type,
3137
): Array<[ObjectKeys<Type>, Type[ObjectKeys<Type>]]> {

‎services/ahhachul.com/index.html‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,8 @@
1414

1515
<meta property="og:title" content="아하철 - 1등 지하철&유실물 정보앱" />
1616
<meta property="og:description" content="지하철에 당신의 따뜻한 이야기를 채워나가요" />
17+
<meta property="og:image" content="https://static.dev.ahhachul.com/banners/main.png" />
18+
<meta property="og:image:alt" content="Ahhachul logo" />
1719
<meta property="og:site_name" content="아하철 | AhHachul" />
1820
<meta property="og:type" content="website" />
1921
<meta property="og:locale" content="ko_KR" />

‎services/ahhachul.com/src/apis/request/complaint.ts‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,7 @@ export const fetchComplaintList = async (req: ComplaintListParams) => {
2323
};
2424

2525
export const createComplaint = async (req: ComplaintForm) => {
26+
console.log('req:', req);
2627
const formData = new FormData();
2728
const formDataWithoutImages = extractFormData(req, 'images');
2829
const jsonBlob = createJsonBlob(formDataWithoutImages);

‎services/ahhachul.com/src/components/common/comment/commentListItem/CommentListItem.styled.tsx‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@ export const CommentWrapper = styled.div<{ asChild?: boolean }>`
66
flex-direction: column;
77
border-bottom: 1px solid ${({ theme }) => theme.colors.gray[20]};
88
background-color: ${({ theme }) => theme.colors.gray[10]};
9-
padding: 16px 20px;
9+
padding: 14px 20px;
1010
${({ asChild }) =>
1111
asChild &&
1212
css`
@@ -18,26 +18,27 @@ export const HeaderWrapper = styled.div`
1818
display: flex;
1919
align-items: center;
2020
justify-content: space-between;
21-
padding-bottom: 8px;
21+
padding-bottom: 4px;
2222
`;
2323

2424
export const WriterName = styled.span`
2525
${({ theme }) => css`
2626
color: ${theme.colors.gray[90]};
27-
font-size: 13px;
27+
font-size: 14px;
28+
font-weight: 600;
2829
`}
2930
`;
3031

3132
export const ContentWrapper = styled.div`
3233
display: flex;
3334
flex-direction: column;
34-
gap: 12px;
35-
padding-bottom: 20px;
35+
gap: 6px;
36+
padding-bottom: 8px;
3637
`;
3738

3839
export const DeletedComment = styled.div`
3940
${({ theme }) => css`
40-
${theme.fonts.bodyLargeSemi};
41+
${theme.fonts.bodyMedium};
4142
color: ${theme.colors.gray[90]};
4243
`}
4344
`;
@@ -51,7 +52,7 @@ export const DateText = styled.span`
5152

5253
export const ReplyButton = styled.button`
5354
${({ theme }) => css`
54-
${theme.fonts.labelMedium};
55+
${theme.fonts.bodyMedium};
5556
color: ${theme.colors.gray[90]};
5657
width: max-content;
5758
`}
@@ -63,5 +64,9 @@ export const readonlyEditorCss = css`
6364
& > div > div {
6465
padding: 0;
6566
border: none;
67+
68+
& > p {
69+
line-height: 150%;
70+
}
6671
}
6772
`;

‎services/ahhachul.com/src/components/domain/complaint/postDetail/error/ComplaintErrorPage.component.tsx‎

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
import type { AxiosError } from 'axios';
2+
3+
import { useFlow } from '@/stackflow';
4+
5+
import * as S from './ComplaintErrorPage.styled';
6+
7+
interface ComplaintErrorPageProps {
8+
error: AxiosError;
9+
reset: () => void;
10+
}
11+
12+
const ComplaintErrorPage = ({ error, reset }: ComplaintErrorPageProps) => {
13+
const { replace } = useFlow();
14+
15+
const isDeletedPost = error.response?.status === 404;
16+
17+
return isDeletedPost ? (
18+
<S.Container>
19+
<S.Title>삭제된 게시글입니다.</S.Title>
20+
<S.RetryButton type="button" onClick={() => replace('HomePage', {}, { animate: false })}>
21+
홈으로 이동하기
22+
</S.RetryButton>
23+
</S.Container>
24+
) : (
25+
<S.Container>
26+
<S.Title>알 수 없는 오류가 발생했습니다.</S.Title>
27+
<S.Description>
28+
계속 발생한다면 잠시 후 다시 시도해주세요. <br />
29+
인터넷 연결 상태가 좋지 않으면 발생할 수 있습니다.
30+
</S.Description>
31+
<S.RetryButton type="button" onClick={reset}>
32+
다시 시도하기
33+
</S.RetryButton>
34+
</S.Container>
35+
);
36+
};
37+
38+
export default ComplaintErrorPage;

‎services/ahhachul.com/src/components/domain/complaint/postDetail/error/ComplaintErrorPage.styled.tsx‎

Lines changed: 42 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
import { css } from '@emotion/react';
2+
import styled from '@emotion/styled';
3+
4+
export const Container = styled.div`
5+
display: flex;
6+
flex-direction: column;
7+
align-items: center;
8+
justify-content: center;
9+
gap: 12px;
10+
`;
11+
12+
export const Title = styled.p`
13+
text-align: center;
14+
font-size: 20px;
15+
font-weight: 700;
16+
`;
17+
18+
export const Description = styled.p`
19+
text-align: center;
20+
${({ theme }) => css`
21+
${theme.fonts.labelMedium};
22+
`}
23+
`;
24+
25+
export const RetryButton = styled.button`
26+
margin-top: 16px;
27+
padding: 8px 16px;
28+
background-color: ${({ theme }) => theme.colors.primary.primary};
29+
color: ${({ theme }) => theme.colors.gray[90]};
30+
${({ theme }) => css`
31+
${theme.fonts.labelMedium};
32+
`}
33+
font-weight: 600;
34+
border-radius: 6px;
35+
background-color: white;
36+
border: 1px solid ${({ theme }) => theme.colors.gray[30]};
37+
transition: background-color 0.2s;
38+
39+
&:hover {
40+
background-color: ${({ theme }) => `${theme.colors.primary.primary}E6`}; // 90% opacity
41+
}
42+
`;

‎services/ahhachul.com/src/components/domain/complaint/postDetail/index.ts‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,3 +2,5 @@ export { default as ComplaintDetail } from './template/ComplaintDetail.component
22
export { default as ComplaintCategoryBadge } from './categoryBadge/ComplaintCategoryBadge.component';
33
export { default as ComplaintCommentList } from './commentList/ComplaintCommentList.component';
44
export { default as ComplaintDetailHeaderActions } from './headerActions/ComplaintHeaderActions.component';
5+
export { default as ComplaintDetailSkeleton } from './skeleton/ComplaintDetail.skeleton';
6+
export { default as ComplaintErrorPage } from './error/ComplaintErrorPage.component';

‎services/ahhachul.com/src/components/domain/complaint/postDetail/skeleton/ComlaintDetail.skeleton.styled.tsx‎

Lines changed: 105 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,105 @@
1+
import styled from '@emotion/styled';
2+
3+
export const ArticleWrapper = styled.article`
4+
padding-top: 20px;
5+
opacity: 0;
6+
animation: fadeIn 0.5s ease-in-out forwards;
7+
@media (prefers-reduced-motion: reduce) {
8+
animation: none;
9+
}
10+
11+
@keyframes fadeIn {
12+
from {
13+
opacity: 0;
14+
}
15+
to {
16+
opacity: 1;
17+
}
18+
}
19+
`;
20+
21+
export const ContentWrapper = styled.div`
22+
padding: 0 20px;
23+
`;
24+
25+
export const TitleWrapper = styled.div`
26+
padding-top: 13px;
27+
padding-bottom: 16px;
28+
`;
29+
30+
export const MetaWrapper = styled.div`
31+
width: 100%;
32+
display: flex;
33+
align-items: center;
34+
justify-content: space-between;
35+
padding-bottom: 16px;
36+
border-bottom: 1px solid ${({ theme }) => theme.colors.gray[20]};
37+
`;
38+
39+
export const MetaLeftSection = styled.div`
40+
display: flex;
41+
align-items: center;
42+
gap: 4px;
43+
${({ theme }) => theme.fonts.bodyMedium};
44+
`;
45+
46+
export const MetaRightSection = styled.div`
47+
display: flex;
48+
align-items: center;
49+
`;
50+
51+
export const ContentSection = styled.div`
52+
padding: 24px 0;
53+
margin-bottom: 12px;
54+
`;
55+
56+
export const BottomSection = styled.div`
57+
border-top: 1px solid ${({ theme }) => theme.colors.gray[30]};
58+
height: 50px;
59+
display: flex;
60+
align-items: center;
61+
justify-content: space-between;
62+
padding: 0 20px;
63+
`;
64+
65+
export const BottomLeftSection = styled.div`
66+
display: flex;
67+
align-items: center;
68+
gap: 4px;
69+
`;
70+
71+
export const BottomRightSection = styled.div`
72+
display: flex;
73+
align-items: center;
74+
`;
75+
76+
export const CommentsSection = styled.section`
77+
opacity: 0;
78+
animation: fadeIn 0.5s ease-in-out forwards;
79+
animation-delay: 100ms;
80+
`;
81+
82+
export const CommentItem = styled.div<{ index: number }>`
83+
display: flex;
84+
flex-direction: column;
85+
border-bottom: 1px solid ${({ theme }) => theme.colors.gray[20]};
86+
background-color: ${({ theme }) => theme.colors.gray[10]};
87+
padding: 16px 20px;
88+
opacity: 0;
89+
animation: fadeIn 0.5s ease-in-out forwards;
90+
animation-delay: ${({ index }) => (index + 1) * 100}ms;
91+
`;
92+
93+
export const CommentHeader = styled.div`
94+
display: flex;
95+
align-items: center;
96+
justify-content: space-between;
97+
padding-bottom: 8px;
98+
`;
99+
100+
export const CommentContent = styled.div`
101+
display: flex;
102+
flex-direction: column;
103+
gap: 12px;
104+
padding-bottom: 20px;
105+
`;

‎services/ahhachul.com/src/components/domain/complaint/postDetail/skeleton/ComplaintDetail.skeleton.tsx‎

Lines changed: 67 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,67 @@
1+
import { BaseSkeleton } from '@/components/common';
2+
3+
import * as S from './ComlaintDetail.skeleton.styled';
4+
5+
const ComplaintDetailSkeleton = () => {
6+
return (
7+
<>
8+
<S.ArticleWrapper>
9+
<S.ContentWrapper>
10+
{/* LostTypeBadge 스켈레톤 */}
11+
<BaseSkeleton width={60} height={26} radius={13} />
12+
13+
{/* 제목 스켈레톤 */}
14+
<S.TitleWrapper>
15+
<BaseSkeleton width="50%" height={21} radius={6} />
16+
</S.TitleWrapper>
17+
18+
{/* 메타 정보 스켈레톤 */}
19+
<S.MetaWrapper>
20+
<S.MetaLeftSection>
21+
<BaseSkeleton width={80} height={16} radius={6} />
22+
<BaseSkeleton width={100} height={16} radius={6} />
23+
</S.MetaLeftSection>
24+
<S.MetaRightSection>
25+
<BaseSkeleton width={24} height={24} radius={12} />
26+
</S.MetaRightSection>
27+
</S.MetaWrapper>
28+
29+
{/* 본문 내용 스켈레톤 */}
30+
<S.ContentSection>
31+
<BaseSkeleton width="60%" height={21} radius={6} style={{ marginBottom: '2px' }} />
32+
<BaseSkeleton width="90%" height={21} radius={6} style={{ marginBottom: '2px' }} />
33+
<BaseSkeleton width="30%" height={21} radius={6} />
34+
</S.ContentSection>
35+
</S.ContentWrapper>
36+
37+
{/* 하단 댓글 카운트 및 북마크 영역 스켈레톤 */}
38+
<S.BottomSection>
39+
<S.BottomLeftSection>
40+
<BaseSkeleton width={60} height={16} radius={6} />
41+
</S.BottomLeftSection>
42+
<S.BottomRightSection>
43+
<BaseSkeleton width={24} height={24} radius={12} />
44+
</S.BottomRightSection>
45+
</S.BottomSection>
46+
</S.ArticleWrapper>
47+
48+
{/* 댓글 목록 스켈레톤 */}
49+
<S.CommentsSection>
50+
{new Array(3).fill('').map((_, idx) => (
51+
<S.CommentItem key={idx} index={idx}>
52+
<S.CommentHeader>
53+
<BaseSkeleton width={50} height={14} radius={6} />
54+
<BaseSkeleton width={20} height={14} radius={6} />
55+
</S.CommentHeader>
56+
<S.CommentContent>
57+
<BaseSkeleton width={150} height={32} radius={6} />
58+
<BaseSkeleton width={100} height={14} radius={6} />
59+
</S.CommentContent>
60+
</S.CommentItem>
61+
))}
62+
</S.CommentsSection>
63+
</>
64+
);
65+
};
66+
67+
export default ComplaintDetailSkeleton;

‎services/ahhachul.com/src/constants/subway.tsx‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@ export const subwayLineHexColors = (line: number) => {
8484
case 12:
8585
return '#0054a6';
8686
case 13:
87-
return '0090D2';
87+
return '#0090D2';
8888
case 14:
8989
return '#6789CA';
9090
case 15:

0 commit comments

Comments
 (0)