import React from 'react';
import { View, StyleSheet, Image } from 'react-native';
import { BedrockRoute, useNavigation } from 'react-native-bedrock';
import { Txt, GridList, colors } from '@toss-design-system/react-native';
export const Route = BedrockRoute('/0-1-def', {
validateParams: (params) => params,
component: Def,
});
function Def() {
const navigation = useNavigation();
const handleSkiLesson = () => {
navigation.navigate('/0-2-flow', { lessonType: 'ski' });
};
const handleBoardLesson = () => {
navigation.navigate('/0-2-flow', { lessonType: 'board' });
};
return (
<View style={styles.container}>
<View style={styles.textContainer}>
<Txt color={colors.grey700} style={styles.subtitle}>
지금 나에게 필요한
</Txt>
<Txt fontWeight="bold" style={styles.title}>
강습유형을 선택해주세요
</Txt>
</View>
<View style={styles.gridContainer}>
<GridList column={2} style={styles.gridList}>
<GridList.Item
image={
<Image
source={{ uri: 'https://www.xxxxxxxxxxxxx' }}
style={styles.lessonImage}
resizeMode="contain"
/>
}
title="스키강습"
onPress={handleSkiLesson}
style={styles.gridItem}
/>
<GridList.Item
image={
<Image
source={{ uri: 'https://www.xxxxxxxxxxx' }}
style={styles.lessonImage}
resizeMode="contain"
/>
}
title="보드강습"
onPress={handleBoardLesson}
style={styles.gridItem}
/>
</GridList>
</View>
</View>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: 'white',
paddingHorizontal: 20,
paddingTop: '40%',
},
header: {
flexDirection: 'row',
justifyContent: 'space-between',
alignItems: 'center',
marginBottom: 20,
},
headerLeft: {
padding: 10,
},
headerCenter: {
flex: 1,
alignItems: 'center',
},
headerRight: {
flexDirection: 'row',
padding: 10,
},
headerIcon: {
marginLeft: 10,
},
profileImageContainer: {
alignItems: 'center',
marginBottom: 20,
},
textContainer: {
alignItems: 'center',
marginBottom: 0,
},
subtitle: {
marginBottom: 0,
textAlign: 'center',
},
title: {
textAlign: 'center',
fontWeight: 'bold',
},
gridContainer: {
flex: 1,
justifyContent: 'flex-start',
marginTop: 16,
},
gridList: {
gap: 0,
},
gridItem: {
backgroundColor: '#f8f9fa',
borderRadius: 12,
padding: 20,
alignItems: 'center',
minHeight: 83,
},
lessonImage: {
width: 36,
height: 36,
marginBottom: 8,
marginTop: 8,
},
});
<Txt color={colors.grey700} style={styles.subtitle}>
지금 나에게 필요한
</Txt>
<Txt fontWeight="bold" style={styles.title}>
강습유형을 선택해주세요
</Txt>
</View>
{/* 강습 유형 선택 그리드 */}
<View style={styles.gridContainer}>
<GridList column={2} style={styles.gridList}>
<GridList.Item
image={
<Image
source={{ uri: 'https://www.rideordie.kr/images/skier.png' }}
style={styles.lessonImage}
resizeMode="contain"
/>
}
title="스키강습"
onPress={handleSkiLesson}
style={styles.gridItem}
/>
<GridList.Item
image={
<Image
source={{ uri: 'https://www.rideordie.kr/images/boarder.png' }}
style={styles.lessonImage}
resizeMode="contain"
/>
}
title="보드강습"
onPress={handleBoardLesson}
style={styles.gridItem}
/>
</GridList>
</View>
</View>
);
}
오류코드에 명시된 파일인 0-1-def.tsx 코드 전문 첨부합니다.
어디가 문제인지 파악이 전혀 되지 않습니다. 
