Skip to content

Commit

Permalink
Merge pull request #49 from capstone-maru/feat/shared-api
Browse files Browse the repository at this point in the history 
feat: Shared API
  • Loading branch information
@cjeongmin
cjeongmin authored Apr 10, 2024
2 parents 9a4bfd3 + 4fc2c3d commit be196a4
Show file tree
Hide file tree
Showing 24 changed files with 628 additions and 316 deletions.
2 changes: 1 addition & 1 deletion src/app/globals.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -11,8 +11,8 @@
html,
body {
height: 100dvh;
min-width: 90rem;
max-width: 100dvw;
overflow-x: hidden;
}

nav {
Expand Down
67 changes: 20 additions & 47 deletions src/app/pages/main-page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,7 @@ import styled from 'styled-components';
import { CircularButton } from '@/components';
import { UserCard } from '@/components/main-page';
import { useAuthActions, useAuthValue, useUserData } from '@/features/auth';
import { useRecommendationMate } from '@/features/recommendation';

const styles = {
container: styled.div`
Expand Down Expand Up @@ -48,6 +49,7 @@ const styles = {
`,
mateRecommendation: styled.div`
display: flex;
flex-grow: 1;
flex-direction: row;
gap: 2.625rem;
overflow-x: auto;
Expand All @@ -66,7 +68,12 @@ export function MainPage() {
const auth = useAuthValue();
const { setAuthUserData } = useAuthActions();

const { data } = useUserData(auth?.accessToken !== undefined);
const { data: userData } = useUserData(auth?.accessToken !== undefined);

const { data: recommendationMates } = useRecommendationMate({
memberId: auth?.user?.memberId ?? 'undefined',
enabled: auth?.accessToken != null,
});

const [, setMap] = useState<naver.maps.Map | null>(null);

Expand Down Expand Up @@ -96,13 +103,13 @@ export function MainPage() {
}, []);

useEffect(() => {
if (data !== undefined) {
setAuthUserData(data);
if (data.initialized) {
if (userData !== undefined) {
setAuthUserData(userData);
if (userData.initialized) {
// router.replace('/profile');
}
}
}, [data, router, setAuthUserData]);
}, [userData, router, setAuthUserData]);

return (
<styles.container>
Expand All @@ -118,48 +125,14 @@ export function MainPage() {
onClick={handleScrollLeft}
/>
<styles.mateRecommendation ref={scrollRef}>
<Link href="/profile/memberId">
<UserCard
name="김마루"
address="성북 길음동"
birth={new Date(2000, 5, 27)}
/>
</Link>
<Link href="/profile/memberId">
<UserCard
name="김마루"
address="성북 길음동"
birth={new Date(2000, 5, 27)}
/>
</Link>
<Link href="/profile/memberId">
<UserCard
name="김마루"
address="성북 길음동"
birth={new Date(2000, 5, 27)}
/>
</Link>
<Link href="/profile/memberId">
<UserCard
name="김마루"
address="성북 길음동"
birth={new Date(2000, 5, 27)}
/>
</Link>
<Link href="/profile/memberId">
<UserCard
name="김마루"
address="성북 길음동"
birth={new Date(2000, 5, 27)}
/>
</Link>
<Link href="/profile/memberId">
<UserCard
name="김마루"
address="성북 길음동"
birth={new Date(2000, 5, 27)}
/>
</Link>
{recommendationMates?.map(({ name, similarity, userId }) => (
<Link key={userId} href={`/profile/${userId}`}>
<UserCard
name={name}
percentage={Math.floor(similarity * 100)}
/>
</Link>
))}
</styles.mateRecommendation>
<CircularButton
direction="right"
Expand Down
42 changes: 24 additions & 18 deletions src/app/pages/shared-post-page.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,13 +13,16 @@ import {
ImageGrid,
MiniCircularProfileImage,
} from '@/components/shared-post-page';
import { useAuthValue } from '@/features/auth';
import { useSharedPost } from '@/features/shared';
import { getAge } from '@/shared';

const styles = {
container: styled.div`
background: var(--background, #f7f6f9);
position: relative;
width: 100dvw;
width: 100%;
min-height: 100%;
height: fit-content;
Expand Down Expand Up @@ -348,10 +351,6 @@ const dummyParticipants = [
'https://s3-alpha-sig.figma.com/img/59a5/3c6f/ae49249b51c7d5d81ab89eeb0bf610f1?Expires=1713139200&Key-Pair-Id=APKAQ4GOSFWCVNEHN3O4&Signature=UL1aEtuLGKayYQ5L9ORuMtrpAC9EkOdVY6s2yYhNVuMpzbgXJ0Umi48NzpdET9P6fgCeOxrrwPA9gUVlTpWXWMNPapo-SJmV-7h~kNl23ClcmQ0I1ybBXrNn7ywYZWbnuNvFjSaBmtqBPaWR1F-E69qwN6ohhNS2j3piYxrCuR~ep6iAxAyrGP7Bt9mvDg9NYw5R~HsYWkcyEIF7kdfeJMsZ~SKhJ5aQTfngxKZEW7eB31bO5bXxQcCXi3Qia~zNkUAysBPp8Tx-pZQafjLHGM-ZogjUgOcKT9TyEDufX436AQUx~cBooRbkfXJpyexKXzs20iU4Y8HswRwXVJyJuw__',
];

interface Props {
post: { title: string; content: string };
}

function Item({ label, data }: { label: string; data: string }) {
return (
<styles.dealItemContainer>
Expand All @@ -361,7 +360,7 @@ function Item({ label, data }: { label: string; data: string }) {
);
}

export function SharedPostPage({ post }: Props) {
export function SharedPostPage({ postId }: { postId: number }) {
const [map, setMap] = useState<naver.maps.Map | null>(null);

const handleClickTitle = () => {
Expand All @@ -382,12 +381,19 @@ export function SharedPostPage({ post }: Props) {
);
}, []);

const auth = useAuthValue();

const { data: sharedPost } = useSharedPost({
postId,
enabled: auth?.accessToken !== undefined,
});

return (
<styles.container>
<styles.houseInfo>
<ImageGrid images={dummyImages} />
<styles.titleRow>
<styles.title>{post.title}</styles.title>
<styles.title>{sharedPost?.data?.title}</styles.title>
<Bookmark
hasBorder={false}
color="#000"
Expand Down Expand Up @@ -427,10 +433,7 @@ export function SharedPostPage({ post }: Props) {
<styles.detailInfoContanier>
<styles.detailInfoTitle>상세 정보</styles.detailInfoTitle>
<styles.detailInfoContent>
안녕하세요! 저는 현재 룸메이트를 찾고 있는 정연수입니다. 서울시
정릉동에서 함께 살아갈 룸메이트를 구하고 있습니다. 주로 밤에
작업을 하며 새벽 2시~3시쯤에 취침합니다. 관심있으신 분들 연락
주세요!
{sharedPost?.data.content}
</styles.detailInfoContent>
</styles.detailInfoContanier>
<styles.locationInfoContainer>
Expand All @@ -440,7 +443,7 @@ export function SharedPostPage({ post }: Props) {
handleClickTitle();
}}
>
서울특별시 성북구 정릉로 104
{sharedPost?.data.roomInfo.address.roadAddress}
</styles.locationInfoContent>
<styles.map id="map" />
<styles.locationEnvInfo>
Expand Down Expand Up @@ -474,16 +477,19 @@ export function SharedPostPage({ post }: Props) {
url="https://s3-alpha-sig.figma.com/img/59a5/3c6f/ae49249b51c7d5d81ab89eeb0bf610f1?Expires=1713139200&Key-Pair-Id=APKAQ4GOSFWCVNEHN3O4&Signature=UL1aEtuLGKayYQ5L9ORuMtrpAC9EkOdVY6s2yYhNVuMpzbgXJ0Umi48NzpdET9P6fgCeOxrrwPA9gUVlTpWXWMNPapo-SJmV-7h~kNl23ClcmQ0I1ybBXrNn7ywYZWbnuNvFjSaBmtqBPaWR1F-E69qwN6ohhNS2j3piYxrCuR~ep6iAxAyrGP7Bt9mvDg9NYw5R~HsYWkcyEIF7kdfeJMsZ~SKhJ5aQTfngxKZEW7eB31bO5bXxQcCXi3Qia~zNkUAysBPp8Tx-pZQafjLHGM-ZogjUgOcKT9TyEDufX436AQUx~cBooRbkfXJpyexKXzs20iU4Y8HswRwXVJyJuw__"
/>
<styles.hostInfoContent>
<h1>김마루</h1>
<p>24세</p>
<h1>{sharedPost?.data.publisherAccount.nickname}</h1>
<p>
{sharedPost != null
? `${getAge(+sharedPost.data.publisherAccount.birthYear)}세`
: ''}
</p>
<p>성북 길음동</p>
</styles.hostInfoContent>
</styles.hostInfoContainer>
<styles.hostCardContent>
<p className="essential">비흡연</p>
<p>새벽형</p>
<p>친구초대 괜찮아요</p>
<p className="essential">실내취식 괜찮아요</p>
{sharedPost?.data.publisherAccount.myCardFeatures.map(value => (
<p key={value}>{value}</p>
))}
</styles.hostCardContent>
<styles.hostButtonsContainer>
<button type="button" className="color">
Expand Down
Loading

0 comments on commit be196a4

Please sign in to comment.