Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
S
seat-booking
Overview
Overview
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Registry
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
Syed Abdul Rahman
seat-booking
Commits
3fcc9f92
Commit
3fcc9f92
authored
Jun 18, 2025
by
Syed Abdul Rahman
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
Added env, Implemented try catch and code cleanup completed
parent
f7dac3cd
Show whitespace changes
Inline
Side-by-side
Showing
8 changed files
with
115 additions
and
86 deletions
+115
-86
.env
.env
+2
-0
db.json
db.json
+29
-32
styles.module.css
src/components/Layout/Header/styles.module.css
+8
-5
AppConstants.js
src/lib/AppConstants.js
+0
-2
api.js
src/lib/api.js
+34
-28
localStorage.js
src/lib/localStorage.js
+4
-3
Index.jsx
src/pages/BookingPage/Index.jsx
+22
-13
Index.jsx
src/pages/LoginPage/Index.jsx
+16
-3
No files found.
.env
0 → 100644
View file @
3fcc9f92
VITE_API_URL=http://192.168.1.73:3000
\ No newline at end of file
db.json
View file @
3fcc9f92
{
{
"users"
:
[
"users"
:
[
{
{
"id"
:
"5ebc"
,
"id"
:
"0b2d"
,
"email"
:
"syedabdul.rahman@krds.com"
,
"email"
:
"syedabdul.rahman@krds.com"
"selectionCount"
:
4
},
},
{
{
"id"
:
"45ea"
,
"id"
:
"1d58"
,
"email"
:
"abdul@gmail.com"
,
"email"
:
"abdul@gmail.com"
"selectionCount"
:
3
},
},
{
{
"id"
:
"aafd"
,
"id"
:
"42f0"
,
"email"
:
"lucy@gmail.com"
,
"email"
:
"lucy@gmail.com"
"selectionCount"
:
4
},
{
"id"
:
"e770"
,
"email"
:
"new@gmail.com"
}
}
],
],
"selectedSeats"
:
[
"selectedSeats"
:
[
{
{
"id"
:
"
45ea
"
,
"id"
:
"
0b2d
"
,
"userid"
:
"
45ea
"
,
"userid"
:
"
0b2d
"
,
"selected"
:
[
"selected"
:
[
{
{
"row"
:
8
,
"row"
:
8
,
"seat"
:
3
"seat"
:
4
},
},
{
{
"row"
:
8
,
"row"
:
8
,
"seat"
:
2
"seat"
:
5
},
},
{
{
"row"
:
8
,
"row"
:
8
,
"seat"
:
1
"seat"
:
6
}
}
]
]
},
},
{
{
"id"
:
"
5ebc
"
,
"id"
:
"
1d58
"
,
"userid"
:
"
5ebc
"
,
"userid"
:
"
1d58
"
,
"selected"
:
[
"selected"
:
[
{
{
"row"
:
6
,
"row"
:
8
,
"seat"
:
5
"seat"
:
1
},
{
"row"
:
6
,
"seat"
:
6
},
},
{
{
"row"
:
6
,
"row"
:
8
,
"seat"
:
7
"seat"
:
2
},
},
{
{
"row"
:
6
,
"row"
:
8
,
"seat"
:
8
"seat"
:
3
}
}
]
]
},
},
{
{
"id"
:
"
aafd
"
,
"id"
:
"
42f0
"
,
"userid"
:
"
aafd
"
,
"userid"
:
"
42f0
"
,
"selected"
:
[
"selected"
:
[
{
{
"row"
:
7
,
"row"
:
7
,
"seat"
:
5
"seat"
:
1
},
},
{
{
"row"
:
7
,
"row"
:
7
,
"seat"
:
6
"seat"
:
2
},
},
{
{
"row"
:
7
,
"row"
:
7
,
"seat"
:
7
"seat"
:
3
},
},
{
{
"row"
:
7
,
"row"
:
7
,
"seat"
:
8
"seat"
:
4
}
}
]
]
}
}
...
...
src/components/Layout/Header/styles.module.css
View file @
3fcc9f92
...
@@ -7,28 +7,31 @@
...
@@ -7,28 +7,31 @@
}
}
.title
{
.title
{
font-family
:
"Poppins-Bold"
;
font-family
:
'Poppins-Bold'
;
color
:
white
;
color
:
white
;
font-size
:
2rem
;
font-size
:
2rem
;
}
}
.screenWrapper
{
.screenWrapper
{
width
:
80%
;
width
:
50%
;
min-width
:
300px
;
}
}
@media
screen
and
(
min-width
:
768px
)
{
@media
screen
and
(
min-width
:
768px
)
{
.title
{
.title
{
font-family
:
"Poppins-Bold"
;
font-family
:
'Poppins-Bold'
;
color
:
white
;
color
:
white
;
font-size
:
2rem
;
font-size
:
2rem
;
}
}
.screenWrapper
{
.screenWrapper
{
width
:
30%
;
width
:
30%
!important
;
max-width
:
30%
;
min-width
:
400px
;
}
}
.title
{
.title
{
font-family
:
"Poppins-Bold"
;
font-family
:
'Poppins-Bold'
;
color
:
white
;
color
:
white
;
font-size
:
2rem
;
font-size
:
2rem
;
}
}
...
...
src/lib/AppConstants.js
View file @
3fcc9f92
export
const
appConstants
=
{
export
const
appConstants
=
{
API_URL_SEATS
:
'http://192.168.1.73:3000/selectedSeats'
,
API_URL_USERS
:
'http://192.168.1.73:3000/users'
,
USER
:
'user'
,
USER
:
'user'
,
MODAL
:
'modal'
MODAL
:
'modal'
};
};
...
...
src/lib/api.js
View file @
3fcc9f92
import
{
appConstants
}
from
'../lib/AppConstants'
;
export
const
login
=
async
(
email
)
=>
{
export
const
login
=
async
(
email
)
=>
{
const
response
=
await
fetch
(
`
${
appConstants
.
API_URL_USERS
}
`
);
try
{
const
response
=
await
fetch
(
`
${
import
.
meta
.
env
.
VITE_API_URL
}
/users`
);
const
data
=
await
response
.
json
();
const
data
=
await
response
.
json
();
const
user
=
data
.
find
((
e
)
=>
e
.
email
==
email
);
const
user
=
data
.
find
((
e
)
=>
e
.
email
=
==
email
);
return
user
;
return
user
;
}
catch
(
error
)
{
console
.
error
(
'Login error:'
,
error
);
throw
error
;
}
};
};
export
const
createUser
=
async
(
email
)
=>
{
export
const
createUser
=
async
(
email
)
=>
{
const
response
=
await
fetch
(
`
${
appConstants
.
API_URL_USERS
}
`
,
{
try
{
const
response
=
await
fetch
(
`
${
import
.
meta
.
env
.
VITE_API_URL
}
/users`
,
{
method
:
'POST'
,
method
:
'POST'
,
body
:
JSON
.
stringify
({
headers
:
{
email
:
email
'Content-Type'
:
'application/json'
})
},
body
:
JSON
.
stringify
({
email
})
});
});
const
data
=
await
response
.
json
();
const
data
=
await
response
.
json
();
return
data
;
return
data
;
}
catch
(
error
)
{
console
.
error
(
'Create user error:'
,
error
);
throw
error
;
}
};
};
export
const
getSelectedSeatsApi
=
async
()
=>
{
export
const
getSelectedSeatsApi
=
async
()
=>
{
const
response
=
await
fetch
(
`
${
appConstants
.
API_URL_SEATS
}
`
);
try
{
const
response
=
await
fetch
(
`
${
import
.
meta
.
env
.
VITE_API_URL
}
/selectedSeats`
);
const
data
=
await
response
.
json
();
const
data
=
await
response
.
json
();
return
data
;
return
data
;
}
catch
(
error
)
{
console
.
error
(
'Get selected seats error:'
,
error
);
throw
error
;
}
};
};
export
const
editSeatsApi
=
async
(
id
,
body
)
=>
{
export
const
editSeatsApi
=
async
(
id
,
body
)
=>
{
try
{
try
{
await
fetch
(
`
${
appConstants
.
API_URL_SEATS
}
/
${
id
}
`
,
{
await
fetch
(
`
${
import
.
meta
.
env
.
VITE_API_URL
}
/selectedSeats
/
${
id
}
`
,
{
method
:
'PATCH'
,
method
:
'PATCH'
,
headers
:
{
headers
:
{
'Content-Type'
:
'application/json'
'Content-Type'
:
'application/json'
...
@@ -34,32 +50,22 @@ export const editSeatsApi = async (id, body) => {
...
@@ -34,32 +50,22 @@ export const editSeatsApi = async (id, body) => {
body
:
JSON
.
stringify
({
selected
:
body
})
body
:
JSON
.
stringify
({
selected
:
body
})
});
});
}
catch
(
error
)
{
}
catch
(
error
)
{
console
.
log
(
error
,
'error'
);
console
.
error
(
'Edit seats error:'
,
error
);
throw
error
;
}
}
};
};
export
const
createSeatApi
=
async
(
body
)
=>
{
export
const
createSeatApi
=
async
(
body
)
=>
{
await
fetch
(
`
${
appConstants
.
API_URL_SEATS
}
`
,
{
try
{
await
fetch
(
`
${
import
.
meta
.
env
.
VITE_API_URL
}
/selectedSeats`
,
{
method
:
'POST'
,
method
:
'POST'
,
headers
:
{
headers
:
{
'Content-Type'
:
'application/json'
'Content-Type'
:
'application/json'
},
},
body
:
JSON
.
stringify
(
body
)
body
:
JSON
.
stringify
(
body
)
});
});
};
}
catch
(
error
)
{
console
.
error
(
'Create seat error:'
,
error
);
export
const
saveSeatSelectionCountApi
=
async
(
id
,
count
)
=>
{
throw
error
;
await
fetch
(
`
${
appConstants
.
API_URL_USERS
}
/
${
id
}
`
,
{
}
method
:
'PATCH'
,
headers
:
{
'Content-Type'
:
'application/json'
},
body
:
JSON
.
stringify
({
selectionCount
:
count
})
});
};
export
const
getSeatSelectionCountApi
=
async
(
id
)
=>
{
const
response
=
await
fetch
(
`
${
appConstants
.
API_URL_USERS
}
/
${
id
}
`
);
const
data
=
await
response
.
json
();
return
data
?
data
:
null
;
};
};
src/lib/localStorage.js
View file @
3fcc9f92
export
const
setItem
=
(
key
,
value
)
=>
{
export
const
setItem
=
(
key
,
value
)
=>
{
local
Storage
.
setItem
(
key
,
JSON
.
stringify
(
value
));
session
Storage
.
setItem
(
key
,
JSON
.
stringify
(
value
));
};
};
export
const
getItem
=
(
key
)
=>
{
export
const
getItem
=
(
key
)
=>
{
const
item
=
localStorage
.
getItem
(
key
);
const
item
=
sessionStorage
.
getItem
(
key
);
console
.
log
(
item
,
'item'
);
return
item
?
JSON
.
parse
(
item
)
:
null
;
return
item
?
JSON
.
parse
(
item
)
:
null
;
};
};
export
const
reset
=
()
=>
{
export
const
reset
=
()
=>
{
local
Storage
.
clear
();
session
Storage
.
clear
();
};
};
src/pages/BookingPage/Index.jsx
View file @
3fcc9f92
...
@@ -5,9 +5,7 @@ import { appConstants } from '../../lib/AppConstants';
...
@@ -5,9 +5,7 @@ import { appConstants } from '../../lib/AppConstants';
import
{
import
{
getSelectedSeatsApi
,
getSelectedSeatsApi
,
editSeatsApi
,
editSeatsApi
,
createSeatApi
,
createSeatApi
saveSeatSelectionCountApi
,
getSeatSelectionCountApi
}
from
'../../lib/api'
;
}
from
'../../lib/api'
;
import
BookingWrapper
from
'../../components/Layout/BookingWrapper/Index'
;
import
BookingWrapper
from
'../../components/Layout/BookingWrapper/Index'
;
import
Header
from
'../../components/Layout/Header/Index'
;
import
Header
from
'../../components/Layout/Header/Index'
;
...
@@ -44,27 +42,36 @@ const BookingPage = () => {
...
@@ -44,27 +42,36 @@ const BookingPage = () => {
const
[
modalButtonState
,
setModalButtonState
]
=
useState
(
true
);
const
[
modalButtonState
,
setModalButtonState
]
=
useState
(
true
);
const
[
showSuccessModal
,
setShowSuccessModal
]
=
useState
(
false
);
const
[
showSuccessModal
,
setShowSuccessModal
]
=
useState
(
false
);
useEffect
(()
=>
{
useEffect
(()
=>
{
const
fetchSeatSelectionCount
=
async
()
=>
{
const
data
=
await
getSeatSelectionCountApi
(
userId
);
setNoOfSeats
(
data
?.
selectionCount
);
};
fetchSelectedSeats
();
fetchSelectedSeats
();
fetchSeatSelectionCount
();
setShowSeatsModal
(
getItem
(
appConstants
.
MODAL
));
setShowSeatsModal
(
getItem
(
appConstants
.
MODAL
));
},
[]);
},
[]);
const
fetchSelectedSeats
=
async
()
=>
{
const
fetchSelectedSeats
=
async
()
=>
{
try
{
const
data
=
await
getSelectedSeatsApi
();
const
data
=
await
getSelectedSeatsApi
();
const
currentData
=
data
?.
find
((
e
)
=>
e
.
userid
==
userId
);
const
currentData
=
data
?.
find
((
e
)
=>
e
.
userid
==
userId
);
const
structuredData
=
data
.
flatMap
((
user
)
=>
user
.
selected
);
const
structuredData
=
data
.
flatMap
((
user
)
=>
user
.
selected
);
const
temp
=
structuredData
?.
filter
(
const
temp
=
structuredData
?.
filter
(
(
e
)
=>
(
e
)
=>
!
currentData
?.
selected
?.
some
(
!
currentData
?.
selected
?.
some
(
(
e2
)
=>
e2
.
row
===
e
.
row
&&
e2
.
seat
===
e
.
seat
(
e2
)
=>
e2
.
row
===
e
.
row
&&
e2
.
seat
===
e
.
seat
)
)
);
);
setSelectedSeats
(
temp
);
setSelectedSeats
(
temp
);
setCurrentSeats
(
currentData
?.
selected
);
setCurrentSeats
(
currentData
?.
selected
);
setNoOfSeats
(
currentData
?.
selected
?.
length
?
currentData
?.
selected
?.
length
:
noOfSeats
);
}
catch
(
error
)
{
console
.
error
(
'Error in fetchSelectedSeats:'
,
error
);
setSelectedSeats
([]);
setCurrentSeats
([]);
setNoOfSeats
(
noOfSeats
);
}
};
};
const
logout
=
()
=>
{
const
logout
=
()
=>
{
...
@@ -84,9 +91,6 @@ const BookingPage = () => {
...
@@ -84,9 +91,6 @@ const BookingPage = () => {
const
modalClose
=
()
=>
{
const
modalClose
=
()
=>
{
setItem
(
'modal'
,
false
);
setItem
(
'modal'
,
false
);
if
(
userId
&&
noOfSeats
)
{
saveSeatSelectionCountApi
(
userId
,
noOfSeats
);
}
fetchSelectedSeats
();
fetchSelectedSeats
();
setShowSeatsModal
(
false
);
setShowSeatsModal
(
false
);
};
};
...
@@ -136,12 +140,13 @@ const BookingPage = () => {
...
@@ -136,12 +140,13 @@ const BookingPage = () => {
};
};
const
seatsFinal
=
async
()
=>
{
const
seatsFinal
=
async
()
=>
{
let
data
=
await
getSelectedSeatsApi
();
try
{
const
data
=
await
getSelectedSeatsApi
();
const
existingUserSeatMap
=
data
?.
find
((
ele
)
=>
ele
.
id
==
userId
);
const
existingUserSeatMap
=
data
?.
find
((
ele
)
=>
ele
.
id
==
userId
);
if
(
existingUserSeatMap
)
{
if
(
existingUserSeatMap
)
{
await
editSeatsApi
(
userId
,
currentSeats
);
await
editSeatsApi
(
userId
,
currentSeats
);
}
else
{
}
else
{
le
t
info
=
{
cons
t
info
=
{
id
:
userId
,
id
:
userId
,
userid
:
userId
,
userid
:
userId
,
selected
:
currentSeats
selected
:
currentSeats
...
@@ -151,6 +156,9 @@ const BookingPage = () => {
...
@@ -151,6 +156,9 @@ const BookingPage = () => {
setShowSeatsConfirmationModal
(
false
);
setShowSeatsConfirmationModal
(
false
);
fetchSelectedSeats
();
fetchSelectedSeats
();
setShowSuccessModal
(
true
);
setShowSuccessModal
(
true
);
}
catch
(
error
)
{
console
.
error
(
'Error in seatsFinal:'
,
error
);
}
};
};
const
handleSuccessModalConfirm
=
()
=>
{
const
handleSuccessModalConfirm
=
()
=>
{
...
@@ -165,6 +173,7 @@ const BookingPage = () => {
...
@@ -165,6 +173,7 @@ const BookingPage = () => {
className=
{
styles
[
'logout'
]
}
className=
{
styles
[
'logout'
]
}
width=
{
30
}
width=
{
30
}
onClick=
{
()
=>
logout
()
}
onClick=
{
()
=>
logout
()
}
title=
"Logout"
/>
/>
<
div
className=
{
styles
[
'screen-wrapper'
]
}
>
<
div
className=
{
styles
[
'screen-wrapper'
]
}
>
<
Header
>
Choose Seats
</
Header
>
<
Header
>
Choose Seats
</
Header
>
...
...
src/pages/LoginPage/Index.jsx
View file @
3fcc9f92
import
{
useNavigate
}
from
'react-router-dom'
;
import
{
useNavigate
}
from
'react-router-dom'
;
import
Login
from
'../../components/TopLevel/Login/Index'
;
import
Login
from
'../../components/TopLevel/Login/Index'
;
import
{
login
,
createUser
,
getSe
atSelectionCount
Api
}
from
'../../lib/api'
;
import
{
login
,
createUser
,
getSe
lectedSeats
Api
}
from
'../../lib/api'
;
import
{
setItem
}
from
'../../lib/localStorage'
;
import
{
setItem
}
from
'../../lib/localStorage'
;
const
LoginPage
=
()
=>
{
const
LoginPage
=
()
=>
{
const
navigate
=
useNavigate
();
const
navigate
=
useNavigate
();
const
onSubmit
=
async
(
email
)
=>
{
const
onSubmit
=
async
(
email
)
=>
{
try
{
const
userData
=
await
login
(
email
);
const
userData
=
await
login
(
email
);
const
fetchSeatSelectionCount
=
async
(
id
)
=>
{
const
fetchSeatSelectionCount
=
async
(
id
)
=>
{
const
data
=
await
getSeatSelectionCountApi
(
id
);
try
{
if
(
data
.
selectionCount
)
{
const
data
=
await
getSelectedSeatsApi
();
const
currentData
=
data
?.
find
((
e
)
=>
e
.
userid
==
id
);
if
(
currentData
?.
selected
?.
length
>
0
)
{
setItem
(
'modal'
,
false
);
setItem
(
'modal'
,
false
);
}
else
{
}
else
{
setItem
(
'modal'
,
true
);
setItem
(
'modal'
,
true
);
}
}
navigate
(
'/'
);
navigate
(
'/'
);
}
catch
(
error
)
{
console
.
error
(
'Error fetching seat selection count:'
,
error
);
}
};
};
if
(
userData
)
{
if
(
userData
)
{
setItem
(
'user'
,
userData
.
id
);
setItem
(
'user'
,
userData
.
id
);
fetchSeatSelectionCount
(
userData
?.
id
);
fetchSeatSelectionCount
(
userData
?.
id
);
...
@@ -25,6 +35,9 @@ const LoginPage = () => {
...
@@ -25,6 +35,9 @@ const LoginPage = () => {
setItem
(
'user'
,
data
.
id
);
setItem
(
'user'
,
data
.
id
);
fetchSeatSelectionCount
(
data
?.
id
);
fetchSeatSelectionCount
(
data
?.
id
);
}
}
}
catch
(
error
)
{
console
.
error
(
'Error during login or user creation:'
,
error
);
}
};
};
return
<
Login
onSubmit=
{
onSubmit
}
/>;
return
<
Login
onSubmit=
{
onSubmit
}
/>;
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment