@@ -22,21 +22,30 @@ type Option = {
22
22
// eslint-disable-next-line @typescript-eslint/no-explicit-any
23
23
icon : any ;
24
24
} ;
25
-
26
- type SidebarContentProps = { } ;
25
+ type SidebarContentProps = { onClose : ( ) => void } ;
27
26
28
27
const options : Option [ ] = [
29
28
{
30
29
name : 'Home' ,
31
30
link : '/' ,
32
31
icon : GripVerticalIcon ,
32
+ disabled : false ,
33
+ } ,
34
+ { name : 'Exams' , link : '/exams' , icon : ClockIcon , disabled : false } ,
35
+ {
36
+ name : 'Notifications' ,
37
+ link : '/profile/notifications' ,
38
+ icon : BellIcon ,
39
+ disabled : false ,
33
40
} ,
34
- { name : 'Exams' , link : '/exams' , icon : ClockIcon } ,
35
- { name : 'Notifications' , link : '/profile/notifications' , icon : BellIcon } ,
36
41
{ name : 'Payments' , link : '' , icon : CheckCircleIcon , disabled : true } ,
37
- { name : 'Settings' , link : '/profile/profile' , icon : SettingsIcon } ,
42
+ {
43
+ name : 'Settings' ,
44
+ link : '/profile/profile' ,
45
+ icon : SettingsIcon ,
46
+ disabled : false ,
47
+ } ,
38
48
] ;
39
-
40
49
const SidebarContent : FC < SidebarContentProps > = ( props ) => {
41
50
const {
42
51
user : { firstName } ,
@@ -46,7 +55,12 @@ const SidebarContent: FC<SidebarContentProps> = (props) => {
46
55
const { top } = useSafeAreaInsets ( ) ;
47
56
48
57
return (
49
- < Box display = "flex" flexDirection = "column" bg = "white" style = { { paddingTop : top , height : '100%' } } >
58
+ < Box
59
+ display = "flex"
60
+ flexDirection = "column"
61
+ bg = "white"
62
+ style = { { paddingTop : top , height : '100%' } }
63
+ >
50
64
< Box overflow = "hidden" width = "100%" >
51
65
< Box display = "flex" flexDirection = "row" p = "$5" >
52
66
< Avatar bgColor = "#D6A8D4" size = "lg" borderRadius = "$full" >
@@ -69,8 +83,13 @@ const SidebarContent: FC<SidebarContentProps> = (props) => {
69
83
</ Box >
70
84
< Box mt = "$10" pl = "$5" >
71
85
{ options . map ( ( option ) => (
72
- < Link key = { option . name } href = { option . link } disabled = { options . disabled } asChild >
73
- < TouchableOpacity >
86
+ < Link
87
+ key = { option . name }
88
+ href = { option . link }
89
+ disabled = { options . disabled }
90
+ asChild
91
+ >
92
+ < TouchableOpacity onPress = { props . onClose } >
74
93
< Box
75
94
display = "flex"
76
95
flexDirection = "row"
@@ -87,7 +106,11 @@ const SidebarContent: FC<SidebarContentProps> = (props) => {
87
106
color = { option . disabled ? 'gray' : 'black' }
88
107
/>
89
108
) }
90
- < Text fontSize = "$lg" color = { option . disabled ? 'gray' : 'black' } fontWeight = "$bold" >
109
+ < Text
110
+ fontSize = "$lg"
111
+ color = { option . disabled ? 'gray' : 'black' }
112
+ fontWeight = "$bold"
113
+ >
91
114
{ option . name }
92
115
</ Text >
93
116
</ Box >
@@ -97,6 +120,7 @@ const SidebarContent: FC<SidebarContentProps> = (props) => {
97
120
< Box h = { 0.3 } backgroundColor = "black" m = { 17 } > </ Box >
98
121
< TouchableOpacity
99
122
onPress = { ( ) => {
123
+ props . onClose ( ) ;
100
124
setShowModal ( true ) ;
101
125
} }
102
126
>
0 commit comments