@@ -50,7 +50,6 @@ export default function PapersPage() {
50
50
setSuggestions ( results . map ( r => r . item ) . slice ( 0 , 10 ) )
51
51
} , [ searchText , fuse , selectedSubject ] )
52
52
53
-
54
53
const handleSelectSubject = ( subject : string ) => {
55
54
setSelectedSubject ( subject )
56
55
setSearchText ( subject )
@@ -70,19 +69,40 @@ export default function PapersPage() {
70
69
return ( ) => document . removeEventListener ( "mousedown" , handleClickOutside )
71
70
} , [ ] )
72
71
73
- const handleSubmit = ( ) => {
72
+ const handleSubmit = async ( ) => {
74
73
if ( ! selectedSubject || ! selectedExam || ! selectedSlot || ! selectedYear ) {
75
- alert ( "Please fill all fields before submitting" )
74
+ alert ( "⚠️ Please fill all fields before submitting. " )
76
75
return
77
76
}
78
- console . log ( { subject : selectedSubject , exam : selectedExam , slot : selectedSlot , year : selectedYear } )
77
+
78
+ try {
79
+ await axios . post ( "/api/request" , {
80
+ subject : selectedSubject ,
81
+ exam : selectedExam ,
82
+ slot : selectedSlot ,
83
+ year : selectedYear ,
84
+ } )
85
+
86
+ alert ( "✅ Your paper request was submitted successfully 🎉" )
87
+
88
+ setSearchText ( "" )
89
+ setSelectedSubject ( null )
90
+ setSelectedExam ( null )
91
+ setSelectedSlot ( null )
92
+ setSelectedYear ( null )
93
+ } catch ( error ) {
94
+ console . error ( "Error submitting request:" , error )
95
+ alert ( "❌ Failed to submit your request. Please try again later." )
96
+ }
79
97
}
80
98
81
99
return (
82
100
< div className = "min-h-screen bg-[#F3F5FF] dark:bg-[#070114] text-black dark:text-white px-6 py-12" >
83
101
< main >
84
102
< div className = "max-w-4xl mx-auto text-center mb-16" >
85
- < h2 className = "font-vipnabd text-3xl md:text-4xl font-extrabold mb-12" > Specific Paper Request</ h2 >
103
+ < h2 className = "font-vipnabd text-3xl md:text-4xl font-extrabold mb-12" >
104
+ Specific Paper Request
105
+ </ h2 >
86
106
87
107
< div className = "relative max-w-xl mx-auto mb-8 font-play" >
88
108
< Input
@@ -101,9 +121,14 @@ export default function PapersPage() {
101
121
</ svg >
102
122
</ button >
103
123
{ suggestions . length > 0 && (
104
- < ul ref = { suggestionsRef } className = "absolute z-20 max-h-[250px] w-full max-w-xl overflow-y-auto rounded-md rounded-t-none border border-t-0 bg-white text-center shadow-lg dark:bg-[#303771]" >
124
+ < ul
125
+ ref = { suggestionsRef }
126
+ className = "absolute z-20 max-h-[250px] w-full max-w-xl overflow-y-auto rounded-md rounded-t-none border border-t-0 bg-white text-center shadow-lg dark:bg-[#303771]" >
105
127
{ suggestions . map ( ( s , idx ) => (
106
- < li key = { idx } onClick = { ( ) => handleSelectSubject ( s ) } className = "cursor-pointer truncate p-2 hover:bg-gray-100 dark:hover:bg-gray-800" >
128
+ < li
129
+ key = { idx }
130
+ onClick = { ( ) => handleSelectSubject ( s ) }
131
+ className = "cursor-pointer truncate p-2 hover:bg-gray-100 dark:hover:bg-gray-800" >
107
132
{ s }
108
133
</ li >
109
134
) ) }
@@ -112,41 +137,54 @@ export default function PapersPage() {
112
137
</ div >
113
138
114
139
< div className = "flex justify-center gap-4 mb-8" >
115
- < Select onValueChange = { setSelectedExam } disabled = { ! selectedSubject } >
140
+ < Select onValueChange = { setSelectedExam } disabled = { ! selectedSubject } value = { selectedExam || undefined } >
116
141
< SelectTrigger className = "w-32" > < SelectValue placeholder = "Exam" /> </ SelectTrigger >
117
- < SelectContent > { exams . map ( ( exam ) => < SelectItem key = { exam } value = { exam } > { exam } </ SelectItem > ) } </ SelectContent >
142
+ < SelectContent >
143
+ { exams . map ( ( exam ) => (
144
+ < SelectItem key = { exam } value = { exam } > { exam } </ SelectItem >
145
+ ) ) }
146
+ </ SelectContent >
118
147
</ Select >
119
- < Select onValueChange = { setSelectedSlot } disabled = { ! selectedSubject } >
148
+ < Select onValueChange = { setSelectedSlot } disabled = { ! selectedSubject } value = { selectedSlot || undefined } >
120
149
< SelectTrigger className = "w-32" > < SelectValue placeholder = "Slot" /> </ SelectTrigger >
121
- < SelectContent > { slots . map ( ( slot ) => < SelectItem key = { slot } value = { slot } > { slot } </ SelectItem > ) } </ SelectContent >
150
+ < SelectContent >
151
+ { slots . map ( ( slot ) => (
152
+ < SelectItem key = { slot } value = { slot } > { slot } </ SelectItem >
153
+ ) ) }
154
+ </ SelectContent >
122
155
</ Select >
123
- < Select onValueChange = { setSelectedYear } disabled = { ! selectedSubject } >
156
+ < Select onValueChange = { setSelectedYear } disabled = { ! selectedSubject } value = { selectedYear || undefined } >
124
157
< SelectTrigger className = "w-32" > < SelectValue placeholder = "Year" /> </ SelectTrigger >
125
158
< SelectContent >
126
159
{ [ ...years ] . sort ( ( a , b ) => Number ( b ) - Number ( a ) ) . map ( ( year ) => (
127
160
< SelectItem key = { year } value = { year } > { year } </ SelectItem >
128
161
) ) }
129
162
</ SelectContent >
130
-
131
163
</ Select >
132
164
</ div >
133
165
134
- < Button className = "px-8 py-3 rounded-lg text-base bg-[#4A55FF] hover:bg-[#3A44CC] text-white dark:bg-[#9EA8FF] dark:hover:bg-[#7D86E5] dark:text-black" onClick = { handleSubmit } > Submit</ Button >
166
+ < Button
167
+ className = "px-8 py-3 rounded-lg text-base bg-[#4A55FF] hover:bg-[#3A44CC] text-white dark:bg-[#9EA8FF] dark:hover:bg-[#7D86E5] dark:text-black"
168
+ onClick = { handleSubmit }
169
+ >
170
+ Submit
171
+ </ Button >
135
172
</ div >
136
173
137
- { }
138
174
< div className = "max-w-6xl mx-auto mt-16 text-center" >
139
175
< div className = "relative mb-8 text-center" >
140
176
< h3 className = "font-vipnabd text-2xl font-bold" > Explore More</ h3 >
141
177
< div className = "absolute right-0 top-1/2 -translate-y-1/2" >
142
- < Button variant = "outline" className = "border-gray-300 dark:border-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800" >
178
+ < Button
179
+ variant = "outline"
180
+ className = "border-gray-300 dark:border-gray-700 text-gray-700 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-800"
181
+ >
143
182
View All
144
183
< ArrowRight className = "w-4 h-4 ml-2" />
145
184
</ Button >
146
185
</ div >
147
186
</ div >
148
187
149
-
150
188
< div className = "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-6 justify-center" >
151
189
{ [ 1 , 2 , 3 , 4 ] . map ( ( index ) => (
152
190
< div key = { index } className = "bg-white dark:bg-[#303771] rounded-lg overflow-hidden shadow-md" >
0 commit comments