Changeset 16237c4


Ignore:
Timestamp:
09/08/22 12:38:24 (2 years ago)
Author:
Nace Gjorgjievski <nace.gorgievski123@…>
Branches:
master
Children:
ee05663
Parents:
717ceae
Message:

Added Order Functionality

Files:
12 added
13 edited

Legend:

Unmodified
Added
Removed

  • backend/models/userModel.js

    r717ceae r16237c4  
    44  {
    55    name: { type: String, required: true },
     6    contact: { type: String, required: true },
    67    email: { type: String, required: true, unique: true },
    78    password: { type: String, required: true },

  • backend/package-lock.json

    r717ceae r16237c4  
    1313        "dotenv": "^16.0.1",
    1414        "express": "^4.18.1",
     15        "express-async-handler": "^1.2.0",
     16        "jsonwebtoken": "^8.5.1",
    1517        "mongoose": "^6.5.3"
    1618      },
    … …  
    192194      }
    193195    },
     196    "node_modules/buffer-equal-constant-time": {
     197      "version": "1.0.1",
     198      "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
     199      "integrity": "sha512-zRpUiDwd/xk6ADqPMATG8vc9VPrkck7T07OIx0gnjmJAnHnTVXNQG3vfvWNuiZIkwu9KrKdA1iJKfsfTVxE6NA=="
     200    },
    194201    "node_modules/bytes": {
    195202      "version": "3.1.2",
    … …  
    316323      "engines": {
    317324        "node": ">=12"
     325      }
     326    },
     327    "node_modules/ecdsa-sig-formatter": {
     328      "version": "1.0.11",
     329      "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
     330      "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
     331      "dependencies": {
     332        "safe-buffer": "^5.0.1"
    318333      }
    319334    },
    … …  
    385400      }
    386401    },
     402    "node_modules/express-async-handler": {
     403      "version": "1.2.0",
     404      "resolved": "https://registry.npmjs.org/express-async-handler/-/express-async-handler-1.2.0.tgz",
     405      "integrity": "sha512-rCSVtPXRmQSW8rmik/AIb2P0op6l7r1fMW538yyvTMltCO4xQEWMmobfrIxN2V1/mVrgxB8Az3reYF6yUZw37w=="
     406    },
    387407    "node_modules/fill-range": {
    388408      "version": "7.0.1",
    … …  
    616636      }
    617637    },
     638    "node_modules/jsonwebtoken": {
     639      "version": "8.5.1",
     640      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
     641      "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
     642      "dependencies": {
     643        "jws": "^3.2.2",
     644        "lodash.includes": "^4.3.0",
     645        "lodash.isboolean": "^3.0.3",
     646        "lodash.isinteger": "^4.0.4",
     647        "lodash.isnumber": "^3.0.3",
     648        "lodash.isplainobject": "^4.0.6",
     649        "lodash.isstring": "^4.0.1",
     650        "lodash.once": "^4.0.0",
     651        "ms": "^2.1.1",
     652        "semver": "^5.6.0"
     653      },
     654      "engines": {
     655        "node": ">=4",
     656        "npm": ">=1.4.28"
     657      }
     658    },
     659    "node_modules/jsonwebtoken/node_modules/ms": {
     660      "version": "2.1.3",
     661      "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
     662      "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="
     663    },
     664    "node_modules/jwa": {
     665      "version": "1.4.1",
     666      "resolved": "https://registry.npmjs.org/jwa/-/jwa-1.4.1.tgz",
     667      "integrity": "sha512-qiLX/xhEEFKUAJ6FiBMbes3w9ATzyk5W7Hvzpa/SLYdxNtng+gcurvrI7TbACjIXlsJyr05/S1oUhZrc63evQA==",
     668      "dependencies": {
     669        "buffer-equal-constant-time": "1.0.1",
     670        "ecdsa-sig-formatter": "1.0.11",
     671        "safe-buffer": "^5.0.1"
     672      }
     673    },
     674    "node_modules/jws": {
     675      "version": "3.2.2",
     676      "resolved": "https://registry.npmjs.org/jws/-/jws-3.2.2.tgz",
     677      "integrity": "sha512-YHlZCB6lMTllWDtSPHz/ZXTsi8S00usEV6v1tjq8tOUZzw7DpSDWVXjXDre6ed1w/pd495ODpHZYSdkRTsa0HA==",
     678      "dependencies": {
     679        "jwa": "^1.4.1",
     680        "safe-buffer": "^5.0.1"
     681      }
     682    },
    618683    "node_modules/kareem": {
    619684      "version": "2.4.1",
    620685      "resolved": "https://registry.npmjs.org/kareem/-/kareem-2.4.1.tgz",
    621686      "integrity": "sha512-aJ9opVoXroQUPfovYP5kaj2lM7Jn02Gw13bL0lg9v0V7SaUc0qavPs0Eue7d2DcC3NjqI6QAUElXNsuZSeM+EA=="
     687    },
     688    "node_modules/lodash.includes": {
     689      "version": "4.3.0",
     690      "resolved": "https://registry.npmjs.org/lodash.includes/-/lodash.includes-4.3.0.tgz",
     691      "integrity": "sha512-W3Bx6mdkRTGtlJISOvVD/lbqjTlPPUDTMnlXZFnVwi9NKJ6tiAk6LVdlhZMm17VZisqhKcgzpO5Wz91PCt5b0w=="
     692    },
     693    "node_modules/lodash.isboolean": {
     694      "version": "3.0.3",
     695      "resolved": "https://registry.npmjs.org/lodash.isboolean/-/lodash.isboolean-3.0.3.tgz",
     696      "integrity": "sha512-Bz5mupy2SVbPHURB98VAcw+aHh4vRV5IPNhILUCsOzRmsTmSQ17jIuqopAentWoehktxGd9e/hbIXq980/1QJg=="
     697    },
     698    "node_modules/lodash.isinteger": {
     699      "version": "4.0.4",
     700      "resolved": "https://registry.npmjs.org/lodash.isinteger/-/lodash.isinteger-4.0.4.tgz",
     701      "integrity": "sha512-DBwtEWN2caHQ9/imiNeEA5ys1JoRtRfY3d7V9wkqtbycnAmTvRRmbHKDV4a0EYc678/dia0jrte4tjYwVBaZUA=="
     702    },
     703    "node_modules/lodash.isnumber": {
     704      "version": "3.0.3",
     705      "resolved": "https://registry.npmjs.org/lodash.isnumber/-/lodash.isnumber-3.0.3.tgz",
     706      "integrity": "sha512-QYqzpfwO3/CWf3XP+Z+tkQsfaLL/EnUlXWVkIk5FUPc4sBdTehEqZONuyRt2P67PXAk+NXmTBcc97zw9t1FQrw=="
     707    },
     708    "node_modules/lodash.isplainobject": {
     709      "version": "4.0.6",
     710      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
     711      "integrity": "sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA=="
     712    },
     713    "node_modules/lodash.isstring": {
     714      "version": "4.0.1",
     715      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
     716      "integrity": "sha512-0wJxfxH1wgO3GrbuP+dTTk7op+6L41QCXbGINEmD+ny/G/eCqGzxyCsh7159S+mgDDcoarnBw6PC1PS5+wUGgw=="
     717    },
     718    "node_modules/lodash.once": {
     719      "version": "4.1.1",
     720      "resolved": "https://registry.npmjs.org/lodash.once/-/lodash.once-4.1.1.tgz",
     721      "integrity": "sha512-Sb487aTOCr9drQVL8pIxOzVhafOjZN9UU54hiN8PU3uAiSV7lx1yYNpbNmex2PK6dSJoNTSJUUswT651yww3Mg=="
    622722    },
    623723    "node_modules/media-typer": {
    … …  
    10211121      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
    10221122      "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
    1023       "dev": true,
    10241123      "bin": {
    10251124        "semver": "bin/semver"
    … …  
    13961495      }
    13971496    },
     1497    "buffer-equal-constant-time": {
     1498      "version": "1.0.1",
     1499      "resolved": "https://registry.npmjs.org/buffer-equal-constant-time/-/buffer-equal-constant-time-1.0.1.tgz",
     1500      "integrity": "sha512-zRpUiDwd/xk6ADqPMATG8vc9VPrkck7T07OIx0gnjmJAnHnTVXNQG3vfvWNuiZIkwu9KrKdA1iJKfsfTVxE6NA=="
     1501    },
    13981502    "bytes": {
    13991503      "version": "3.1.2",
    … …  
    14821586      "resolved": "https://registry.npmjs.org/dotenv/-/dotenv-16.0.1.tgz",
    14831587      "integrity": "sha512-1K6hR6wtk2FviQ4kEiSjFiH5rpzEVi8WW0x96aztHVMhEspNpc4DVOUTEHtEva5VThQ8IaBX1Pe4gSzpVVUsKQ=="
     1588    },
     1589    "ecdsa-sig-formatter": {
     1590      "version": "1.0.11",
     1591      "resolved": "https://registry.npmjs.org/ecdsa-sig-formatter/-/ecdsa-sig-formatter-1.0.11.tgz",
     1592      "integrity": "sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==",
     1593      "requires": {
     1594        "safe-buffer": "^5.0.1"
     1595      }
    14841596    },
    14851597    "ee-first": {
    … …  
    15411653      }
    15421654    },
     1655    "express-async-handler": {
     1656      "version": "1.2.0",
     1657      "resolved": "https://registry.npmjs.org/express-async-handler/-/express-async-handler-1.2.0.tgz",
     1658      "integrity": "sha512-rCSVtPXRmQSW8rmik/AIb2P0op6l7r1fMW538yyvTMltCO4xQEWMmobfrIxN2V1/mVrgxB8Az3reYF6yUZw37w=="
     1659    },
    15431660    "fill-range": {
    15441661      "version": "7.0.1",
    … …  
    17001817      "dev": true
    17011818    },
     1819    "jsonwebtoken": {
     1820      "version": "8.5.1",
     1821      "resolved": "https://registry.npmjs.org/jsonwebtoken/-/jsonwebtoken-8.5.1.tgz",
     1822      "integrity": "sha512-XjwVfRS6jTMsqYs0EsuJ4LGxXV14zQybNd4L2r0UvbVnSF9Af8x7p5MzbJ90Ioz/9TI41/hTCvznF/loiSzn8w==",
     1823      "requires": {
     1824        "jws": "^3.2.2",
     1825        "lodash.includes": "^4.3.0",
     1826        "lodash.isboolean": "^3.0.3",
     1827        "lodash.isinteger": "^4.0.4",
     1828        "lodash.isnumber": "^3.0.3",
     1829        "lodash.isplainobject": "^4.0.6",
     1830        "lodash.isstring": "^4.0.1",
     1831        "lodash.once": "^4.0.0",
     1832        "ms": "^2.1.1",
     1833        "semver": "^5.6.0"
     1834      },
     1835      "dependencies": {
     1836        "ms": {
     1837          "version": "2.1.3",
     1838          "resolved": "https://registry.npmjs.org/ms/-/ms-2.1.3.tgz",
     1839          "integrity": "sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA=="
     1840        }
     1841      }
     1842    },
     1843    "jwa": {
     1844      "version": "1.4.1",
     1845      "resolved": "https://registry.npmjs.org/jwa/-/jwa-1.4.1.tgz",
     1846      "integrity": "sha512-qiLX/xhEEFKUAJ6FiBMbes3w9ATzyk5W7Hvzpa/SLYdxNtng+gcurvrI7TbACjIXlsJyr05/S1oUhZrc63evQA==",
     1847      "requires": {
     1848        "buffer-equal-constant-time": "1.0.1",
     1849        "ecdsa-sig-formatter": "1.0.11",
     1850        "safe-buffer": "^5.0.1"
     1851      }
     1852    },
     1853    "jws": {
     1854      "version": "3.2.2",
     1855      "resolved": "https://registry.npmjs.org/jws/-/jws-3.2.2.tgz",
     1856      "integrity": "sha512-YHlZCB6lMTllWDtSPHz/ZXTsi8S00usEV6v1tjq8tOUZzw7DpSDWVXjXDre6ed1w/pd495ODpHZYSdkRTsa0HA==",
     1857      "requires": {
     1858        "jwa": "^1.4.1",
     1859        "safe-buffer": "^5.0.1"
     1860      }
     1861    },
    17021862    "kareem": {
    17031863      "version": "2.4.1",
    17041864      "resolved": "https://registry.npmjs.org/kareem/-/kareem-2.4.1.tgz",
    17051865      "integrity": "sha512-aJ9opVoXroQUPfovYP5kaj2lM7Jn02Gw13bL0lg9v0V7SaUc0qavPs0Eue7d2DcC3NjqI6QAUElXNsuZSeM+EA=="
     1866    },
     1867    "lodash.includes": {
     1868      "version": "4.3.0",
     1869      "resolved": "https://registry.npmjs.org/lodash.includes/-/lodash.includes-4.3.0.tgz",
     1870      "integrity": "sha512-W3Bx6mdkRTGtlJISOvVD/lbqjTlPPUDTMnlXZFnVwi9NKJ6tiAk6LVdlhZMm17VZisqhKcgzpO5Wz91PCt5b0w=="
     1871    },
     1872    "lodash.isboolean": {
     1873      "version": "3.0.3",
     1874      "resolved": "https://registry.npmjs.org/lodash.isboolean/-/lodash.isboolean-3.0.3.tgz",
     1875      "integrity": "sha512-Bz5mupy2SVbPHURB98VAcw+aHh4vRV5IPNhILUCsOzRmsTmSQ17jIuqopAentWoehktxGd9e/hbIXq980/1QJg=="
     1876    },
     1877    "lodash.isinteger": {
     1878      "version": "4.0.4",
     1879      "resolved": "https://registry.npmjs.org/lodash.isinteger/-/lodash.isinteger-4.0.4.tgz",
     1880      "integrity": "sha512-DBwtEWN2caHQ9/imiNeEA5ys1JoRtRfY3d7V9wkqtbycnAmTvRRmbHKDV4a0EYc678/dia0jrte4tjYwVBaZUA=="
     1881    },
     1882    "lodash.isnumber": {
     1883      "version": "3.0.3",
     1884      "resolved": "https://registry.npmjs.org/lodash.isnumber/-/lodash.isnumber-3.0.3.tgz",
     1885      "integrity": "sha512-QYqzpfwO3/CWf3XP+Z+tkQsfaLL/EnUlXWVkIk5FUPc4sBdTehEqZONuyRt2P67PXAk+NXmTBcc97zw9t1FQrw=="
     1886    },
     1887    "lodash.isplainobject": {
     1888      "version": "4.0.6",
     1889      "resolved": "https://registry.npmjs.org/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz",
     1890      "integrity": "sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA=="
     1891    },
     1892    "lodash.isstring": {
     1893      "version": "4.0.1",
     1894      "resolved": "https://registry.npmjs.org/lodash.isstring/-/lodash.isstring-4.0.1.tgz",
     1895      "integrity": "sha512-0wJxfxH1wgO3GrbuP+dTTk7op+6L41QCXbGINEmD+ny/G/eCqGzxyCsh7159S+mgDDcoarnBw6PC1PS5+wUGgw=="
     1896    },
     1897    "lodash.once": {
     1898      "version": "4.1.1",
     1899      "resolved": "https://registry.npmjs.org/lodash.once/-/lodash.once-4.1.1.tgz",
     1900      "integrity": "sha512-Sb487aTOCr9drQVL8pIxOzVhafOjZN9UU54hiN8PU3uAiSV7lx1yYNpbNmex2PK6dSJoNTSJUUswT651yww3Mg=="
    17061901    },
    17071902    "media-typer": {
    … …  
    19872182      "version": "5.7.1",
    19882183      "resolved": "https://registry.npmjs.org/semver/-/semver-5.7.1.tgz",
    1989       "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==",
    1990       "dev": true
     2184      "integrity": "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
    19912185    },
    19922186    "send": {

  • backend/package.json

    r717ceae r16237c4  
    1515    "dotenv": "^16.0.1",
    1616    "express": "^4.18.1",
     17    "express-async-handler": "^1.2.0",
     18    "jsonwebtoken": "^8.5.1",
    1719    "mongoose": "^6.5.3"
    1820  },

  • backend/server.js

    r717ceae r16237c4  
    55import seedRouter from "./routes/seedRoutes.js";
    66import productRouter from "./routes/productRoutes.js";
     7import userRouter from "./routes/userRoutes.js";
     8import orderRouter from "./routes/orderRoutes.js";
    79
    810dotenv.config();
    … …  
    1820
    1921const app = express();
     22
     23app.use(express.json());
     24app.use(express.urlencoded({ extended: true }));
     25
    2026app.use("/api/seed", seedRouter);
    2127app.use("/api/products", productRouter);
     28app.use("/api/users", userRouter);
     29app.use("/api/orders", orderRouter);
     30
     31app.use((err, req, res, next) => {
     32  res.status(500).send({ message: err.message });
     33});
    2234
    2335const port = process.env.PORT || 5000;

  • frontend/package-lock.json

    r717ceae r16237c4  
    2828        "react-router-dom": "^6.3.0",
    2929        "react-scripts": "5.0.1",
     30        "react-toastify": "^9.0.8",
    3031        "web-vitals": "^2.1.4"
    3132      }
    … …  
    1465914660      }
    1466014661    },
     14662    "node_modules/react-toastify": {
     14663      "version": "9.0.8",
     14664      "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-9.0.8.tgz",
     14665      "integrity": "sha512-EwM+teWt49HSHx+67qI08yLAW1zAsBxCXLCsUfxHYv1W7/R3ZLhrqKalh7j+kjgPna1h5LQMSMwns4tB4ww2yQ==",
     14666      "dependencies": {
     14667        "clsx": "^1.1.1"
     14668      },
     14669      "peerDependencies": {
     14670        "react": ">=16",
     14671        "react-dom": ">=16"
     14672      }
     14673    },
    1466114674    "node_modules/react-transition-group": {
    1466214675      "version": "4.4.5",
    … …  
    2767327686      }
    2767427687    },
     27688    "react-toastify": {
     27689      "version": "9.0.8",
     27690      "resolved": "https://registry.npmjs.org/react-toastify/-/react-toastify-9.0.8.tgz",
     27691      "integrity": "sha512-EwM+teWt49HSHx+67qI08yLAW1zAsBxCXLCsUfxHYv1W7/R3ZLhrqKalh7j+kjgPna1h5LQMSMwns4tB4ww2yQ==",
     27692      "requires": {
     27693        "clsx": "^1.1.1"
     27694      }
     27695    },
    2767527696    "react-transition-group": {
    2767627697      "version": "4.4.5",

  • frontend/package.json

    r717ceae r16237c4  
    2424    "react-router-dom": "^6.3.0",
    2525    "react-scripts": "5.0.1",
     26    "react-toastify": "^9.0.8",
    2627    "web-vitals": "^2.1.4"
    2728  },

  • frontend/src/App.js

    r717ceae r16237c4  
    1111import CategoryScreen from "./screens/CategoryScreen";
    1212import SigninScreen from "./screens/SigninScreen";
     13import { ToastContainer } from "react-toastify";
     14import "react-toastify/dist/ReactToastify.css";
     15import ShippingAddressScreen from "./screens/ShippingAddressScreen";
     16import SignupScreen from "./screens/SignupScreen";
     17import PaymentMethodScreen from "./screens/PaymentMethodScreen";
     18import PlaceOrderScreen from "./screens/PlaceOrderScreen";
     19import OrderScreen from "./screens/OrderScreen";
     20import CardPaymentScreen from "./screens/CardPaymentScreen";
     21import OrderHistoryScreen from "./screens/OrderHistoryScreen";
    1322
    1423function App() {
    … …  
    1726  return (
    1827    <BrowserRouter>
     28      <ToastContainer position="bottom-center" limit={1} />
    1929      <Header />
    2030
    … …  
    2434        <Route path="/cart" element={<CartScreen />} />
    2535        <Route path="/signin" element={<SigninScreen />} />
     36        <Route path="/signup" element={<SignupScreen />} />
     37        <Route path="/shipping" element={<ShippingAddressScreen />} />
     38        <Route path="/payment" element={<PaymentMethodScreen />} />
     39        <Route path="/placeorder" element={<PlaceOrderScreen />} />
     40        <Route path="placeorder/payment" element={<CardPaymentScreen />} />
     41        <Route path="/orderhistory" element={<OrderHistoryScreen />} />
     42        <Route path="/order/:id" element={<OrderScreen />} />
    2643        <Route path="/products" element={<CategoryScreen />} />
    2744      </Routes>

  • frontend/src/Store.js

    r717ceae r16237c4  
    44
    55const initialState = {
     6  userInfo: localStorage.getItem("userInfo")
     7    ? JSON.parse(localStorage.getItem("userInfo"))
     8    : null,
    69  cart: {
     10    shippingAddress: localStorage.getItem("shippingAddress")
     11      ? JSON.parse(localStorage.getItem("shippingAddress"))
     12      : {},
     13    paymentMethod: localStorage.getItem("paymentMethod")
     14      ? localStorage.getItem("paymentMethod")
     15      : "",
    716    cartItems: localStorage.getItem("cartItems")
    817      ? JSON.parse(localStorage.getItem("cartItems"))
    … …  
    3241      return { ...state, cart: { ...state.cart, cartItems } };
    3342    }
     43    case "CART_CLEAR":
     44      return { ...state, cart: { ...state.cart, cartItems: [] } };
     45    case "USER_SIGNIN":
     46      return { ...state, userInfo: action.payload };
     47    case "USER_SIGNOUT":
     48      return {
     49        ...state,
     50        userInfo: null,
     51        cart: { cartItems: [], shippingAddress: {}, paymentMethod: "" },
     52      };
     53    case "SAVE_SHIPPING_ADDRESS":
     54      return {
     55        ...state,
     56        cart: { ...state.cart, shippingAddress: action.payload },
     57      };
     58    case "SAVE_PAYMENT_METHOD":
     59      return {
     60        ...state,
     61        cart: { ...state.cart, paymentMethod: action.payload },
     62      };
    3463    default:
    3564      return state;

  • frontend/src/components/Header.js

    r717ceae r16237c4  
    1616import ShoppingBasketIcon from "@mui/icons-material/ShoppingCart";
    1717import MenuIcon from "@mui/icons-material/Menu";
    18 import { Link } from "react-router-dom";
     18import { Link, NavLink, useNavigate } from "react-router-dom";
    1919import logo2 from "../Images/logo2.png";
    2020import Badge from "react-bootstrap/Badge";
    … …  
    2222import { Store } from "../Store";
    2323import { useContext } from "react";
     24import NavDropdown from "react-bootstrap/NavDropdown";
    2425
    2526const toggleMenu = (event) => {
     27  event.stopPropagation();
    2628  let menu = document.querySelector(".mobile-menu-container");
    2729  menu.classList.remove("hidden");
    … …  
    3032
    3133const toggleSubMenu = (event) => {
     34  event.stopPropagation();
    3235  let menu = document.querySelector(".subDropdown");
    3336  menu.classList.remove("hidden");
    … …  
    6871
    6972function Header() {
    70   const { state } = useContext(Store);
    71   const { cart } = state;
     73  const { state, dispatch: ctxDispatch } = useContext(Store);
     74  const { cart, userInfo } = state;
     75  const navigate = useNavigate();
     76
     77  const signoutHandler = () => {
     78    ctxDispatch({ type: "USER_SIGNOUT" });
     79    localStorage.removeItem("userInfo");
     80    localStorage.removeItem("shippingAddress");
     81    localStorage.removeItem("paymentMethod");
     82  };
     83
    7284  return (
    7385    <div className="header">
    … …  
    7890          onClick={toggleMenu}
    7991        />
    80         <img className="header__icon" src={logo2} alt="logo"></img>
     92        <img
     93          className="header__icon"
     94          src={logo2}
     95          alt="logo"
     96          onClick={() => {
     97            navigate("/");
     98          }}
     99        ></img>
    81100      </div>
    82101      <div className="mobile-menu-container hidden">
    … …  
    85104        </div>
    86105        <ul className="mobile-menu">
    87           <li>Почетна</li>
     106          <Link
     107            to="/"
     108            style={{ textDecoration: "none", color: "black" }}
     109            onClick={closeMenu}
     110          >
     111            <li>Почетна</li>
     112          </Link>
    88113          <li onClick={toggleSubMenu} className="subMenu">
    89114            Производи <ArrowDropDownIcon />
    … …  
    492517      <div className="header__right">
    493518        <div className="header__buttons">
    494           <span>
    495             <AccountCircleIcon className="header__login" fontSize="large" />
    496             <p>Најави се</p>
    497           </span>
     519          {userInfo ? (
     520            <NavDropdown
     521              title={
     522                <span>
     523                  <AccountCircleIcon
     524                    className="header__login"
     525                    fontSize="large"
     526                  />
     527                  <p>{userInfo.name}</p>
     528                </span>
     529              }
     530              id="basic-nav-dropdown"
     531            >
     532              <NavDropdown.Item
     533                onClick={() => {
     534                  navigate("/profile");
     535                }}
     536              >
     537                Профил
     538              </NavDropdown.Item>
     539
     540              <NavDropdown.Item
     541                onClick={() => {
     542                  navigate("/orderhistory");
     543                }}
     544              >
     545                Нарачки
     546              </NavDropdown.Item>
     547
     548              <NavDropdown.Divider />
     549              <Link
     550                className="drowdown-item"
     551                to="#signout"
     552                onClick={signoutHandler}
     553              >
     554                Одјави се
     555              </Link>
     556            </NavDropdown>
     557          ) : (
     558            <Link
     559              to={"/signin"}
     560              className="link"
     561              onClick={() => {
     562                navigate("/orderhistory");
     563              }}
     564            >
     565              <span>
     566                <AccountCircleIcon className="header__login" fontSize="large" />
     567                <p>Најави се</p>
     568              </span>
     569            </Link>
     570          )}
     571
    498572          <Link to="/cart" className="badgee">
    499573            <span>

  • frontend/src/index.css

    r717ceae r16237c4  
     1.checkout-steps > div {
     2  border-bottom: 0.2rem solid #a0a0a0;
     3  color: #a0a0a0;
     4}
     5
     6.checkout-steps > div.active {
     7  border-bottom: 0.2rem solid #f08000;
     8  color: #f08000;
     9}

  • frontend/src/screens/SigninScreen.js

    r717ceae r16237c4  
     1import Axios from "axios";
    12import Container from "react-bootstrap/Container";
    23import Form from "react-bootstrap/Form";
    … …  
    45import Button from "react-bootstrap/Button";
    56import "../styles/SigninScreen.css";
    6 import React from "react";
    7 import { Link, useLocation } from "react-router-dom";
     7import React, { useContext, useEffect, useState } from "react";
     8import { Link, useLocation, useNavigate } from "react-router-dom";
     9import { Store } from "../Store";
     10import { toast } from "react-toastify";
     11import { getError } from "../components/utils";
    812
    913function SigninScreen() {
     14  const navigate = useNavigate();
    1015  const { search } = useLocation();
    1116  const redirectInUrl = new URLSearchParams(search).get("redirect");
    1217  const redirect = redirectInUrl ? redirectInUrl : "/";
     18
     19  const [email, setEmail] = useState("");
     20  const [password, setPassword] = useState("");
     21
     22  const { state, dispatch: ctxDispatch } = useContext(Store);
     23  const { userInfo } = state;
     24
     25  const submitHandler = async (e) => {
     26    e.preventDefault();
     27    try {
     28      const { data } = await Axios.post("/api/users/signin", {
     29        email,
     30        password,
     31      });
     32      ctxDispatch({ type: "USER_SIGNIN", payload: data });
     33      localStorage.setItem("userInfo", JSON.stringify(data));
     34      navigate(redirect || "/");
     35    } catch (err) {
     36      toast.error(getError(err));
     37    }
     38  };
     39
     40  useEffect(() => {
     41    if (userInfo) {
     42      navigate(redirect);
     43    }
     44  }, [navigate, redirect, userInfo]);
     45
    1346  return (
    1447    <div className="pageContainer">
    … …  
    1851        </Helmet>
    1952        <h1>Најави се</h1>
    20         <Form className="formCointainer">
     53        <Form className="formCointainer" onSubmit={submitHandler}>
    2154          <Form.Group controlId="email">
    2255            <Form.Label>Email</Form.Label>
    23             <Form.Control type="email" required />
     56            <Form.Control
     57              type="email"
     58              required
     59              onChange={(e) => setEmail(e.target.value)}
     60            />
    2461          </Form.Group>
    2562          <Form.Group controlId="password">
    2663            <Form.Label>Лозинка</Form.Label>
    27             <Form.Control type="email" required />
     64            <Form.Control
     65              type="password"
     66              required
     67              onChange={(e) => setPassword(e.target.value)}
     68            />
    2869          </Form.Group>
    2970          <div className="submitBtnContainer">

  • frontend/src/styles/Header.css

    r717ceae r16237c4  
    66  margin: 0;
    77  padding: 0;
     8  margin-top: 10px;
    89  height: 70px;
    910  width: 100%;
    … …  
    200201}
    201202
     203#basic-nav-dropdown {
     204  display: flex;
     205  justify-content: center;
     206  align-items: center;
     207}
     208
    202209@media only screen and (max-width: 1015px) {
    203210  .header__dropdown {

  • frontend/src/styles/SigninScreen.css

    r717ceae r16237c4  
    1313.formCointainer {
    1414  width: 400px;
     15}
     16
     17.shipPC {
     18  display: flex;
     19  flex-direction: column;
     20  justify-content: center;
     21  align-items: center;
     22}
     23
     24.shipPC .checkout-steps {
     25  width: 70%;
    1526}
    1627
    … …  
    3243  }
    3344}
     45
     46@media only screen and (max-width: 559px) {
     47  .shipPC .checkout-steps {
     48    width: 100%;
     49  }
     50}
     51
     52@media only screen and (max-width: 331px) {
     53  .shipPC .checkout-steps {
     54    display: none;
     55  }
     56}
Note: See TracChangeset for help on using the changeset viewer.