json proxy server
This commit is contained in:
parent
3bd33f99fc
commit
d1fa80bac7
19
db-1720504233338.json
Normal file
19
db-1720504233338.json
Normal file
@ -0,0 +1,19 @@
|
||||
{
|
||||
"posts": [
|
||||
{
|
||||
"id": 1,
|
||||
"title": "json-server",
|
||||
"author": "typicode"
|
||||
}
|
||||
],
|
||||
"comments": [
|
||||
{
|
||||
"id": 1,
|
||||
"body": "some comment",
|
||||
"postId": 1
|
||||
}
|
||||
],
|
||||
"profile": {
|
||||
"name": "typicode"
|
||||
}
|
||||
}
|
||||
67
db.json
Normal file
67
db.json
Normal file
@ -0,0 +1,67 @@
|
||||
{
|
||||
"users": [
|
||||
{
|
||||
"id": 1,
|
||||
"email": "employee@example.com",
|
||||
"password": "password123",
|
||||
"role": "employee"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"email": "admin@example.com",
|
||||
"password": "admin123",
|
||||
"role": "admin"
|
||||
},
|
||||
{
|
||||
"email": "employee@example.com",
|
||||
"password": "password123",
|
||||
"id": 3,
|
||||
"role": "employee"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"email": "suraj@gmail.com",
|
||||
"password": "pass",
|
||||
"role": "employee"
|
||||
},
|
||||
{
|
||||
"id": 5
|
||||
},
|
||||
{
|
||||
"id": 6
|
||||
},
|
||||
{
|
||||
"id": 7
|
||||
},
|
||||
{
|
||||
"id": 8
|
||||
},
|
||||
{
|
||||
"id": 9
|
||||
},
|
||||
{
|
||||
"id": 10
|
||||
},
|
||||
{
|
||||
"id": 11,
|
||||
"email": "urhtuhreiuuryuihd@gmail.com",
|
||||
"password": "password12",
|
||||
"role": "employee"
|
||||
},
|
||||
{
|
||||
"id": 12
|
||||
},
|
||||
{
|
||||
"id": 13
|
||||
},
|
||||
{
|
||||
"id": 14
|
||||
},
|
||||
{
|
||||
"id": 15
|
||||
},
|
||||
{
|
||||
"id": 16
|
||||
}
|
||||
]
|
||||
}
|
||||
7
lib/api/axiosConfig.js
Normal file
7
lib/api/axiosConfig.js
Normal file
@ -0,0 +1,7 @@
|
||||
import axios from 'axios';
|
||||
|
||||
const axiosInstance = axios.create({
|
||||
baseURL: 'http://localhost:5000'
|
||||
});
|
||||
|
||||
export default axiosInstance;
|
||||
569
package-lock.json
generated
569
package-lock.json
generated
@ -24,6 +24,7 @@
|
||||
"eslint-plugin-react": "^7.34.1",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.6",
|
||||
"json-server": "^1.0.0-beta.1",
|
||||
"postcss": "^8.4.38",
|
||||
"tailwindcss": "^3.4.4",
|
||||
"vite": "^5.2.0"
|
||||
@ -860,6 +861,13 @@
|
||||
"node": ">=14"
|
||||
}
|
||||
},
|
||||
"node_modules/@polka/url": {
|
||||
"version": "1.0.0-next.25",
|
||||
"resolved": "https://registry.npmjs.org/@polka/url/-/url-1.0.0-next.25.tgz",
|
||||
"integrity": "sha512-j7P6Rgr3mmtdkeDGTe0E/aYyWEWVtc5yFXtHCRHs28/jptDEWfaVOc5T7cblqy1XKPPfCxJc/8DwQ5YgLOZOVQ==",
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/@rc-component/async-validator": {
|
||||
"version": "5.0.4",
|
||||
"resolved": "https://registry.npmjs.org/@rc-component/async-validator/-/async-validator-5.0.4.tgz",
|
||||
@ -1014,6 +1022,280 @@
|
||||
"win32"
|
||||
]
|
||||
},
|
||||
"node_modules/@tinyhttp/accepts": {
|
||||
"version": "2.2.2",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/accepts/-/accepts-2.2.2.tgz",
|
||||
"integrity": "sha512-DmngnwOaPgNUGgTpX1UdlNrXaGG6k5rHFzslcYlvSQIg7s0PI6bF86U0fYq3q+yhJhKbnwzFez0wU1lAP+bKvA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"mime": "4.0.1",
|
||||
"negotiator": "^0.6.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
"url": "https://github.com/tinyhttp/tinyhttp?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/app": {
|
||||
"version": "2.2.4",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/app/-/app-2.2.4.tgz",
|
||||
"integrity": "sha512-vFCgE+RncK9+AHpSXHiOxpbaEbpOxYcYHz4K/15Ckh8Sb7WvjA+vveN7bwMqfifyW2uvV3xTKTitUVohf+kDnA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@tinyhttp/cookie": "2.1.1",
|
||||
"@tinyhttp/proxy-addr": "2.1.4",
|
||||
"@tinyhttp/req": "2.2.3",
|
||||
"@tinyhttp/res": "2.2.3",
|
||||
"@tinyhttp/router": "2.2.2",
|
||||
"header-range-parser": "1.1.3",
|
||||
"regexparam": "^2.0.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=14.21.3"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
"url": "https://github.com/tinyhttp/tinyhttp?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/content-disposition": {
|
||||
"version": "2.2.1",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/content-disposition/-/content-disposition-2.2.1.tgz",
|
||||
"integrity": "sha512-PQ5IWdOn7arScqTV+usIDJvwbanoAXtaopzgxjMS9y7TFwLSIelCblihRBEVIPIkIpsdhSJFH3RF+Daosyj+Aw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
"url": "https://github.com/tinyhttp/tinyhttp?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/content-type": {
|
||||
"version": "0.1.4",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/content-type/-/content-type-0.1.4.tgz",
|
||||
"integrity": "sha512-dl6f3SHIJPYbhsW1oXdrqOmLSQF/Ctlv3JnNfXAE22kIP7FosqJHxkz/qj2gv465prG8ODKH5KEyhBkvwrueKQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.4"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/cookie": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/cookie/-/cookie-2.1.1.tgz",
|
||||
"integrity": "sha512-h/kL9jY0e0Dvad+/QU3efKZww0aTvZJslaHj3JTPmIPC9Oan9+kYqmh3M6L5JUQRuTJYFK2nzgL2iJtH2S+6dA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "individual",
|
||||
"url": "https://github.com/tinyhttp/tinyhttp?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/cookie-signature": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/cookie-signature/-/cookie-signature-2.1.1.tgz",
|
||||
"integrity": "sha512-VDsSMY5OJfQJIAtUgeQYhqMPSZptehFSfvEEtxr+4nldPA8IImlp3QVcOVuK985g4AFR4Hl1sCbWCXoqBnVWnw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/cors": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/cors/-/cors-2.0.0.tgz",
|
||||
"integrity": "sha512-IwQsPBnK+gRrhTsPA4FPOfbNzZZt8cVsOIMNFb6HzoScaiWcoLEogL0Bz/aBSm8KM13uieVXoVT6udMqhqUS2A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"es-vary": "^0.1.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.4 || 14.x || >=16"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/encode-url": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/encode-url/-/encode-url-2.1.1.tgz",
|
||||
"integrity": "sha512-AhY+JqdZ56qV77tzrBm0qThXORbsVjs/IOPgGCS7x/wWnsa/Bx30zDUU/jPAUcSzNOzt860x9fhdGpzdqbUeUw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/etag": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/etag/-/etag-2.1.2.tgz",
|
||||
"integrity": "sha512-j80fPKimGqdmMh6962y+BtQsnYPVCzZfJw0HXjyH70VaJBHLKGF+iYhcKqzI3yef6QBNa8DKIPsbEYpuwApXTw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/forwarded": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/forwarded/-/forwarded-2.1.1.tgz",
|
||||
"integrity": "sha512-nO3kq0R1LRl2+CAMlnggm22zE6sT8gfvGbNvSitV6F9eaUSurHP0A8YZFMihSkugHxK+uIegh1TKrqgD8+lyGQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/proxy-addr": {
|
||||
"version": "2.1.4",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/proxy-addr/-/proxy-addr-2.1.4.tgz",
|
||||
"integrity": "sha512-Xb57jBQW3UcwKST1XSkJpyZPyjOVQJjUfXiHULVXf7FZCgnl273+aj0oP15BzpYLuGhO9IjydY5gvYeg2Cny+A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@tinyhttp/forwarded": "2.1.1",
|
||||
"ipaddr.js": "^2.2.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/req": {
|
||||
"version": "2.2.3",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/req/-/req-2.2.3.tgz",
|
||||
"integrity": "sha512-HtIa4Gaa8QFTlmsvoif/B7yMK5H0WBUegH2kKW6scNwOpFXyxEk+VsctrIVgORrP5lybXAIRXlRhGuBBAMlVhw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@tinyhttp/accepts": "2.2.2",
|
||||
"@tinyhttp/type-is": "2.2.3",
|
||||
"@tinyhttp/url": "2.1.1",
|
||||
"header-range-parser": "^1.1.3"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/res": {
|
||||
"version": "2.2.3",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/res/-/res-2.2.3.tgz",
|
||||
"integrity": "sha512-PGl88OOdmMcOuKZaTbhGKAWPoJJf3+EfKIad8ydzjdenVjrTZZjIYJtmwYiUBeEice+YkOCO67qCIekVO5mHlw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@tinyhttp/content-disposition": "2.2.1",
|
||||
"@tinyhttp/cookie": "2.1.1",
|
||||
"@tinyhttp/cookie-signature": "2.1.1",
|
||||
"@tinyhttp/encode-url": "2.1.1",
|
||||
"@tinyhttp/req": "2.2.3",
|
||||
"@tinyhttp/send": "2.2.2",
|
||||
"@tinyhttp/vary": "^0.1.3",
|
||||
"es-escape-html": "^0.1.1",
|
||||
"mime": "4.0.0-beta.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/res/node_modules/mime": {
|
||||
"version": "4.0.0-beta.1",
|
||||
"resolved": "https://registry.npmjs.org/mime/-/mime-4.0.0-beta.1.tgz",
|
||||
"integrity": "sha512-8/p99P1RV17prytee/A6D+8shNqdDzyvGJ/CVfiuXwh4cTsv3P3qGyaYSx2hdqnqbKKqYUfTC5zAjCtcd1BShw==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
"https://github.com/sponsors/broofa"
|
||||
],
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"mime": "bin/cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/router": {
|
||||
"version": "2.2.2",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/router/-/router-2.2.2.tgz",
|
||||
"integrity": "sha512-i+1ouhPyTqcuJuOsKqmo7i+YD++0RF2lQLhBpcTnsaegD2gTEa3xW2Pcz7spYQGo7K8PQYtOrL7m9b14+BEXqg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/send": {
|
||||
"version": "2.2.2",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/send/-/send-2.2.2.tgz",
|
||||
"integrity": "sha512-TZkGy9EdGk+vwYWQnjArQftaXAUIgp/fFlgaxlpamsCZKy7o+CNJ75xty4H3SaY3ZPgN47wv8rnJ50rDRQdFFQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@tinyhttp/content-type": "^0.1.4",
|
||||
"@tinyhttp/etag": "2.1.2",
|
||||
"mime": "4.0.0-beta.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/send/node_modules/mime": {
|
||||
"version": "4.0.0-beta.1",
|
||||
"resolved": "https://registry.npmjs.org/mime/-/mime-4.0.0-beta.1.tgz",
|
||||
"integrity": "sha512-8/p99P1RV17prytee/A6D+8shNqdDzyvGJ/CVfiuXwh4cTsv3P3qGyaYSx2hdqnqbKKqYUfTC5zAjCtcd1BShw==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
"https://github.com/sponsors/broofa"
|
||||
],
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"mime": "bin/cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/type-is": {
|
||||
"version": "2.2.3",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/type-is/-/type-is-2.2.3.tgz",
|
||||
"integrity": "sha512-RsZ4+or5xI+wrTlrd+/cLZELoJDMd1HSp+1P23VOZSu1xPAsO1XLf1FgluO8GbEW9Ll/l2yC7mO6diKzjc06HA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@tinyhttp/content-type": "^0.1.4",
|
||||
"mime": "4.0.1"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/url": {
|
||||
"version": "2.1.1",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/url/-/url-2.1.1.tgz",
|
||||
"integrity": "sha512-POJeq2GQ5jI7Zrdmj22JqOijB5/GeX+LEX7DUdml1hUnGbJOTWDx7zf2b5cCERj7RoXL67zTgyzVblBJC+NJWg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20.0"
|
||||
}
|
||||
},
|
||||
"node_modules/@tinyhttp/vary": {
|
||||
"version": "0.1.3",
|
||||
"resolved": "https://registry.npmjs.org/@tinyhttp/vary/-/vary-0.1.3.tgz",
|
||||
"integrity": "sha512-SoL83sQXAGiHN1jm2VwLUWQSQeDAAl1ywOm6T0b0Cg1CZhVsjoiZadmjhxF6FHCCY7OHHVaLnTgSMxTPIDLxMg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.20"
|
||||
}
|
||||
},
|
||||
"node_modules/@types/babel__core": {
|
||||
"version": "7.20.5",
|
||||
"resolved": "https://registry.npmjs.org/@types/babel__core/-/babel__core-7.20.5.tgz",
|
||||
@ -1957,6 +2239,35 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/dot-prop": {
|
||||
"version": "9.0.0",
|
||||
"resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-9.0.0.tgz",
|
||||
"integrity": "sha512-1gxPBJpI/pcjQhKgIU91II6Wkay+dLcN3M6rf2uwP8hRur3HtQXjVrdAK3sjC0piaEuxzMwjXChcETiJl47lAQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"type-fest": "^4.18.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/dot-prop/node_modules/type-fest": {
|
||||
"version": "4.21.0",
|
||||
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-4.21.0.tgz",
|
||||
"integrity": "sha512-ADn2w7hVPcK6w1I0uWnM//y1rLXZhzB9mr0a3OirzclKF1Wp6VzevUmzz/NRAWunOT6E8HrnpGY7xOfc6K57fA==",
|
||||
"dev": true,
|
||||
"license": "(MIT OR CC0-1.0)",
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/eastasianwidth": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/eastasianwidth/-/eastasianwidth-0.2.0.tgz",
|
||||
@ -2060,6 +2371,16 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/es-escape-html": {
|
||||
"version": "0.1.1",
|
||||
"resolved": "https://registry.npmjs.org/es-escape-html/-/es-escape-html-0.1.1.tgz",
|
||||
"integrity": "sha512-yUx1o+8RsG7UlszmYPtks+dm6Lho2m8lgHMOsLJQsFI0R8XwUJwiMhM1M4E/S8QLeGyf6MkDV/pWgjQ0tdTSyQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.x"
|
||||
}
|
||||
},
|
||||
"node_modules/es-iterator-helpers": {
|
||||
"version": "1.0.19",
|
||||
"resolved": "https://registry.npmjs.org/es-iterator-helpers/-/es-iterator-helpers-1.0.19.tgz",
|
||||
@ -2142,6 +2463,16 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/es-vary": {
|
||||
"version": "0.1.2",
|
||||
"resolved": "https://registry.npmjs.org/es-vary/-/es-vary-0.1.2.tgz",
|
||||
"integrity": "sha512-pLqqZoOutAXQXyBJrUYVNM5fZngiOJYi1Xl4svQMrluTsqDUOQlBMw9EYgLrsWL6niDYn/Yd1y2Pj6GC+j/yjA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.x"
|
||||
}
|
||||
},
|
||||
"node_modules/esbuild": {
|
||||
"version": "0.21.5",
|
||||
"resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.21.5.tgz",
|
||||
@ -2423,6 +2754,19 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/eta": {
|
||||
"version": "3.4.0",
|
||||
"resolved": "https://registry.npmjs.org/eta/-/eta-3.4.0.tgz",
|
||||
"integrity": "sha512-tCsc7WXTjrTx4ZjYLplcqrI3o4mYJ+Z6YspeuGL8tbt/hHoMchwBwtKfwM09svEY86iRapY93vUqQttcNuIO5Q==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/eta-dev/eta?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/fast-deep-equal": {
|
||||
"version": "3.1.3",
|
||||
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
|
||||
@ -2900,6 +3244,16 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/header-range-parser": {
|
||||
"version": "1.1.3",
|
||||
"resolved": "https://registry.npmjs.org/header-range-parser/-/header-range-parser-1.1.3.tgz",
|
||||
"integrity": "sha512-B9zCFt3jH8g09LR1vHL4pcAn8yMEtlSlOUdQemzHMRKMImNIhhszdeosYFfNW0WXKQtXIlWB+O4owHJKvEJYaA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.22.0"
|
||||
}
|
||||
},
|
||||
"node_modules/ignore": {
|
||||
"version": "5.3.1",
|
||||
"resolved": "https://registry.npmjs.org/ignore/-/ignore-5.3.1.tgz",
|
||||
@ -2937,6 +3291,16 @@
|
||||
"node": ">=0.8.19"
|
||||
}
|
||||
},
|
||||
"node_modules/inflection": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/inflection/-/inflection-3.0.0.tgz",
|
||||
"integrity": "sha512-1zEJU1l19SgJlmwqsEyFTbScw/tkMHFenUo//Y0i+XEP83gDFdMvPizAD/WGcE+l1ku12PcTVHQhO6g5E0UCMw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/inflight": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/inflight/-/inflight-1.0.6.tgz",
|
||||
@ -2970,6 +3334,16 @@
|
||||
"node": ">= 0.4"
|
||||
}
|
||||
},
|
||||
"node_modules/ipaddr.js": {
|
||||
"version": "2.2.0",
|
||||
"resolved": "https://registry.npmjs.org/ipaddr.js/-/ipaddr.js-2.2.0.tgz",
|
||||
"integrity": "sha512-Ag3wB2o37wslZS19hZqorUnrnzSkpOVy+IiiDEiTqNubEYpYuHWIf6K4psgN2ZWKExS4xhVCrRVfb/wfW8fWJA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 10"
|
||||
}
|
||||
},
|
||||
"node_modules/is-array-buffer": {
|
||||
"version": "3.0.4",
|
||||
"resolved": "https://registry.npmjs.org/is-array-buffer/-/is-array-buffer-3.0.4.tgz",
|
||||
@ -3463,6 +3837,46 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/json-server": {
|
||||
"version": "1.0.0-beta.1",
|
||||
"resolved": "https://registry.npmjs.org/json-server/-/json-server-1.0.0-beta.1.tgz",
|
||||
"integrity": "sha512-xOKYyxkVai66OTFZq5ulAaXYkqiKMbzVED9tRZ+CMg6v6iaSdIVYas5tIjSMw/mYwDL/nJFTCca308gaL0coyA==",
|
||||
"dev": true,
|
||||
"license": "SEE LICENSE IN ./LICENSE",
|
||||
"dependencies": {
|
||||
"@tinyhttp/app": "^2.2.3",
|
||||
"@tinyhttp/cors": "^2.0.0",
|
||||
"chalk": "^5.3.0",
|
||||
"chokidar": "^3.6.0",
|
||||
"dot-prop": "^9.0.0",
|
||||
"eta": "^3.4.0",
|
||||
"inflection": "^3.0.0",
|
||||
"json5": "^2.2.3",
|
||||
"lowdb": "^7.0.1",
|
||||
"milliparsec": "^2.3.0",
|
||||
"sirv": "^2.0.4",
|
||||
"sort-on": "^6.0.0"
|
||||
},
|
||||
"bin": {
|
||||
"json-server": "lib/bin.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18.3"
|
||||
}
|
||||
},
|
||||
"node_modules/json-server/node_modules/chalk": {
|
||||
"version": "5.3.0",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-5.3.0.tgz",
|
||||
"integrity": "sha512-dLitG79d+GV1Nb/VYcCDFivJeK1hiukt9QjRNVOsUtTy1rR1YJsmpGGTZ3qJos+uw7WmWF4wUwBd9jxjocFC2w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": "^12.17.0 || ^14.13 || >=16.0.0"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/chalk/chalk?sponsor=1"
|
||||
}
|
||||
},
|
||||
"node_modules/json-stable-stringify-without-jsonify": {
|
||||
"version": "1.0.1",
|
||||
"resolved": "https://registry.npmjs.org/json-stable-stringify-without-jsonify/-/json-stable-stringify-without-jsonify-1.0.1.tgz",
|
||||
@ -3582,6 +3996,22 @@
|
||||
"loose-envify": "cli.js"
|
||||
}
|
||||
},
|
||||
"node_modules/lowdb": {
|
||||
"version": "7.0.1",
|
||||
"resolved": "https://registry.npmjs.org/lowdb/-/lowdb-7.0.1.tgz",
|
||||
"integrity": "sha512-neJAj8GwF0e8EpycYIDFqEPcx9Qz4GUho20jWFR7YiFeXzF1YMLdxB36PypcTSPMA+4+LvgyMacYhlr18Zlymw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"steno": "^4.0.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/typicode"
|
||||
}
|
||||
},
|
||||
"node_modules/lru-cache": {
|
||||
"version": "5.1.1",
|
||||
"resolved": "https://registry.npmjs.org/lru-cache/-/lru-cache-5.1.1.tgz",
|
||||
@ -3614,6 +4044,32 @@
|
||||
"node": ">=8.6"
|
||||
}
|
||||
},
|
||||
"node_modules/milliparsec": {
|
||||
"version": "2.3.0",
|
||||
"resolved": "https://registry.npmjs.org/milliparsec/-/milliparsec-2.3.0.tgz",
|
||||
"integrity": "sha512-b+6KYJw+DwQjk24qCUuq+lZvRXDpXJ02qsllKgKaDurHpQ0v7D5op9VAkdYM/pXRhFeh7uLYHmnwFnYvdXGa3A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=12.4"
|
||||
}
|
||||
},
|
||||
"node_modules/mime": {
|
||||
"version": "4.0.1",
|
||||
"resolved": "https://registry.npmjs.org/mime/-/mime-4.0.1.tgz",
|
||||
"integrity": "sha512-5lZ5tyrIfliMXzFtkYyekWbtRXObT9OWa8IwQ5uxTBDHucNNwniRqo0yInflj+iYi5CBa6qxadGzGarDfuEOxA==",
|
||||
"dev": true,
|
||||
"funding": [
|
||||
"https://github.com/sponsors/broofa"
|
||||
],
|
||||
"license": "MIT",
|
||||
"bin": {
|
||||
"mime": "bin/cli.js"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
}
|
||||
},
|
||||
"node_modules/mime-db": {
|
||||
"version": "1.52.0",
|
||||
"resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.52.0.tgz",
|
||||
@ -3655,6 +4111,16 @@
|
||||
"node": ">=16 || 14 >=14.17"
|
||||
}
|
||||
},
|
||||
"node_modules/mrmime": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/mrmime/-/mrmime-2.0.0.tgz",
|
||||
"integrity": "sha512-eu38+hdgojoyq63s+yTpN4XMBdt5l8HhMhc4VKLO9KM5caLIBvUm4thi7fFaxyTmCKeNnXZ5pAlBwCUnhA09uw==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=10"
|
||||
}
|
||||
},
|
||||
"node_modules/ms": {
|
||||
"version": "2.1.2",
|
||||
"resolved": "https://registry.npmjs.org/ms/-/ms-2.1.2.tgz",
|
||||
@ -3699,6 +4165,16 @@
|
||||
"dev": true,
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/negotiator": {
|
||||
"version": "0.6.3",
|
||||
"resolved": "https://registry.npmjs.org/negotiator/-/negotiator-0.6.3.tgz",
|
||||
"integrity": "sha512-+EUsqGPLsM+j/zdChZjsnX51g4XrHFOIXwfnCVPGlQk/k5giakcKsuxCObBRu6DSm9opw/O6slWbJdghQM4bBg==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">= 0.6"
|
||||
}
|
||||
},
|
||||
"node_modules/node-releases": {
|
||||
"version": "2.0.14",
|
||||
"resolved": "https://registry.npmjs.org/node-releases/-/node-releases-2.0.14.tgz",
|
||||
@ -5027,6 +5503,16 @@
|
||||
"url": "https://github.com/sponsors/ljharb"
|
||||
}
|
||||
},
|
||||
"node_modules/regexparam": {
|
||||
"version": "2.0.2",
|
||||
"resolved": "https://registry.npmjs.org/regexparam/-/regexparam-2.0.2.tgz",
|
||||
"integrity": "sha512-A1PeDEYMrkLrfyOwv2jwihXbo9qxdGD3atBYQA9JJgreAx8/7rC6IUkWOw2NQlOxLp2wL0ifQbh1HuidDfYA6w==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=8"
|
||||
}
|
||||
},
|
||||
"node_modules/resize-observer-polyfill": {
|
||||
"version": "1.5.1",
|
||||
"resolved": "https://registry.npmjs.org/resize-observer-polyfill/-/resize-observer-polyfill-1.5.1.tgz",
|
||||
@ -5301,6 +5787,66 @@
|
||||
"url": "https://github.com/sponsors/isaacs"
|
||||
}
|
||||
},
|
||||
"node_modules/sirv": {
|
||||
"version": "2.0.4",
|
||||
"resolved": "https://registry.npmjs.org/sirv/-/sirv-2.0.4.tgz",
|
||||
"integrity": "sha512-94Bdh3cC2PKrbgSOUqTiGPWVZeSiXfKOVZNJniWoqrWrRkB1CJzBU3NEbiTsPcYy1lDsANA/THzS+9WBiy5nfQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@polka/url": "^1.0.0-next.24",
|
||||
"mrmime": "^2.0.0",
|
||||
"totalist": "^3.0.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">= 10"
|
||||
}
|
||||
},
|
||||
"node_modules/sort-on": {
|
||||
"version": "6.0.0",
|
||||
"resolved": "https://registry.npmjs.org/sort-on/-/sort-on-6.0.0.tgz",
|
||||
"integrity": "sha512-d51VlJWoFQjp+cIZRyNusCyJdP5pLAw+H+sC4C2q6RhPBv+RAb/QXXck5q3Kdm7h/ot/kD2AlpGPDee8v+0qiA==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"dot-prop": "^8.0.2"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/sort-on/node_modules/dot-prop": {
|
||||
"version": "8.0.2",
|
||||
"resolved": "https://registry.npmjs.org/dot-prop/-/dot-prop-8.0.2.tgz",
|
||||
"integrity": "sha512-xaBe6ZT4DHPkg0k4Ytbvn5xoxgpG0jOS1dYxSOwAHPuNLjP3/OzN0gH55SrLqpx8cBfSaVt91lXYkApjb+nYdQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"type-fest": "^3.8.0"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/sort-on/node_modules/type-fest": {
|
||||
"version": "3.13.1",
|
||||
"resolved": "https://registry.npmjs.org/type-fest/-/type-fest-3.13.1.tgz",
|
||||
"integrity": "sha512-tLq3bSNx+xSpwvAJnzrK0Ep5CLNWjvFTOp71URMaAEWBfRb9nnJiBoUe0tF8bI4ZFO3omgBR6NvnbzVUT3Ly4g==",
|
||||
"dev": true,
|
||||
"license": "(MIT OR CC0-1.0)",
|
||||
"engines": {
|
||||
"node": ">=14.16"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/sindresorhus"
|
||||
}
|
||||
},
|
||||
"node_modules/source-map-js": {
|
||||
"version": "1.2.0",
|
||||
"resolved": "https://registry.npmjs.org/source-map-js/-/source-map-js-1.2.0.tgz",
|
||||
@ -5311,6 +5857,19 @@
|
||||
"node": ">=0.10.0"
|
||||
}
|
||||
},
|
||||
"node_modules/steno": {
|
||||
"version": "4.0.2",
|
||||
"resolved": "https://registry.npmjs.org/steno/-/steno-4.0.2.tgz",
|
||||
"integrity": "sha512-yhPIQXjrlt1xv7dyPQg2P17URmXbuM5pdGkpiMB3RenprfiBlvK415Lctfe0eshk90oA7/tNq7WEiMK8RSP39A==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=18"
|
||||
},
|
||||
"funding": {
|
||||
"url": "https://github.com/sponsors/typicode"
|
||||
}
|
||||
},
|
||||
"node_modules/string-convert": {
|
||||
"version": "0.2.1",
|
||||
"resolved": "https://registry.npmjs.org/string-convert/-/string-convert-0.2.1.tgz",
|
||||
@ -5720,6 +6279,16 @@
|
||||
"integrity": "sha512-BiZS+C1OS8g/q2RRbJmy59xpyghNBqrr6k5L/uKBGRsTfxmu3ffiRnd8mlGPUVayg8pvfi5urfnu8TU7DVOkLQ==",
|
||||
"license": "MIT"
|
||||
},
|
||||
"node_modules/totalist": {
|
||||
"version": "3.0.1",
|
||||
"resolved": "https://registry.npmjs.org/totalist/-/totalist-3.0.1.tgz",
|
||||
"integrity": "sha512-sf4i37nQ2LBx4m3wB74y+ubopq6W/dIzXg0FDGjsYnZHVa1Da8FH853wlL2gtUhg+xJXjfk3kUZS3BRoQeoQBQ==",
|
||||
"dev": true,
|
||||
"license": "MIT",
|
||||
"engines": {
|
||||
"node": ">=6"
|
||||
}
|
||||
},
|
||||
"node_modules/ts-interface-checker": {
|
||||
"version": "0.1.13",
|
||||
"resolved": "https://registry.npmjs.org/ts-interface-checker/-/ts-interface-checker-0.1.13.tgz",
|
||||
|
||||
@ -7,8 +7,13 @@
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"lint": "eslint . --ext js,jsx --report-unused-disable-directives --max-warnings 0",
|
||||
"preview": "vite preview"
|
||||
"preview": "vite preview",
|
||||
"start": "react-scripts start",
|
||||
"test": "react-scripts test",
|
||||
"eject": "react-scripts eject",
|
||||
"server": "json-server --watch db.json --port 5000"
|
||||
},
|
||||
"proxy": "http://localhost:5000",
|
||||
"dependencies": {
|
||||
"@ant-design/icons": "^5.3.7",
|
||||
"antd": "^5.18.2",
|
||||
@ -26,6 +31,7 @@
|
||||
"eslint-plugin-react": "^7.34.1",
|
||||
"eslint-plugin-react-hooks": "^4.6.0",
|
||||
"eslint-plugin-react-refresh": "^0.4.6",
|
||||
"json-server": "^1.0.0-beta.1",
|
||||
"postcss": "^8.4.38",
|
||||
"tailwindcss": "^3.4.4",
|
||||
"vite": "^5.2.0"
|
||||
|
||||
8
public/customers.json
Normal file
8
public/customers.json
Normal file
@ -0,0 +1,8 @@
|
||||
|
||||
[
|
||||
{ "id": "12d22", "name": "Jane Cooper" },
|
||||
{ "id": "5d255", "name": "Esther Howard" },
|
||||
{ "id": "147r7", "name": "Guy Hawkins" },
|
||||
{ "id": "124fd", "name": "Savannah Nguyen" }
|
||||
]
|
||||
|
||||
27
public/db.json
Normal file
27
public/db.json
Normal file
@ -0,0 +1,27 @@
|
||||
{
|
||||
"posts": [
|
||||
{ "id": "1", "title": "a title", "views": 100 },
|
||||
{ "id": "2", "title": "another title", "views": 200 }
|
||||
],
|
||||
"comments": [
|
||||
{ "id": "1", "text": "a comment about post 1", "postId": "1" },
|
||||
{ "id": "2", "text": "another comment about post 1", "postId": "1" }
|
||||
],
|
||||
"profile": {
|
||||
"name": "suraj"
|
||||
},
|
||||
"users": [
|
||||
{
|
||||
"id": "1",
|
||||
"email": "admin@example.com",
|
||||
"password": "adminpassword",
|
||||
"role": "admin"
|
||||
},
|
||||
{
|
||||
"id": "2",
|
||||
"email": "employee@example.com",
|
||||
"password": "employeepassword",
|
||||
"role": "employee"
|
||||
}
|
||||
]
|
||||
}
|
||||
@ -1,12 +1,22 @@
|
||||
// src/api/axiosConfig.js
|
||||
|
||||
import axios from 'axios';
|
||||
|
||||
const axiosInstance = axios.create({
|
||||
baseURL: 'http://your-backend-url.com', // Replace with your backend URL
|
||||
timeout: 10000, // Timeout after 10 seconds
|
||||
baseURL: '/api',
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
},
|
||||
});
|
||||
|
||||
axiosInstance.interceptors.request.use((config) => {
|
||||
const token = localStorage.getItem('token');
|
||||
if (token) {
|
||||
config.headers.Authorization = `Bearer ${token}`;
|
||||
}
|
||||
return config;
|
||||
}, (error) => {
|
||||
return Promise.reject(error);
|
||||
});
|
||||
|
||||
export default axiosInstance;
|
||||
|
||||
@ -11,24 +11,35 @@ const LoginPage = () => {
|
||||
|
||||
const handleLogin = async (e) => {
|
||||
e.preventDefault();
|
||||
setError(''); // Reset error message
|
||||
|
||||
setError('');
|
||||
|
||||
try {
|
||||
const response = await axios.post('/login', { email, password });
|
||||
const { role } = response.data;
|
||||
|
||||
if (role === 'admin') {
|
||||
navigate('/admin');
|
||||
} else if (role === 'employee') {
|
||||
navigate('/employee');
|
||||
const response = await axiosInstance.get('http://localhost:5000/users');
|
||||
|
||||
const user = response.data.find(user => user.email === email && user.password === password);
|
||||
|
||||
if (user) {
|
||||
if (user.role === 'admin') {
|
||||
navigate('/admin');
|
||||
} else if (user.role === 'employee') {
|
||||
navigate('/employee');
|
||||
} else {
|
||||
setError('Invalid credentials');
|
||||
}
|
||||
} else {
|
||||
setError('Invalid credentials');
|
||||
}
|
||||
} catch (err) {
|
||||
setError('Login failed. Please try again.');
|
||||
if (err.response) {
|
||||
setError(`Login failed: ${err.response.data.message}`);
|
||||
} else if (err.request) {
|
||||
setError('Login failed. No response from server.');
|
||||
} else {
|
||||
setError('Login failed. Please try again.');
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
return (
|
||||
<div className="flex flex-row min-h-screen justify-center items-center">
|
||||
<div className="login-page flex items-center justify-center min-h-screen w-full md:w-1/2 lg:w-1/3 p-4">
|
||||
@ -37,9 +48,7 @@ const LoginPage = () => {
|
||||
<p>Be among the first to experience 3D magic! Register for private alpha.</p>
|
||||
{error && <p className="error-message">{error}</p>}
|
||||
<form onSubmit={handleLogin} className="space-y-4">
|
||||
<label htmlFor="email" className="block">
|
||||
|
||||
</label>
|
||||
<label htmlFor="email" className="block"></label>
|
||||
<input
|
||||
type="email"
|
||||
id="email"
|
||||
@ -50,9 +59,7 @@ const LoginPage = () => {
|
||||
required
|
||||
className="input-field"
|
||||
/>
|
||||
<label htmlFor="password" className="block">
|
||||
|
||||
</label>
|
||||
<label htmlFor="password" className="block"></label>
|
||||
<input
|
||||
type="password"
|
||||
id="password"
|
||||
@ -66,7 +73,7 @@ const LoginPage = () => {
|
||||
<div className="forgot-password-container">
|
||||
<a href="#">Forgot password?</a>
|
||||
</div>
|
||||
<button type="submit" className="login-button">
|
||||
<button type="submit" className="login-button">
|
||||
Login
|
||||
</button>
|
||||
</form>
|
||||
|
||||
29
src/components/UserList.jsx
Normal file
29
src/components/UserList.jsx
Normal file
@ -0,0 +1,29 @@
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import axiosInstance from '../api/axiosInstance';
|
||||
|
||||
const UsersList = () => {
|
||||
const [users, setUsers] = useState([]);
|
||||
|
||||
useEffect(() => {
|
||||
axiosInstance.get('/users')
|
||||
.then(response => {
|
||||
setUsers(response.data);
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('There was an error fetching the users!', error);
|
||||
});
|
||||
}, []);
|
||||
|
||||
return (
|
||||
<div>
|
||||
<h1>Users List</h1>
|
||||
<ul>
|
||||
{users.map(user => (
|
||||
<li key={user.id}>{user.name}</li>
|
||||
))}
|
||||
</ul>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default UsersList;
|
||||
@ -6,8 +6,8 @@ const AddCustomer = () => {
|
||||
return (
|
||||
<div className="flex flex-row">
|
||||
<Sidebar />
|
||||
<div className="w-full flex flex-col min-h-screen bg-gray-900 text-white">
|
||||
<div className="min-h-screen bg-gray-900 text-gray-300 p-6">
|
||||
<div className="w-full flex flex-col min-h-screen text-white">
|
||||
<div className="min-h-screen text-gray-300 p-6">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h1 className="text-2xl font-semibold text-orange-500">Add Customer</h1>
|
||||
<Link to="/" className="text-orange-500">skip for now</Link>
|
||||
|
||||
@ -1,16 +1,18 @@
|
||||
import React from 'react';
|
||||
import React, { useState, useEffect } from 'react';
|
||||
import { useNavigate } from 'react-router-dom';
|
||||
import Sidebar from '../sidebar/Sidebar';
|
||||
|
||||
const CustomerList = () => {
|
||||
const [customers, setCustomers] = useState([]);
|
||||
const navigate = useNavigate();
|
||||
|
||||
const customers = [
|
||||
{ id: '12d22', name: 'jane cooper' },
|
||||
{ id: '5d255', name: 'esther howard' },
|
||||
{ id: '147r7', name: 'guy hawkins' },
|
||||
{ id: '124fd', name: 'savannah nguyen' },
|
||||
];
|
||||
useEffect(() => {
|
||||
// Fetch the customers data from the JSON file
|
||||
fetch('/customers.json')
|
||||
.then((response) => response.json())
|
||||
.then((data) => setCustomers(data))
|
||||
.catch((error) => console.error('Error fetching customers:', error));
|
||||
}, []);
|
||||
|
||||
const handleAddCustomer = () => {
|
||||
navigate('/add-customer');
|
||||
@ -22,27 +24,27 @@ const CustomerList = () => {
|
||||
<div className="w-full flex flex-col bg-#090909B text-white">
|
||||
<div className="bg-[#090909B] text-gray-300 p-6 rounded-lg">
|
||||
<div className="flex justify-between items-center mb-4">
|
||||
<h1 className="text-xl font-semibold text-orange-500">customers list</h1>
|
||||
<button
|
||||
<h1 className="text-xl font-semibold text-orange-500">Customers List</h1>
|
||||
<button
|
||||
className="bg-orange-500 text-black px-4 py-2 rounded-md text-sm"
|
||||
onClick={handleAddCustomer}
|
||||
>
|
||||
add new customer
|
||||
Add New Customer
|
||||
</button>
|
||||
</div>
|
||||
<div className="flex items-center mb-4">
|
||||
<svg className="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M3 4a1 1 0 011-1h16a1 1 0 011 1v2.586a1 1 0 01-.293.707l-6.414 6.414a1 1 0 00-.293.707V17l-4 4v-6.586a1 1 0 00-.293-.707L3.293 7.293A1 1 0 013 6.586V4z" />
|
||||
</svg>
|
||||
<span className="text-sm">filter </span>
|
||||
<span className="text-sm">Filter</span>
|
||||
</div>
|
||||
<p className="text-sm mb-4">total customers ({customers.length})</p>
|
||||
<p className="text-sm mb-4">Total Customers ({customers.length})</p>
|
||||
<table className="w-full">
|
||||
<thead>
|
||||
<tr className="text-left text-xs uppercase">
|
||||
<th className="py-2">#</th>
|
||||
<th className="py-2">customer id</th>
|
||||
<th className="py-2">customer name</th>
|
||||
<th className="py-2">Customer ID</th>
|
||||
<th className="py-2">Customer Name</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
|
||||
@ -1,68 +1,81 @@
|
||||
import React from 'react';
|
||||
import { Button, Input, Form } from 'antd';
|
||||
import { Link } from 'react-router-dom';
|
||||
import axios from 'axios';
|
||||
import Sidebar from '../sidebar/Sidebar';
|
||||
|
||||
const CustomerMeasurements = () => {
|
||||
const onFinish = (values) => {
|
||||
console.log('Measurements:', values);
|
||||
const onFinish = async (values) => {
|
||||
const token = localStorage.getItem('token'); // Assuming the token is stored in localStorage
|
||||
|
||||
try {
|
||||
const response = await axios.post('http://localhost:8080/measurements', values, {
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`,
|
||||
},
|
||||
});
|
||||
|
||||
console.log(response.data);
|
||||
} catch (error) {
|
||||
console.error('Error saving measurements:', error);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="flex flex-row">
|
||||
<Sidebar />
|
||||
<div className="w-full flex flex-col min-h-screen bg-gray-900 text-white">
|
||||
<div className="min-h-screen bg-gray-900 text-gray-300 p-6">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h1 className="text-2xl font-semibold text-orange-500">Customer Measurements</h1>
|
||||
<Link to="/" className="text-orange-500">skip for now</Link>
|
||||
</div>
|
||||
<Form onFinish={onFinish} className="space-y-4">
|
||||
<h2 className="text-lg font-semibold text-gray-400">Upper Body Measurements</h2>
|
||||
<Form.Item name="neck" label="Neck Circumference (in inch)">
|
||||
<Input className=" block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="chest" label="Chest Circumference (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="waist" label="Waist Circumference (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="shoulder" label="Shoulder Width (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="arm" label="Arm Length (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="sleeve" label="Sleeve Length (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<div className="w-full flex flex-col min-h-screen text-white">
|
||||
<div className="min-h-screen text-gray-300 p-6">
|
||||
<div className="flex justify-between items-center mb-6">
|
||||
<h1 className="text-2xl font-semibold text-orange-500">Customer Measurements</h1>
|
||||
<Link to="/" className="text-orange-500">skip for now</Link>
|
||||
</div>
|
||||
<Form onFinish={onFinish} className="space-y-4">
|
||||
<h2 className="text-lg font-semibold text-gray-400">Upper Body Measurements</h2>
|
||||
<Form.Item name="neck" label={<span className="text-white">Neck Circumference (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="chest" label={<span className="text-white">Chest Circumference (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="waist" label={<span className="text-white">Waist Circumference (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="shoulder" label={<span className="text-white">Shoulder Width (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="arm" label={<span className="text-white">Arm Length (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="sleeve" label={<span className="text-white">Sleeve Length (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
|
||||
<h2 className="text-lg font-semibold text-gray-400">Lower Body Measurements</h2>
|
||||
<Form.Item name="hip" label="Hip Circumference (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="inseam" label="Inseam (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="outseam" label="Out Seam (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="thigh" label="Thigh Circumference (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="ankle" label="Ankle Circumference (in inch)">
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit" className="w-full py-4 bg-orange-500 text-black rounded-md font-semibold mb-4 hover:bg-orange-400">
|
||||
Save Measurements
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
<h2 className="text-lg font-semibold text-gray-400">Lower Body Measurements</h2>
|
||||
<Form.Item name="hip" label={<span className="text-white">Hip Circumference (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="inseam" label={<span className="text-white">Inseam (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="outseam" label={<span className="text-white">Out Seam (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="thigh" label={<span className="text-white">Thigh Circumference (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item name="ankle" label={<span className="text-white">Ankle Circumference (in inch)</span>}>
|
||||
<Input className="block text-sm font-medium text-black-400" />
|
||||
</Form.Item>
|
||||
<Form.Item>
|
||||
<Button type="primary" htmlType="submit" className="w-full py-4 bg-orange-500 text-black rounded-md font-semibold mb-4 hover:bg-orange-400">
|
||||
Save Measurements
|
||||
</Button>
|
||||
</Form.Item>
|
||||
</Form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@ -9,8 +9,8 @@ const HomePage = () => {
|
||||
return (
|
||||
<div className="flex flex-row">
|
||||
<Sidebar />
|
||||
<div className="w-full flex flex-col min-h-screen bg-gray-900 text-white">
|
||||
<header className="w-full p-4 flex justify-between items-center bg-gray-900">
|
||||
<div className="w-full flex flex-col min-h-screen text-white">
|
||||
<header className="w-full p-4 flex justify-between items-center">
|
||||
<div className="flex items-center">
|
||||
<h1 className="text-orange-500 text-2xl font-bold">home</h1>
|
||||
</div>
|
||||
@ -29,13 +29,13 @@ const HomePage = () => {
|
||||
</button>
|
||||
<button
|
||||
className="w-full py-4 bg-orange-500 text-black rounded-md font-semibold mb-4 hover:bg-orange-400"
|
||||
onClick={() => handleClick('/customers')}
|
||||
onClick={() => handleClick('')}
|
||||
>
|
||||
view orders
|
||||
</button>
|
||||
<button
|
||||
className="w-full py-4 bg-orange-500 text-black rounded-md font-semibold mb-4 hover:bg-orange-400"
|
||||
onClick={() => handleClick('/customers')}
|
||||
onClick={() => handleClick('')}
|
||||
>
|
||||
view customers
|
||||
</button>
|
||||
|
||||
@ -1,6 +1,10 @@
|
||||
import React from 'react';
|
||||
import { Layout } from 'antd';
|
||||
import React, { useState } from 'react';
|
||||
import { Layout, Drawer, Button } from 'antd';
|
||||
import { Link } from 'react-router-dom';
|
||||
import {
|
||||
MenuFoldOutlined,
|
||||
MenuUnfoldOutlined,
|
||||
} from '@ant-design/icons';
|
||||
import HomeIcon from '../../assets/thob-data/HomeIcon.svg';
|
||||
import AddCustomerIcon from '../../assets/thob-data/AddCustomerIcon.svg';
|
||||
import OrdersIcon from '../../assets/thob-data/OrdersIcon.svg';
|
||||
@ -8,35 +12,89 @@ import CategoriesIcon from '../../assets/thob-data/CategoriesIcon.svg';
|
||||
import ProfileIcon from '../../assets/thob-data/ProfileIcon.svg';
|
||||
import LogoutIcon from '../../assets/thob-data/LogoutIcon.svg';
|
||||
|
||||
|
||||
const { Sider } = Layout;
|
||||
|
||||
const EmployeeSidebar = () => {
|
||||
const [visible, setVisible] = useState(false);
|
||||
|
||||
const showDrawer = () => {
|
||||
setVisible(true);
|
||||
};
|
||||
|
||||
const closeDrawer = () => {
|
||||
setVisible(false);
|
||||
};
|
||||
|
||||
return (
|
||||
<Sider width={60} style={{ height: '1024px' }} className="bg-gray-800">
|
||||
<div className="flex items-center justify-center h-16 w-16 m-5 bg-white" style={{ width: '40px', height: '40px', marginTop: '16px', marginLeft: '20px' }}>
|
||||
<div className="text-black">t.</div>
|
||||
</div>
|
||||
<div className="flex flex-col items-center" style={{ marginTop: '309.5px', marginLeft: '27px' }}>
|
||||
<Link to="/employee-dashboard" className="my-6">
|
||||
<img src={HomeIcon} alt="Home" className="hover:opacity-75" style={{ width: '25px', height: '405px' }} />
|
||||
</Link>
|
||||
<Link to="/employee/categories" className="my-6">
|
||||
<img src={CategoriesIcon} alt="Categories" className="hover:opacity-75" style={{ width: '25px', height: '405px' }} />
|
||||
</Link>
|
||||
<Link to="/employee/manage-customers" className="my-6">
|
||||
<img src={AddCustomerIcon} alt="Add Customer" className="hover:opacity-75" style={{ width: '25px', height: '405px' }} />
|
||||
</Link>
|
||||
<Link to="/employee/orders" className="my-6">
|
||||
<img src={OrdersIcon} alt="Orders" className="hover:opacity-75" style={{ width: '25px', height: '405px' }} />
|
||||
</Link>
|
||||
<Link to="/employee/profile" className="my-6">
|
||||
<img src={ProfileIcon} alt="Profile" className="hover:opacity-75" style={{ width: '25px', height: '405px' }} />
|
||||
</Link>
|
||||
<Link to="/employee/logout" className="my-6" style={{ marginTop: '958px', marginLeft: '27.5px' }}>
|
||||
<img src={LogoutIcon} alt="Logout" className="hover:opacity-75" style={{ width: '24px', height: '24px' }} />
|
||||
</Link>
|
||||
</div>
|
||||
</Sider>
|
||||
<>
|
||||
<Button
|
||||
className="menu-button"
|
||||
type="primary"
|
||||
onClick={showDrawer}
|
||||
icon={visible ? <MenuUnfoldOutlined /> : <MenuFoldOutlined />}
|
||||
/>
|
||||
<Drawer
|
||||
title="Menu"
|
||||
placement="left"
|
||||
onClose={closeDrawer}
|
||||
visible={visible}
|
||||
bodyStyle={{ padding: 0 }}
|
||||
width={200}
|
||||
>
|
||||
<div className="drawer-menu">
|
||||
<Link to="/employee-dashboard" className="drawer-link">
|
||||
<img src={HomeIcon} alt="Home" className="drawer-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/categories" className="drawer-link">
|
||||
<img src={CategoriesIcon} alt="Categories" className="drawer-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/manage-customers" className="drawer-link">
|
||||
<img src={AddCustomerIcon} alt="Add Customer" className="drawer-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/orders" className="drawer-link">
|
||||
<img src={OrdersIcon} alt="Orders" className="drawer-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/profile" className="drawer-link">
|
||||
<img src={ProfileIcon} alt="Profile" className="drawer-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/logout" className="drawer-link">
|
||||
<img src={LogoutIcon} alt="Logout" className="drawer-icon" />
|
||||
</Link>
|
||||
</div>
|
||||
</Drawer>
|
||||
<Sider
|
||||
className="desktop-sidebar"
|
||||
breakpoint="lg"
|
||||
collapsedWidth="0"
|
||||
width={200}
|
||||
style={{ height: '100vh' }}
|
||||
>
|
||||
<div className="flex items-center justify-center h-16 w-16 m-5 bg-white" style={{ width: '40px', height: '40px', marginTop: '16px', marginLeft: '20px' }}>
|
||||
<div className="text-black">t.</div>
|
||||
</div>
|
||||
<div className="flex flex-col items-center">
|
||||
<Link to="/employee-dashboard" className="my-6">
|
||||
<img src={HomeIcon} alt="Home" className="hover:opacity-75 sidebar-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/categories" className="my-6">
|
||||
<img src={CategoriesIcon} alt="Categories" className="hover:opacity-75 sidebar-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/manage-customers" className="my-6">
|
||||
<img src={AddCustomerIcon} alt="Add Customer" className="hover:opacity-75 sidebar-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/orders" className="my-6">
|
||||
<img src={OrdersIcon} alt="Orders" className="hover:opacity-75 sidebar-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/profile" className="my-6">
|
||||
<img src={ProfileIcon} alt="Profile" className="hover:opacity-75 sidebar-icon" />
|
||||
</Link>
|
||||
<Link to="/employee/logout" className="my-6">
|
||||
<img src={LogoutIcon} alt="Logout" className="hover:opacity-75 sidebar-icon" />
|
||||
</Link>
|
||||
</div>
|
||||
</Sider>
|
||||
</>
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@ -22,7 +22,7 @@ const Sidebar = () => {
|
||||
// return user.role === 'admin' ? <AdminSidebar /> : <EmployeeSidebar />;
|
||||
return (
|
||||
<div className="flex">
|
||||
<div className="bg-gray-800 w-16 min-h-screen flex flex-col items-center">
|
||||
<div className=" w-16 min-h-screen flex flex-col items-center">
|
||||
<div className="text-white text-4xl mt-4">t.</div>
|
||||
<nav className="mt-10">
|
||||
<div onClick={() => handleNavigation("/admin-dashboard")} className="block mb-4">
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user