From 1139da4da7f1bb0ee4a66d420e690beed36832c2 Mon Sep 17 00:00:00 2001 From: Vidhu Kant Sharma Date: Sun, 4 Dec 2022 21:37:52 +0530 Subject: added notification system --- src/views/homepage.js | 15 ++++++++++++++- src/views/login/register.js | 17 ++++++++++++++--- src/views/manage/brands.js | 12 ++++++++++-- src/views/manage/clients.js | 10 +++++++++- src/views/manage/items.js | 12 ++++++++++-- 5 files changed, 57 insertions(+), 9 deletions(-) (limited to 'src/views') diff --git a/src/views/homepage.js b/src/views/homepage.js index a9cdb50..92f9544 100644 --- a/src/views/homepage.js +++ b/src/views/homepage.js @@ -15,9 +15,22 @@ * along with this program. If not, see . */ -import { Link } from 'react-router-dom'; +import { Link, useNavigate } from 'react-router-dom'; +import { notificationConfig } from "../classes/notifications"; +import { Store } from "react-notifications-component"; const HomePage = () => { + // this is temporary, just for testing + // TODO: find better way to do this + const navigate = useNavigate(); + if (!localStorage.getItem("accessToken")) { + Store.addNotification({ + title: "You are not logged in", + message: "You need to log in before accessing this page.", + ...notificationConfig("default") + }); + navigate("/login") + } return ( <>

Welcome to OpenBills

diff --git a/src/views/login/register.js b/src/views/login/register.js index c747f59..1b1755b 100644 --- a/src/views/login/register.js +++ b/src/views/login/register.js @@ -17,12 +17,15 @@ import './scss/login.scss'; import { User, validateEmail, validateUsername, validatePassword, saveUser } from '../../classes/user'; +import { notificationConfig } from "./../../classes/notifications"; +import { Store } from "react-notifications-component"; import { Link } from 'react-router-dom'; import { useState } from 'react'; import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import { faEye } from '@fortawesome/free-solid-svg-icons' + const RegisterPage = () => { const [user, setUser] = useState(new User()); const [showPassword, setShowPassword] = useState(false); @@ -41,11 +44,19 @@ const RegisterPage = () => { } const handleSuccess = () => { - alert("yay") + Store.addNotification({ + title: "Created new account", + message: `Welcome to OpenBills, ${user.UserName}!`, + ...notificationConfig("default") + }); } - const handleError = () => { - alert("fail") + const handleError = err => { + Store.addNotification({ + title: "An error occoured", + message: `Failed to create new account. ${err.message}`, + ...notificationConfig("danger") + }); } return ( diff --git a/src/views/manage/brands.js b/src/views/manage/brands.js index dad21e2..4ab3924 100644 --- a/src/views/manage/brands.js +++ b/src/views/manage/brands.js @@ -16,18 +16,26 @@ */ import { useState, useEffect } from 'react'; +import { Store } from "react-notifications-component"; import './scss/management-page.scss' import { Brand, getAllBrands } from '../../classes/brand'; import BrandEditor from './../../components/editors/brand-editor'; import BrandTable from './../../components/tables/brand-table'; +import { notificationConfig } from "./../../classes/notifications"; const ManageBrandsPage = () => { const [brandToEdit, setBrandToEdit] = useState(new Brand()); const [allBrands, setAllBrands] = useState([]); - // TODO: handle error + const updateList = () => - getAllBrands(setAllBrands, () => {}); + getAllBrands(setAllBrands, err => { + Store.addNotification({ + title: "Error while getting Brands list.", + message: err.message, + ...notificationConfig("danger") + }); + }); useEffect(() => { updateList(); diff --git a/src/views/manage/clients.js b/src/views/manage/clients.js index 8445d80..89e5ade 100644 --- a/src/views/manage/clients.js +++ b/src/views/manage/clients.js @@ -20,18 +20,26 @@ */ import { useState, useEffect } from 'react'; +import { Store } from "react-notifications-component"; import './scss/management-page.scss'; import { Client, getAllClients } from '../../classes/client'; import ClientEditor from './../../components/editors/client-editor'; import ClientTable from './../../components/tables/client-table'; +import { notificationConfig } from "./../../classes/notifications"; const ManageClientsPage = () => { const [clientToEdit, setClientToEdit] = useState(new Client()); const [allClients, setAllClients] = useState([]); // TODO: handle error const updateList = () => - getAllClients(setAllClients, () => {}); + getAllClients(setAllClients, err => { + Store.addNotification({ + title: "Error while getting Clients list.", + message: err.message, + ...notificationConfig("danger") + }); + }); useEffect(() => { updateList(); diff --git a/src/views/manage/items.js b/src/views/manage/items.js index 567be7c..2a862bc 100644 --- a/src/views/manage/items.js +++ b/src/views/manage/items.js @@ -20,18 +20,26 @@ */ import { useState, useEffect } from 'react'; +import { Store } from "react-notifications-component"; import './scss/management-page.scss' import { Item, getAllItems } from '../../classes/item'; import ItemEditor from './../../components/editors/item-editor'; import ItemTable from './../../components/tables/item-table'; +import { notificationConfig } from "./../../classes/notifications"; const ManageItemsPage = () => { const [itemToEdit, setItemToEdit] = useState(new Item()); const [allItems, setAllItems] = useState([]); - // TODO: handle error + const updateList = () => - getAllItems(setAllItems, () => {}); + getAllItems(setAllItems, err => { + Store.addNotification({ + title: "Error while getting Items list.", + message: err.message, + ...notificationConfig("danger") + }); + }); useEffect(() => { updateList(); -- cgit v1.2.3