Skip to content

fix: PLI-14 내 여행 페이지 퍼블리싱 피드백 반영 #84

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
sunjung23 wants to merge 2 commits into
base: develop
Choose a base branch
from
Open

fix: PLI-14 내 여행 페이지 퍼블리싱 피드백 반영 #84

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
5438dc1
fix: PLI-14 (퍼블리싱 피드백 반영)
sunjung23 Apr 4, 2026
2eb1767
fix: PLI-14 (퍼블리싱 피드백 반영)
sunjung23 Apr 4, 2026
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions src/assets/icons/calendarwhite.svg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
1 change: 1 addition & 0 deletions src/assets/icons/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -53,6 +53,7 @@ export { default as KebabShareIcon } from './kebabshare.svg';
export { default as KebabTrashIcon } from './kebabtrash.svg';
export { default as KebabMapIcon } from './kebabmap.svg';
export { default as PlusGrayIcon } from './plusgray.svg';
export { default as CalendarWhiteIcon } from './calendarwhite.svg';


export { default as SearchingIcon } from './searching.svg';
Expand Down
4 changes: 2 additions & 2 deletions src/components/ui/Chip.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,7 @@ export const Chip = React.memo<ChipProps>(
accessibilityRole="button"
accessibilityLabel={label}
accessibilityState={{ selected: isSelected }}>
<Text className={`text-p ${isSelected ? 'text-white' : 'text-black'}`}>{label}</Text>
<Text className={`text-p ${isSelected ? 'text-white' : 'text-gray'}`}>{label}</Text>
</Pressable>
);
}
Expand All @@ -35,7 +35,7 @@ export const Chip = React.memo<ChipProps>(
<View
className={`px-4 py-[6px] rounded-2xl ${isSelected ? 'bg-main' : 'bg-chip'} ${className ?? ''}`}
accessibilityLabel={label}>
<Text className={`text-p ${isSelected ? 'text-white' : 'text-black'}`}>{label}</Text>
<Text className={`text-p ${isSelected ? 'text-white' : 'text-gray'}`}>{label}</Text>
</View>
);
},
Expand Down
43 changes: 24 additions & 19 deletions src/screens/myTrip/MyTripScreen.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -122,7 +122,7 @@ const MyTripScreen: React.FC = () => {
<View className="flex-row items-start justify-between">
<View>
<Text className="text-h font-pretendardBold text-black">내여행</Text>
<Text className="mt-1 text-p text-gray">{filteredTripCardItems.length}개의 여행이 있어요</Text>
<Text className="text-p text-gray">{filteredTripCardItems.length}개의 여행이 있어요</Text>
</View>

<TouchableOpacity
Expand All @@ -136,48 +136,53 @@ const MyTripScreen: React.FC = () => {
</View>

{/* Chip */}
<View className="mt-7 flex-row">
<View className="mt-4 flex-row">
<Chip
label="전체"
onPress={() => setSelectedChip('전체')}
isSelected={selectedChip === '전체'}
className="mr-2"
className="mr-2 px-4 py-2"
/>
<Chip
label="예정된 여행"
onPress={() => setSelectedChip('예정된 여행')}
isSelected={selectedChip === '예정된 여행'}
className="mr-2"
className="mr-2 px-4 py-2"
/>
<Chip
label="지난 여행"
onPress={() => setSelectedChip('지난 여행')}
isSelected={selectedChip === '지난 여행'}
className="mr-2 px-4 py-2"
/>
</View>

{/* TripCard */}
{filteredTripCardItems.length === 0 ? (
<View className="mt-6">
<View className="mt-4">
<EmptyMapScreen />
</View>
) : (
filteredTripCardItems.map((tripCardItem) => (
<TripCard
filteredTripCardItems.map((tripCardItem, index) => (
<View
key={tripCardItem.id}
city={tripCardItem.city}
dateText={tripCardItem.dateText}
scheduleText={tripCardItem.scheduleText}
scheduleCountText={tripCardItem.scheduleCountText}
imageSource={tripCardItem.imageSource}
status={tripCardItem.status}
isOpen={openCardId === tripCardItem.id}
onToggle={() =>
setOpenCardId((prev) => (prev === tripCardItem.id ? null : tripCardItem.id))
}
style={{ zIndex: filteredTripCardItems.length - index }}
>
<TripTimeline items={timelineItems} />
</TripCard>
<TripCard
city={tripCardItem.city}
dateText={tripCardItem.dateText}
scheduleText={tripCardItem.scheduleText}
scheduleCountText={tripCardItem.scheduleCountText}
imageSource={tripCardItem.imageSource}
status={tripCardItem.status}
isOpen={openCardId === tripCardItem.id}
onToggle={() =>
setOpenCardId((prev) => (prev === tripCardItem.id ? null : tripCardItem.id))
}
>
<TripTimeline items={timelineItems} />
</TripCard>
</View>
))
)}
</View>
Expand Down
36 changes: 18 additions & 18 deletions src/screens/myTrip/components/TripCard.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@ import { Image, Pressable, Text, View } from 'react-native';
import { TripStatusChip } from '@/components/ui';
import {
PlaceIcon,
CalendarIcon,
CalendarWhiteIcon,
ChevronDownIcon,
ChevronUpIcon,
} from '@/assets/icons';
Expand Down Expand Up @@ -37,7 +37,7 @@ const TripCard = ({
<View
className="mt-6 rounded-[8px] bg-white"
style={{
shadowColor: '#000',
shadowColor: 'rgba(0, 0, 0, 0.25)',
shadowOffset: { width: 0, height: 0 },
shadowOpacity: 0.25,
shadowRadius: 3,
Expand All @@ -51,32 +51,32 @@ const TripCard = ({
<View pointerEvents="none"/>

{/*TripStatusChip*/}
<View className="absolute top-2 left-2">
<View className="absolute top-[13px] left-[15px]">
<TripStatusChip status={status} />
</View>

{/*City*/}
<View className="absolute bottom-5 left-4">
<Text className="ml-[1.2px] text-h1 font-pretendardBold text-white">{city}</Text>
<View className="absolute bottom-3 left-3">
<Text className="text-h1 font-pretendardBold text-white">{city}</Text>

{/*Date*/}
<View className="flex-row items-center">
<CalendarIcon width={12} height={12} />
<Text className="ml-[4px] text-p1 text-white">{dateText}</Text>
<CalendarWhiteIcon width={14} height={14}/>
<Text className="px-1 text-p1 text-white">{dateText}</Text>
</View>
</View>
</View>

{/*schedule*/}
<View className="flex-row items-center justify-between px-4 py-3">
<View className="flex-row items-center">
<PlaceIcon width={14} height={14} />
<Text className="ml-1 text-p text-gray">{scheduleText}개의 일정</Text>
<Text className="ml-3 text-p text-gray">{scheduleCountText}일간</Text>
</View>
<Pressable onPress={onToggle}>
<View className="flex-row items-center justify-between px-4 py-3">
<View className="flex-row items-center">
<PlaceIcon width={14} height={14} />
<Text className="ml-1 text-p text-gray">{scheduleText}개의 일정</Text>
<Text className="ml-3 text-p text-gray">{scheduleCountText}일간</Text>
</View>

{/*Toggle*/}
<Pressable onPress={onToggle}>
{/*Toggle*/}
<View className="flex-row items-center">
<Text className="text-p text-main">
{isOpen ? '일정 접기 ' : '전체 보기 '}
Expand All @@ -88,13 +88,13 @@ const TripCard = ({
<ChevronDownIcon width={14} height={14} />
)}
</View>
</Pressable>
</View>
</View>
</Pressable>

{isOpen && <View className="border-t border-chip px-4 py-4">{children}</View>}
</View>
</View>
);
};

export default TripCard;
export default TripCard;
2 changes: 1 addition & 1 deletion src/screens/myTrip/components/TripTimeline.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -136,7 +136,7 @@ const TripTimeline: React.FC<TripTimelineProps> = ({ items }) => {
</View>
</View>

<View className="ml-1 flex-1 self-start rounded-[8px] bg-[#F4F0EC80] px-4 py-3">
<View className="ml-1 flex-1 self-start rounded-[8px] bg-[#F4F0EC80] px-3 py-[10px]">
<Text className="text-h3 font-pretendardSemiBold text-black">{item.title}</Text>

<View className="mt-[2px] flex-row items-center">
Expand Down