119 |

120 |

121 |

122 |

123 |

124 | 138 |

139 |

Chat

140 |

141 |

142 |

143 |

148 |

149 |

{currentChat.fullname}

150 |

151 | Notificaion 152 | 153 | {read} 154 | 155 |

156 |

157 |

158 |

159 |

160 |

Active

161 |

162 |

163 |

164 |

165 | Active Conversations 166 | 167 | {count} 168 | 169 |

170 | 171 |

172 | {connectedplayer.map((player) => ( 173 | 181 | ))} 182 |

183 |

184 |

185 |

186 |

187 |

188 |

189 |

190 | {message.map((msg) => 191 | msg.myself ? ( 192 |

196 |

197 |

198 | {msg?.type === "video" ? ( 199 |

200 | ) : msg.type === "image" ? ( 201 |

202 | ) : ( 203 |

204 | {msg.message ? msg.message : ""} 205 |

206 | )} 207 |

208 |

209 | {dateFormat(msg.createdAt, "shortTime")} 210 |

211 |

212 |

213 |

214 |

215 | ) : ( 216 |

220 |

221 |

222 | {msg?.type === "video" ? ( 223 |

224 | ) : msg.type === "image" ? ( 225 |

226 | ) : ( 227 |

228 | {msg.message ? msg.message : ""} 229 |

230 | )} 231 |

232 |

233 | {dateFormat(msg.createdAt, "shortTime")} 234 |

235 |

236 |

237 |

238 |

239 | ) 240 | )} 241 |

242 |

243 |

244 |

245 |

246 |

247 |

248 | setInputMessage(e.target.value)} 250 | type="text" 251 | value={inputMessage} 252 | className="flex w-full border rounded-xl focus:outline-none focus:border-indigo-300 pl-4 h-10" 253 | /> 254 | 257 |

258 |

259 |

260 | 281 |

282 |

283 |

284 |

285 |

286 |

287 |

288 | ); 289 | } 290 | 291 | export default Chat; 292 | -------------------------------------------------------------------------------- /src/components/Home.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { toast, Toaster } from "react-hot-toast"; 3 | import { useNavigate } from "react-router-dom"; 4 | 5 | function Home() { 6 | const navigate = useNavigate(); 7 | // toast.success('WelCome',{duration: 6000}) 8 | 9 | return ( 10 |

11 | 12 | {/* */} 13 |

17 |

18 | {/* */} 19 |

20 |

21 | What We Do 22 |

23 | 24 |

25 | Designed to make scouting easier{" "} 26 |

27 |

28 | {/* */} 29 | {/* */} 30 |

31 |

{ 39 | navigate("/search"); 40 | }} 41 | > 42 | {/* */} 43 |

44 |

45 | {/* */} 46 | 56 |

57 |

58 | Search Player 59 |

60 |

61 | This is a wider card with supporting text below as a natural 62 | content. 63 |

64 |

65 | {/* */} 66 |

67 |

{ 76 | navigate("/chat"); 77 | }} 78 | > 79 | {/* */} 80 |

81 |

82 | {/* */} 83 | 94 |

95 |

96 | Player Chat 97 |

98 |

99 | This is a wider card with supporting text below as a natural 100 | content. 101 |

102 |

103 | {/* */} 104 |

105 |

{ 114 | navigate("/player"); 115 | }} 116 | > 117 | {/* */} 118 |

119 |

120 | {/* */} 121 | 132 |

133 |

134 | Player Profiles 135 |

136 |

137 | This is a wider card with supporting text below as a natural 138 | content. 139 |

140 |

141 | {/* */} 142 |

143 |

{ 151 | navigate("/profile"); 152 | }} 153 | > 154 | {/* */} 155 |

156 |

157 | {/* */} 158 | 169 |

170 |

171 | My Profile 172 |

173 |

174 | This is a wider card with supporting text below as a natural 175 | content. 176 |

177 |

178 | {/* */} 179 |

180 | 181 |

{ 190 | navigate("/selectedplayer"); 191 | }} 192 | > 193 | {/* */} 194 |

195 |

196 | {/* */} 197 | 207 |

208 |

209 | Selected Players 210 |

211 |

212 | This is a wider card with supporting text below as a natural 213 | content. 214 |

215 |

216 | {/* */} 217 |

218 | 219 | 220 |

229 | {/* */} 230 | {/* */} 231 | {/* */} 232 |

233 |

234 | {/* */} 235 |

236 |

237 |

238 | ); 239 | } 240 | 241 | export default Home; 242 | -------------------------------------------------------------------------------- /src/components/Notification.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { Link } from "react-router-dom"; 3 | import Instance from "../config/Instance"; 4 | 5 | function Notification() { 6 | const token = localStorage.getItem("token"); 7 | const [users, setUsers] = useState([]); 8 | console.log(users); 9 | useEffect(() => { 10 | Instance 11 | .get("/admin/connectedPlayers",{ 12 | headers: { Authorization: `Bearer ${token}` }, 13 | }).then((response) => { 14 | const allUsers = response.data.connectPlayer; 15 | setUsers(allUsers); 16 | }) 17 | .catch((error) => { 18 | console.log(error); 19 | if (error.response) { 20 | toast.error(error.response.data.error); 21 | } else { 22 | toast.error(error.message); 23 | } 24 | }); 25 | }, []); 26 | return ( 27 |

28 | 29 |

30 |

31 |

32 |

Users

33 |

34 |

35 |

36 |

37 | 42 |

43 | 50 |

51 |

52 |

53 | 58 |

59 | 66 |

67 |

68 |

69 |

70 | 71 | 77 | 78 | 82 |

83 |

84 |

85 |

86 | 87 | 88 | 89 | 92 | 95 | 98 | 101 | 104 | 105 | 106 | 107 | {users.map((data, index) => ( 108 | 109 | 134 | 139 | 144 | 149 | 170 | 171 | ))} 172 | 173 |

90 \| User 91 \|	93 \| Profession 94 \|	96 \| Joined at 97 \|	99 \| Total Renting 100 \|	102 \| Status 103 \|
110 \| 111 \| 112 \| 117 \| 118 \| 119 \| 124 \| 125 \| 129 \| {data.name} 130 \| 131 \| 132 \| 133 \|	135 \| 136 \| {data.profession} 137 \| 138 \|	140 \| 141 \| {data.joined} 142 \| 143 \|	145 \| 146 \| {data.rentings} 147 \| 148 \|	150 \| {data.status == "Unblocked" && ( 151 \| 152 \| 156 \| Active 157 \| 158 \| )} 159 \| 160 \| {data.status == "Blocked" && ( 161 \| 162 \| 166 \| Inactive 167 \| 168 \| )} 169 \|

174 |

175 | 176 | Showing 1 to 4 of 50 Entries 177 | 178 |

179 | 182 | 185 |

186 |

187 |

188 |

189 |

190 |

191 | 192 |

193 | ); 194 | } 195 | 196 | export default Notification; 197 | -------------------------------------------------------------------------------- /src/components/Player.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { toast, Toaster } from "react-hot-toast"; 3 | import { Link, useNavigate } from "react-router-dom"; 4 | import Instance from "../config/Instance"; 5 | import ReactPaginate from "react-paginate"; 6 | import "../pagenation.css" 7 | 8 | function Player() { 9 | const scoutId = localStorage.getItem("scoutId"); 10 | const token =localStorage.getItem("token") 11 | const [search, setSearch] = useState(""); 12 | const [connectedPlayers, setConnectedPlayers] = useState([]); 13 | const [player, setPlayer] = useState([]); 14 | const [change, setChange] = useState(false); 15 | const navigate = useNavigate(); 16 | 17 | // Pagination...................... 18 | const [currentPage, setCurrentPage] = useState(0); 19 | const [itemsPerPage, setItemsPerPage] = useState(8); 20 | const dataToRender = player.slice( 21 | currentPage * itemsPerPage, 22 | (currentPage + 1) * itemsPerPage 23 | ); 24 | 25 | 26 | const handlePageChange = ({ selected }) => { 27 | setCurrentPage(selected); 28 | }; 29 | 30 | const searchData = (player) => { 31 | return search === "" 32 | ? player 33 | : player.userId.fullname.toLowerCase().includes(search) || 34 | player.position.toLowerCase().includes(search); 35 | }; 36 | 37 | 38 | 39 | 40 | 41 | useEffect(() => { 42 | Instance.get("/admin/allplayer",{ 43 | headers:{Authorization:`Bearer ${token}`} 44 | }).then((response) => { 45 | setPlayer(response.data.player); 46 | connected(); 47 | }); 48 | }, [change]); 49 | 50 | const connected = () => { 51 | Instance 52 | .get(`/admin/connectedPlayers`,{ 53 | headers:{Authorization:`Bearer ${token}`}, 54 | }) 55 | .then((response) => { 56 | setConnectedPlayers(response.data.connectPlayer); 57 | }); 58 | }; 59 | 60 | const Connect = (id) => { 61 | Instance 62 | .post( 63 | `/scout/connectPlayer?userId=${id}`,{},{ 64 | headers:{Authorization:`Bearer ${token}`} 65 | }) 66 | .then((response) => { 67 | toast.success(response.data.msg); 68 | change === true ? setChange(false) : setChange(true); 69 | }) 70 | .catch((error) => { 71 | if (error.response) { 72 | toast.error(error.response.data.error); 73 | } else { 74 | toast.error(error.message); 75 | } 76 | }); 77 | }; 78 | 79 | 80 | 81 | 82 | 83 | 84 | return ( 85 |

86 | 87 | 91 | 92 |

93 |

94 |

95 |

96 |

97 |

98 |

99 | Meet the players 100 |

101 | {/* */} 102 |

103 | A player scout typically attends as many football matches as 104 | possible to evaluate targets first hand. Scouts who wish to 105 | identify promising young players typically attend 106 | lower-league club games,. 107 |

108 |

Connect and Message!

109 |

110 |

111 | 112 |

113 | 133 |

134 | 135 |

136 |

137 |

138 | {dataToRender.filter(searchData).map((player) => ( 139 |

140 | 141 |

142 |

147 |

148 | 149 |

150 | {player?.position} 151 |

152 |

153 |

154 |

155 | {player?.userId.fullname} 156 |

157 |

158 | Age: 159 | {player?.age} 160 |

161 |

162 |

163 | {player?.nationality} 164 |

165 |

166 |

167 | {connectedPlayers.includes(player.userId._id) ? ( 168 | 174 | ) : ( 175 | 181 | )} 182 |

183 |

184 | ))} 185 |

186 |

187 |

188 |

189 |

190 |

191 |

192 | 206 |

207 | ); 208 | } 209 | 210 | export default Player; 211 | -------------------------------------------------------------------------------- /src/components/Profile.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { toast, Toaster } from "react-hot-toast"; 3 | import moment from "moment"; 4 | import { useNavigate } from "react-router-dom"; 5 | import Instance from "../config/Instance"; 6 | function Profile() { 7 | const navigate = useNavigate() 8 | const token = localStorage.getItem("token"); 9 | const [scout, setscout] = useState(""); 10 | const [scoutData, setScoutData] = useState(""); 11 | useEffect(() => { 12 | showProfile(); 13 | }, []); 14 | const showProfile = async () => { 15 | await Instance 16 | .get("/scout/showProfile", { 17 | headers: { Authorization: `Bearer ${token} ` }, 18 | }) 19 | .then((res) => { 20 | setscout(res.data.scout); 21 | setScoutData(res.data.scoutData); 22 | }) 23 | .catch((error) => { 24 | toast.error(error.response.data.error); 25 | }); 26 | }; 27 | return ( 28 |

29 | 30 |

31 |

32 |

36 |

37 |

38 | 46 |

47 |

48 |

53 |

54 |

{scout?.fullname}

55 | {/* 56 | 70 | */} 71 |

72 | 73 |

Scout

74 |

{scoutData?.nationality}

75 |

76 | 77 |

78 |

79 |

80 | Scout Personal Info 81 |

82 |

83 |

85 | Full name: 86 | {scout?.fullname} 87 |
89 | Birthday: 90 | 91 | {moment(scoutData?.dateOfBirth).format("YYYY/DD/MM")} 92 | 93 |
95 | Mobile: 96 | {scout?.phone} 97 |
99 | Email: 100 | {scout?.email} 101 |
103 | Location: 104 | {scoutData?.nationality} 105 |
107 | Languages: 108 | {scoutData?.language} 109 |
111 | Age: 112 | {scoutData?.age} 113 |
115 | Experience: 116 | 117 | {scoutData?.experience} years 118 | 119 |
121 | CurrentClub: 122 | {scoutData?.currentClub} 123 |
125 | PreviousClub: 126 | {scoutData?.pastClub} 127 |
129 | Awards: 130 | {scoutData?.awards} 131 |
133 | Joined: 134 | 135 | {moment(scoutData?.joinedAt).format("YYYY/MM/DD")} 136 | 137 |
139 | Elsewhere: 140 | 141 | 158 | 159 | 160 | 175 | 176 | 177 | 192 | 193 | 194 | 208 | 209 |

211 |

212 | {/* */} 213 |

214 |

215 |

216 |

About

217 |

218 | Player scouts or physical scouts evaluate the talent of 219 | footballers with a view to signing them on a professional 220 | contract for their employers. Some scouts focus on discovering 221 | promising young players and future stars, others are employed to 222 | run the rule on potential signings. Smaller clubs might only 223 | scout within their own country region, while larger and richer 224 | clubs can have extensive international scouting networks 225 |

226 |

227 | 228 |

229 |

230 |

231 |

232 |

233 |

234 | ); 235 | } 236 | 237 | export default Profile; 238 | -------------------------------------------------------------------------------- /src/components/RegisterScout.jsx: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | import React, { useEffect, useState } from "react"; 3 | import { toast, Toaster } from "react-hot-toast"; 4 | import { useNavigate } from "react-router-dom"; 5 | import moment from "moment"; 6 | import Instance from "../config/Instance"; 7 | const token = localStorage.getItem("token"); 8 | 9 | function RegisterScout() { 10 | const [profile, setProfile] = useState(""); 11 | const [profileUrl, setProfileUrl] = useState(""); 12 | const [dateOfBirth, setDataofbirth] = useState(""); 13 | const [age, setAge] = useState(""); 14 | const [nationality, setNationality] = useState(""); 15 | const [experience, setExperience] = useState(""); 16 | const [currentClub, setCurrentClub] = useState(""); 17 | const [pastClub, setPastclub] = useState(""); 18 | const [language, setLanguage] = useState(""); 19 | const [awards, setAwards] = useState(""); 20 | const [address, setAddress] = useState(""); 21 | const [description, setDescription] = useState(""); 22 | useEffect(() => { 23 | showProfile(); 24 | }, []); 25 | 26 | const showProfile = async () => { 27 | await Instance 28 | .get("/scout/showProfile", { 29 | headers: { Authorization: `Bearer ${token} ` }, 30 | }) 31 | .then((res) => { 32 | res.data.updation && toast.success("updation successful"); 33 | setDataofbirth(res.data.scoutData.dateOfBirth); 34 | setAge(res.data.scoutData.age); 35 | setProfileUrl(res.data.scoutData.profileUrl); 36 | setNationality(res.data.scoutData.nationality); 37 | setExperience(res.data.scoutData.experience); 38 | setCurrentClub(res.data.scoutData.currentClub); 39 | setPastclub(res.data.scoutData.pastClub); 40 | setLanguage(res.data.scoutData.language); 41 | setAwards(res.data.scoutData.awards); 42 | setAddress(res.data.scoutData.address); 43 | setDescription(res.data.scoutData.description); 44 | }) 45 | .catch((error) => { 46 | console.log(error); 47 | toast.error(error.response.data.error); 48 | }); 49 | }; 50 | 51 | //creating area 52 | 53 | const cloudAPI = "dqrsgqgot"; 54 | const navigate = useNavigate(); 55 | 56 | const handleUpload = async (e) => { 57 | e.preventDefault(); 58 | const formData = new FormData(); 59 | formData.append("file", profile); 60 | formData.append("upload_preset", "fotwebcloud"); 61 | await axios 62 | .post( 63 | `https://api.cloudinary.com/v1_1/${cloudAPI}/image/upload`, 64 | formData 65 | ) 66 | .then(async (res) => { 67 | const profileUrl = res.data.secure_url; 68 | const token = localStorage.getItem("token"); 69 | await Instance 70 | .post( 71 | `/scout/scoutRegister`, 72 | { 73 | profileUrl, 74 | dateOfBirth, 75 | age, 76 | nationality, 77 | experience, 78 | currentClub, 79 | pastClub, 80 | language, 81 | awards, 82 | address, 83 | description, 84 | }, 85 | { headers: { Authorization: `Bearer ${token}` } } 86 | ) 87 | .then((response) => { 88 | if (response.data.scout.status=="Pending") { 89 | navigate("/waiting",{replace:true}); 90 | }else{ 91 | toast.success("Profile Added Successfully"); 92 | navigate("/home") 93 | } 94 | }) 95 | .catch((error) => { 96 | if (error.response) { 97 | toast.error(error.response.data.error); 98 | } else { 99 | toast.error(error.message); 100 | } 101 | }); 102 | }); 103 | }; 104 | return ( 105 |

106 | 107 |

Pleace fill the form

108 |

109 | A football scout attends football matches on the behalf of clubs to 110 | collect intelligence 111 |

112 |

113 |

114 |

115 | 116 | Profile 117 | 118 |

119 |

120 |

121 |

126 |

{" "} 127 |

128 | 132 | Upload a your photo 133 | { 135 | setProfile(e.target.files[0]); 136 | }} 137 | id="file-upload" 138 | name="file-upload" 139 | type="file" 140 | className="sr-only" 141 | accept="image/x-png,image/gif,image/jpeg" 142 | /> 143 | 144 |

145 |

146 |

147 |

148 | 149 | 150 | {dateOfBirth.length >1 ? ( 151 | 152 |

153 | 157 | Date of birth 158 | 159 | { 162 | setDataofbirth(e.target.value); 163 | }} 164 | id="" 165 | type="text" 166 | className="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring" 167 | /> 168 |

169 | ) : ( 170 |

171 | 175 | Date of birth 176 | 177 | { 180 | setDataofbirth(e.target.value); 181 | }} 182 | id="" 183 | type="date" 184 | className="block w-full px-4 py-2 mt-2 text-gray-700 bg-white border border-gray-300 rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-500 dark:focus:border-blue-500 focus:outline-none focus:ring" 185 | /> 186 |

187 | )} 188 | 189 | 190 | 191 | 192 |

193 | 197 | Age 198 | 199 | { 202 | setAge(e.target.value); 203 | }} 204 | type="number" 205 | className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" 206 | required 207 | /> 208 |

209 |

210 | 214 | Nationality 215 | 216 | { 219 | setNationality(e.target.value); 220 | }} 221 | type="text" 222 | className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" 223 | required 224 | /> 225 |

226 |

227 | 231 | Scouting Experience 232 | 233 | { 236 | setExperience(e.target.value); 237 | }} 238 | type="number" 239 | className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" 240 | placeholder="years" 241 | required 242 | /> 243 |

244 |

245 | 249 | Current club 250 | 251 | { 254 | setCurrentClub(e.target.value); 255 | }} 256 | type="text" 257 | id="website" 258 | className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" 259 | required 260 | /> 261 |

262 |

263 | 267 | Past Club 268 | 269 | { 272 | setPastclub(e.target.value); 273 | }} 274 | type="text" 275 | id="visitors" 276 | className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" 277 | placeholder="" 278 | required 279 | /> 280 |

281 |

282 | 286 | Languages 287 | 288 | { 291 | setLanguage(e.target.value); 292 | }} 293 | type="text" 294 | id="visitors" 295 | className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" 296 | placeholder="" 297 | required 298 | /> 299 |

300 |

301 |

302 | 306 | Awards 307 | 308 | { 311 | setAwards(e.target.value); 312 | }} 313 | type="text" 314 | className="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500" 315 | required 316 | /> 317 |

318 |

319 | 323 | ADDRESS 324 | 325 | 334 |

335 |

336 | 340 | About you 341 | 342 | 351 |

352 |

353 | 359 |

360 |

361 | {/* */} 369 |

370 | ); 371 | } 372 | 373 | export default RegisterScout; 374 | -------------------------------------------------------------------------------- /src/components/Search.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { toast, Toaster } from "react-hot-toast"; 3 | import { Link, useNavigate, } from "react-router-dom"; 4 | import Instance from "../config/Instance"; 5 | import Navbar from "./layout/Navbar"; 6 | import ReactPaginate from "react-paginate"; 7 | import "../pagenation.css" 8 | 9 | 10 | function Search() { 11 | const [search, setSearch] = useState(""); 12 | const [connectedPlayers, setConnectedPlayers] = useState([]); 13 | const [player, setPlayer] = useState([]); 14 | const [tempPlayer, setTempPlayer] = useState([]); 15 | const [change, setChange] = useState(false); 16 | const scoutId = localStorage.getItem("scoutId"); 17 | const token = localStorage.getItem("token"); 18 | const navigate =useNavigate() 19 | 20 | // Pagination...................... 21 | const [currentPage, setCurrentPage] = useState(0); 22 | const [itemsPerPage, setItemsPerPage] = useState(8); 23 | const dataToRender = tempPlayer.slice( 24 | currentPage * itemsPerPage, 25 | (currentPage + 1) * itemsPerPage 26 | ); 27 | 28 | const handlePageChange = ({ selected }) => { 29 | setCurrentPage(selected); 30 | }; 31 | 32 | 33 | const searchData = (player) => { 34 | return search === "" 35 | ? player 36 | : player.userId.fullname.toLowerCase().includes(search) || 37 | player.position.toLowerCase().includes(search) || 38 | player.age.toString().includes(search.toLowerCase()); 39 | }; 40 | 41 | 42 | const filterByPosition = (category) => { 43 | let filtered = player.filter((data) => data.position === category); 44 | setTempPlayer(filtered); 45 | }; 46 | const filterByAge = (age) => { 47 | let filtered = player.filter((data) => data.age <= age); 48 | setTempPlayer(filtered); 49 | }; 50 | const filterByAgeup = (age) => { 51 | let filtered = player.filter((data) => data.age > age); 52 | setTempPlayer(filtered); 53 | }; 54 | const all = () => { 55 | setTempPlayer(player); 56 | }; 57 | useEffect(() => { 58 | const token = localStorage.getItem("token"); 59 | Instance.get("/admin/allplayer", { 60 | headers: { Authorization: `Bearer ${token}` }, 61 | }).then((response) => { 62 | setPlayer(response.data.player); 63 | setTempPlayer(response.data.player); 64 | connected(); 65 | }); 66 | }, [change]); 67 | 68 | const connected = () => { 69 | Instance 70 | .get( 71 | `/admin/connectedPlayers`,{ 72 | headers:{Authorization: `Bearer ${token}`} 73 | } 74 | ) 75 | .then((response) => { 76 | console.log(response.data.connectPlayer); 77 | setConnectedPlayers(response.data.connectPlayer); 78 | }); 79 | }; 80 | 81 | const Connect = (id) => { 82 | change === true ? setChange(false) : setChange(true); 83 | Instance 84 | .post( 85 | `/scout/connectPlayer?userId=${id}`,{},{ 86 | headers:{Authorization : `Bearer ${token}`} 87 | }) 88 | .then((response) => { 89 | toast.success(response.data.msg); 90 | }) 91 | .catch((error) => { 92 | toast.error(error.response.data.error); 93 | }); 94 | }; 95 | 96 | return ( 97 |

98 | 99 | 103 | 104 |

105 |

106 |

107 |

108 |

109 | 129 |

130 | 131 |

132 | 138 | 144 | 150 | 156 | 162 | 168 | 174 |

175 | 176 |

177 |

178 |

179 | {dataToRender.filter(searchData).map((player) => ( 180 |

181 | 182 |

183 |

188 |

189 | 190 |

191 |

192 | 193 | {player.position} 194 | {" "} 195 |

196 |

197 | 198 |

199 |

200 |

201 | {player?.userId.fullname} 202 |

203 |

204 | Age: 205 | {player?.age} 206 |

207 |

208 |

209 | {player?.nationality} 210 |

211 |

212 | 213 |

214 | {connectedPlayers.includes(player.userId._id) ? ( 215 | 218 | ) : ( 219 | 225 | )} 226 |

227 |

228 | ))} 229 |

230 |

231 |

232 |

233 |

234 |

235 |

236 | 250 |

251 | ); 252 | } 253 | 254 | export default Search; 255 | -------------------------------------------------------------------------------- /src/components/SelectedPlayer.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { toast, Toaster } from "react-hot-toast"; 3 | import { Link } from "react-router-dom"; 4 | import Instance from "../config/Instance"; 5 | 6 | function SelectedPlayer() { 7 | const [search, setSearch] = useState(""); 8 | const [Connectedplayer, setConnectedplayer] = useState([]); 9 | const [change, setChange] = useState(false); 10 | 11 | const searchData = (Connectedplayer) => { 12 | return search === "" 13 | ? Connectedplayer 14 | : Connectedplayer.fullname.toLowerCase().includes(search); 15 | }; 16 | 17 | useEffect(() => { 18 | const token = localStorage.getItem("token"); 19 | const connected = async () => { 20 | const { data } = await Instance.post( 21 | "/admin/connectedUsers", 22 | {}, 23 | { 24 | headers: { Authorization: `Bearer ${token}` }, 25 | } 26 | ); 27 | setConnectedplayer(data.connectedPlayers); 28 | console.log(setConnectedplayer); 29 | setScoutCount(data.connectedPlayers.length); 30 | }; 31 | connected(); 32 | }, [change]); 33 | 34 | const remove = (userId) => { 35 | const token = localStorage.getItem("token"); 36 | Instance 37 | .post(`/admin/removeUser/${userId}`,{}, 38 | { 39 | headers: { Authorization: `Bearer ${token}` }, 40 | } 41 | ) 42 | .then((response) => { 43 | change === true ? setChange(false) : setChange(true); 44 | toast.success(response.data.msg); 45 | }); 46 | }; 47 | 48 | 49 | return ( 50 |

51 | 52 | 53 |

54 |

55 |

56 |

Users

57 |

58 |

59 |

60 |

61 | 65 |

66 | 73 |

74 |

75 |

76 |

77 | 78 | 84 | 85 | { 87 | let searchValue = e.target.value.toLocaleLowerCase(); 88 | setSearch(searchValue); 89 | }} 90 | placeholder="Search" 91 | class="appearance-none rounded-r rounded-l sm:rounded-l-none border border-gray-400 border-b block pl-8 pr-6 py-2 w-full bg-white text-sm placeholder-gray-400 text-gray-700 focus:bg-white focus:placeholder-gray-600 focus:text-gray-700 focus:outline-none" 92 | /> 93 |

94 |

95 |

96 |

97 | 98 | 99 | 100 | 103 | 106 | 109 | 112 | 113 | 116 | 117 | 118 | 119 | {Connectedplayer.filter(searchData).map((data) => ( 120 | 121 | 138 | 143 | 148 | 151 | 152 | 164 | 165 | ))} 166 | 167 |

101 \| Player 102 \|	104 \| Player 105 \|	107 \| Email 108 \|	110 \| phone Number 111 \|	114 \| Action 115 \|
122 \| 123 \| 128 \| 129 \| 133 \| {data.fullname} 134 \| 135 \| 136 \| 137 \|	139 \| 140 \| {data.fullname} 141 \| 142 \|	144 \| 145 \| {data.email} 146 \| 147 \|	149 \| {data.phone} 150 \|	153 \| 163 \|

168 |

169 |

170 | 173 | 176 |

177 |

178 |

179 |

180 |

181 |

182 | 183 |

184 | ); 185 | } 186 | 187 | export default SelectedPlayer; 188 | -------------------------------------------------------------------------------- /src/components/SinglePage.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { useLocation, useNavigate } from "react-router-dom"; 3 | import Instance from "../config/Instance"; 4 | import Navbar from "./layout/Navbar"; 5 | 6 | function SinglePage() { 7 | const navigate = useNavigate(); 8 | const location = useLocation(); 9 | const playerId = location?.state; 10 | const token = localStorage.getItem("token"); 11 | const [player, setPlayer] = useState([]); 12 | const [gallery, setGallery] = useState([]); 13 | useEffect(() => { 14 | Instance.get(`/scout/singlePlayer/${playerId}`, { 15 | headers: { Authorization: `Bearer ${token}` }, 16 | }).then((response) => { 17 | setPlayer(response.data.player); 18 | setGallery(response.data.gallery); 19 | }); 20 | }, []); 21 | 22 | return ( 23 |

24 | 25 |

26 |

27 |

28 |

33 |

34 | 35 |

36 |

37 | {player.userId?.fullname} 38 |

39 |

40 | {player?.position} 41 |

42 |

43 | 47 | Connect with{" "} 48 | @{player.userId?.fullname} 49 | 50 |

51 | 52 |

53 |

54 | Recent activites 55 |

56 |

57 | 61 |

66 | Player Position : 67 | 68 | {player?.position} 69 | 70 | 71 | 72 | 76 |

81 | player currentTeam : 82 | 83 | {player?.currentTeam} 84 | 85 | 86 | 87 | 91 |

96 | Player Age :{player?.age} 97 | 98 | 102 |

107 | Player height : 108 | {player?.height} cm 109 | 110 | {" "} 111 | Player Foot : 112 | {player?.foot} 113 | 114 | 115 | 116 | 120 |

125 | player country :- 126 | 127 | {player?.nationality} 128 | 129 | 130 | 131 | 135 |

140 | player past Team :- 141 | 142 | {player?.previousTeam} 143 | 144 | 145 | 149 |

154 | player Awards :- 155 | 156 | {player?.awards} 157 | 158 | 159 | 163 |

168 | player Language :- 169 | 170 | {player?.language} 171 | 172 | 173 | 177 |

182 | player profile updated :- 183 | 184 | {player?.userId?.updatedAt} 185 | 186 | 187 |

188 |

189 |

190 |

191 |

192 |

193 | Player gallery 194 |

195 |

196 | 197 |

198 |

199 | {gallery && gallery.map((item) => ( 200 |

201 | {item.imageUrl.map((url, index) => ( 202 |

203 |

204 |

205 |

206 |

211 |

212 |

213 |

214 |

215 | ))} 216 |

217 | ))} 218 |

219 |

220 |

221 |

222 | ); 223 | } 224 | 225 | export default SinglePage; 226 | -------------------------------------------------------------------------------- /src/components/auth/Login.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { useNavigate } from "react-router-dom"; 3 | import { toast, Toaster } from "react-hot-toast"; 4 | import { useFormik } from "formik"; 5 | import { loginValidation } from "../../helpers/validate"; 6 | import Instance from "../../config/Instance"; 7 | 8 | function Login() { 9 | const navigate = useNavigate(); 10 | const Formik = useFormik({ 11 | initialValues: { 12 | email: "", 13 | password: "", 14 | }, 15 | validate: loginValidation, 16 | validateOnBlur: false, 17 | validateOnChange: false, 18 | onSubmit: async (values) => { 19 | await Instance.post("/scout/scoutLogin", { values }) 20 | .then((res) => { 21 | let { token } = res.data; 22 | const scout=res.data.scout.status 23 | localStorage.setItem("token", token); 24 | localStorage.setItem("fullname", res.data.scout.fullname); 25 | localStorage.setItem("scoutId", res.data.scout._id); 26 | if(scout=="Pending"){ 27 | navigate("/register"); 28 | }else{ 29 | navigate("/home",{replace:true}); 30 | } 31 | }) 32 | .catch((error) => { 33 | console.log(error); 34 | toast.error(error.response.data.error); 35 | }); 36 | }, 37 | }); 38 | 39 | return ( 40 |

41 | 42 |

43 |

44 | Get started today 45 |

46 | 47 | 48 |

52 |

53 | 54 |

55 | 56 | Email 57 | 58 | 59 |

60 | 67 | 68 | 69 | 83 | 84 |

85 |

86 | 87 |

88 | 89 | Password 90 | 91 | 92 |

93 | 100 | 101 | 102 | 122 | 123 |

124 |

125 | 126 | 132 | 133 |

134 | No account? 135 | { 137 | navigate("/signup"); 138 | }} 139 | className="underline" 140 | href="" 141 | > 142 | Sign up 143 | 144 |

145 |

146 |

147 |

148 | ); 149 | } 150 | 151 | export default Login; 152 | -------------------------------------------------------------------------------- /src/components/auth/Signup.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Navigate, useNavigate } from "react-router-dom"; 3 | import { toast, Toaster } from "react-hot-toast"; 4 | import { useFormik } from "formik"; 5 | import {siginupValidation} from "../../helpers/validate"; 6 | import Instance from "../../config/Instance"; 7 | function SignUp() { 8 | const navigate = useNavigate(); 9 | const Formik = useFormik({ 10 | initialValues: { 11 | fullname: "", 12 | email: "", 13 | phone:"", 14 | password: "", 15 | }, 16 | validate :siginupValidation, 17 | validateOnBlur: false, 18 | validateOnChange: false, 19 | onSubmit: async (values) => { 20 | await Instance.post('/scout/scoutSignup',{values}).then((res)=>{ 21 | navigate('/') 22 | }).catch((error)=>{ 23 | console.log(error) 24 | toast.error(error.response.data.error) 25 | }) 26 | }, 27 | }); 28 | return ( 29 |

30 | 31 | 32 | 33 |

34 |

35 |

36 |

37 | 51 |

52 |

53 | {" "} 54 | Your journey starts here 55 |

56 |

57 | We Never Stop Dreaming Big{" "} 58 |

59 |

60 |

61 |

62 |

63 | Sign Up 64 |

65 |

66 |

67 | 68 | Username 69 | 70 | 77 |

78 |

79 | 80 | Enter Email 81 | 82 | 89 |

90 |

91 | 92 | Phone Number 93 | 94 | 101 |

102 |

103 | 104 | Password 105 | 106 | 113 |

114 |

115 | 121 |

122 | {/* 126 | Recover password! 127 | */} 128 | {navigate('/')}} 131 | class="w-full text-center font-medium text-gray-500" 132 | > 133 | alredy have an account 134 | 135 |

136 |

137 |

138 |

139 |

140 |

141 |

142 | 143 |

144 | ); 145 | } 146 | 147 | export default SignUp; 148 | -------------------------------------------------------------------------------- /src/components/layout/Footer.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | const Footer=()=> { 4 | return ( 5 |

6 | 172 | 173 |

174 | 175 | ) 176 | } 177 | 178 | export default Footer 179 | -------------------------------------------------------------------------------- /src/components/layout/Navbar.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { useNavigate } from "react-router-dom"; 3 | 4 | const Navbar = () => { 5 | const navigate = useNavigate(); 6 | return ( 7 |

8 | 152 |

153 | ); 154 | }; 155 | 156 | export default Navbar; 157 | -------------------------------------------------------------------------------- /src/config/Instance.js: -------------------------------------------------------------------------------- 1 | import axios from "axios"; 2 | 3 | const Instance = axios.create({ 4 | baseURL: "https://fotweb.evotym.site/api", 5 | // baseURL: "http://localhost:7007/api", 6 | }); 7 | 8 | 9 | 10 | export default Instance; -------------------------------------------------------------------------------- /src/error/errorPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | 3 | function ErrorPage() { 4 | return ( 5 |

6 | {/* */} 7 |

8 | 9 |

10 |

11 |

12 |

13 | 187 | 188 |

189 |

The stuff you were looking for doesn't exist 190 |

191 | 193 | Retry 194 |

195 |

196 |

197 |

198 |

199 | ) 200 | } 201 | 202 | export default ErrorPage 203 | -------------------------------------------------------------------------------- /src/helpers/validate.js: -------------------------------------------------------------------------------- 1 | import { toast } from "react-hot-toast"; 2 | 3 | 4 | 5 | 6 | export async function siginupValidation(values) { 7 | let error = {} 8 | 9 | if (!values.fullname) { 10 | return error.fullname = toast.error('UserName Required....🤔!'); 11 | } else if (!values.email) { 12 | return error.email = toast.error('Email Required....😒!'); 13 | } else if (!/^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/i.test(values.email)) { 14 | return error.email = toast.error('Invalid email....!'); 15 | } else if (!values.phone) { 16 | return error.phone = toast.error('phone Required....🙌!'); 17 | } else if (values.phone.length < 9) { 18 | return error.phone = toast.error('phone number error...!📞') 19 | } else if (!values.password) { 20 | return error.password = toast.error('password Required....🙌!'); 21 | } else if (values.password.length < 4) { 22 | return error.password = toast.error('password must be more than 4! characters') 23 | } 24 | 25 | 26 | } 27 | 28 | export async function loginValidation(values){ 29 | let error= {} 30 | if(!values.email){ 31 | return error.email =toast.error('Email Required....😒!'); 32 | }else if(!/^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/i.test(values.email)){ 33 | return error.email =toast.error('Invalid email....!'); 34 | }else if (!values.password) { 35 | return error.password = toast.error('password Required....🙌!'); 36 | } 37 | } 38 | 39 | 40 | // ** validate full name** 41 | function fullnameVerify(error = {}, values) { 42 | if (!values.fullname) { 43 | error.fullname = toast.error('UserName Required....🤔!'); 44 | } 45 | return error; 46 | } 47 | // emailvalidation 48 | function emailVerify(error = {}, values) { 49 | if (!values.email) { 50 | error.email = toast.error('Email Required....😒!'); 51 | } else if (!/^[\w-\.]+@([\w-]+\.)+[\w-]{2,4}$/i.test(values.email)) { 52 | error.email = toast.error('Invalid email....!'); 53 | 54 | } 55 | return error; 56 | } 57 | // passwordvalidation 58 | function passwordVerify(error = {}, values) { 59 | if (!values.password) { 60 | error.password = toast.error('password Required....🙌!'); 61 | } else if (values.password.length < 4) { 62 | error.password = toast.error('password must be more than 4! characters') 63 | } 64 | return error; 65 | } 66 | 67 | function phoneVerify(error = {}, values) { 68 | if (!values.phone) { 69 | error.phone = toast.error('phone Required....🙌!'); 70 | } else if (values.phone.length < 9) { 71 | error.phone = toast.error('phone number error...!🤷‍♂️') 72 | } 73 | return error; 74 | } -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; -------------------------------------------------------------------------------- /src/main.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom/client' 3 | import App from './App' 4 | import './index.css' 5 | 6 | ReactDOM.createRoot(document.getElementById('root')).render( 7 | 8 | ) 9 | -------------------------------------------------------------------------------- /src/page/ChatPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Chat from '../components/Chat' 3 | import Footer from '../components/layout/Footer' 4 | import Navbar from '../components/layout/Navbar' 5 | 6 | function ChatPage() { 7 | return ( 8 |

9 | 10 | 11 |

13 | ) 14 | } 15 | 16 | export default ChatPage 17 | -------------------------------------------------------------------------------- /src/page/HomePage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Home from '../components/Home' 3 | import Footer from '../components/layout/Footer' 4 | 5 | function HomePage() { 6 | return ( 7 |

8 | 9 |

11 | ) 12 | } 13 | 14 | export default HomePage 15 | -------------------------------------------------------------------------------- /src/page/LoginPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Login from '../components/auth/Login' 3 | import Footer from '../components/layout/Footer' 4 | 5 | const LoginPage = () => { 6 | return ( 7 |

8 | 9 |

11 | ) 12 | } 13 | 14 | export default LoginPage 15 | -------------------------------------------------------------------------------- /src/page/PlayerPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Navbar from '../components/layout/Navbar' 3 | import Player from '../components/Player' 4 | import Footer from '../components/layout/Footer' 5 | 6 | function PlayerPage() { 7 | return ( 8 |

9 | 10 | 11 |

13 | ) 14 | } 15 | 16 | export default PlayerPage 17 | -------------------------------------------------------------------------------- /src/page/ProfilePage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Navbar from '../components/layout/Navbar' 3 | import Profile from '../components/Profile' 4 | import Footer from '../components/layout/Footer' 5 | 6 | function ProfilePage() { 7 | return ( 8 |

9 | 10 | 11 |

13 | ) 14 | } 15 | 16 | export default ProfilePage 17 | -------------------------------------------------------------------------------- /src/page/RegisterPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Footer from '../components/layout/Footer' 3 | import RegisterScout from '../components/RegisterScout' 4 | 5 | function RegisterPage() { 6 | return ( 7 |

8 | 9 |

11 | ) 12 | } 13 | 14 | export default RegisterPage 15 | -------------------------------------------------------------------------------- /src/page/SelectedPlayerPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import Navbar from '../components/layout/Navbar' 3 | import SelectedPlayer from '../components/SelectedPlayer' 4 | import Footer from '../components/layout/Footer' 5 | 6 | function SelectedPlayerPage() { 7 | return ( 8 |

9 | 10 | 11 |

13 | ) 14 | } 15 | 16 | export default SelectedPlayerPage 17 | -------------------------------------------------------------------------------- /src/page/SignupPage.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import SignUp from '../components/auth/Signup' 3 | import Footer from '../components/layout/Footer' 4 | 5 | const SignupPage = () => { 6 | return ( 7 |

8 | 9 |

11 | ) 12 | } 13 | 14 | export default SignupPage 15 | -------------------------------------------------------------------------------- /src/page/searchPage.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect } from "react"; 2 | import Footer from "../components/layout/Footer"; 3 | import Navbar from "../components/layout/Navbar"; 4 | import Search from "../components/Search"; 5 | 6 | function searchPage() { 7 | const scoutId = localStorage.getItem("scoutId"); 8 | 9 | useEffect 10 | return ( 11 |

12 | 13 | 14 |

16 | ); 17 | } 18 | 19 | export default searchPage; 20 | -------------------------------------------------------------------------------- /src/page/waitingPage.jsx: -------------------------------------------------------------------------------- 1 | 2 | import React, { useEffect } from "react"; 3 | import { toast, Toaster } from "react-hot-toast"; 4 | import { useNavigate } from "react-router-dom"; 5 | import Instance from "../config/Instance"; 6 | 7 | const waitingPage = () => { 8 | const navigate = useNavigate(); 9 | const token = localStorage.getItem("token"); 10 | useEffect(() => { 11 | showProfile(); 12 | }, []); 13 | const showProfile = async () => { 14 | await Instance 15 | .get("/scout/showProfile", { 16 | headers: { Authorization: `Bearer ${token} ` }, 17 | }) 18 | .then((response) => { 19 | if (response.data.scout.status == "Pending") { 20 | toast.loading("We are processing your request..."); 21 | setTimeout(function () { 22 | toast.dismiss(); 23 | }, 30000); 24 | }else{ 25 | navigate("/home"); 26 | } 27 | }) 28 | .catch((error) => { 29 | toast.error(error.response.data.error); 30 | }); 31 | }; 32 | 33 | return ( 34 |

40 | 41 |

Please Wait

42 |

43 | We are processing your request... 44 |

45 | 51 |

52 | ); 53 | }; 54 | 55 | export default waitingPage; 56 | -------------------------------------------------------------------------------- /src/pagenation.css: -------------------------------------------------------------------------------- 1 | .pagination { 2 | display: flex; 3 | justify-content: center; 4 | margin-top: 10px; 5 | margin-bottom: 10px 6 | } 7 | 8 | .page-link { 9 | background-color: #fff; 10 | border: 1px solid #e2e8f0; 11 | color: #4a5568; 12 | padding: 0.5rem 0.75rem; 13 | margin: 0 0.25rem; 14 | border-radius: 0.25rem; 15 | transition: all 0.3s ease-in-out; 16 | font-weight: bold; 17 | font-size: 0.875rem; 18 | } 19 | 20 | .page-link:hover { 21 | background-color: #edf2f7; 22 | border-color: #cbd5e0; 23 | } 24 | 25 | .active { 26 | background-color: #4a5568; 27 | color: #fff; 28 | border-color: #4a5568; 29 | } 30 | 31 | .disabled { 32 | color: #a0aec0; 33 | pointer-events: none; 34 | } 35 | 36 | .previous, 37 | .next { 38 | background-color: #fff; 39 | border: 1px solid #e2e8f0; 40 | color: #4a5568; 41 | padding: 0.5rem 0.75rem; 42 | margin: 0 0.25rem; 43 | border-radius: 0.25rem; 44 | transition: all 0.3s ease-in-out; 45 | font-weight: bold; 46 | font-size: 0.875rem; 47 | } 48 | 49 | .previous:hover, 50 | .next:hover { 51 | background-color: #edf2f7; 52 | border-color: #cbd5e0; 53 | } 54 | 55 | .previous:focus, 56 | .next:focus { 57 | outline: none; 58 | } -------------------------------------------------------------------------------- /tailwind.config.cjs: -------------------------------------------------------------------------------- 1 | /** @type {import('tailwindcss').Config} */ 2 | module.exports = { 3 | content: [ 4 | "./index.html", 5 | "./src/**/*.{js,ts,jsx,tsx}", 6 | ], 7 | theme: { 8 | extend: {}, 9 | }, 10 | plugins: [], 11 | } -------------------------------------------------------------------------------- /vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite' 2 | import react from '@vitejs/plugin-react' 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | server:{ 8 | port:7009 9 | } 10 | }) 11 | --------------------------------------------------------------------------------

82 | {player.userId.fullname} 83 |

87 | 88 | {player.position} 89 | {" "} 90 |

92 | 93 | {player.age} 94 | {" "} 95 |

heder

136 | 4.60 137 |

141 | Lorem ipsum is placeholder text commonly used in the 142 | graphick 143 |

heder

178 | 4.60 179 |

183 | Lorem ipsum is placeholder text commonly used in the 184 | graphick 185 |

21 | What We Do 22 |

58 | Search Player 59 |

96 | Player Chat 97 |

134 | Player Profiles 135 |

171 | My Profile 172 |

209 | Selected Players 210 |

Users

99 | Meet the players 100 |

155 | {player?.userId.fullname} 156 |

158 | Age: 159 | {player?.age} 160 |

80 | Scout Personal Info 81 |

About

Pleace fill the form

192 | 193 | {player.position} 194 | {" "} 195 |

201 | {player?.userId.fullname} 202 |

204 | Age: 205 | {player?.age} 206 |

Users

37 | {player.userId?.fullname} 38 |

54 | Recent activites 55 |

193 | Player gallery 194 |

44 | Get started today 45 |

53 | {" "} 54 | Your journey starts here 55 |

63 | Sign Up 64 |

Please Wait