-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Set up the route. Using default figma style for the tasklist page. * use bootstrap components * finish tasklist page v1 * Finished Navbar, customized buttons/link, added routes * updated index.css to include cust colours and changed Navbar to be reusable between o and c * changed Navbar border to support customer page * Update Navbar to support pages without title * unfinished store * clean up * matching package-clock configurations with the main branch --------- Co-authored-by: UBC Student <[email protected]> Co-authored-by: sl-81 <[email protected]>
- Loading branch information
3 people
authored
Mar 19, 2024
1 parent
2f164f2
commit 1c115af
Showing
9 changed files
with
706 additions
and
129 deletions.
There are no files selected for viewing
Large diffs are not rendered by default.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,52 @@ | ||
| import type { FC } from 'react'; | ||
| import '../styles/tasklist.css'; | ||
| import { Button, Stack } from 'react-bootstrap'; | ||
| import { useDispatch } from 'react-redux'; | ||
| import { setIsLoggedInFalse } from '../redux/user'; | ||
| import {Props} from '../App.tsx' | ||
|
|
||
|
|
||
| export const Tasklist: FC<Props> = (function Screen() { | ||
|
|
||
| const dispatch = useDispatch(); | ||
|
|
||
| const handleLogout = () => { | ||
| dispatch(setIsLoggedInFalse("")); | ||
| }; | ||
|
|
||
| return ( | ||
| <div className='background'> | ||
| <Stack gap={3} className='tasklist'> | ||
| <div className="text-fff-48px-OpenSans manageInventory">Manage Inventory</div> | ||
| <div className="viewUpdateInventory"> | ||
| <Button className='button-d9c4e3-24px-OpenSans' type="button" aria-pressed="true" > | ||
| <a href='./'>View/Update Inventory</a> | ||
| </Button> | ||
| </div> | ||
| <div className="getShoppingList"> | ||
| <Button className='button-d9c4e3-24px-OpenSans' type="button" aria-pressed="true"> | ||
| <a href='./'>Get Shopping List</a> | ||
| </Button> | ||
| </div> | ||
| <div className="text-fff-48px-OpenSans finance">Finance</div> | ||
| <div className="transactionHistory"> | ||
| <Button className='button-d9c4e3-24px-OpenSans' type="button" aria-pressed="true"> | ||
| <a href='./'>Transaction History</a> | ||
| </Button> | ||
| </div> | ||
| <div className="reimbursementRequest"> | ||
| <Button className='button-d9c4e3-24px-OpenSans' type="button" aria-pressed="true"> | ||
| <a href='./'>Reimbursement Request</a> | ||
| </Button> | ||
| </div> | ||
| <div className="logout"> | ||
| <Button className='button-d9c4e3-24px-OpenSans' type="button" aria-pressed="true" onClick={handleLogout}> | ||
| <a href='./'>Logout</a> | ||
| </Button> | ||
| </div> | ||
| </Stack> | ||
| </div> | ||
| ); | ||
| }); | ||
|
|
||
| export default Tasklist; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,10 +1,11 @@ | ||
| import React from "react"; | ||
| import ReactDOM from "react-dom/client"; | ||
| import App from "./App.tsx"; | ||
| import "./index.css"; | ||
| import React from 'react' | ||
| import ReactDOM from 'react-dom/client' | ||
| import App from './App.tsx' | ||
| import './index.css' | ||
|
|
||
|
|
||
| ReactDOM.createRoot(document.getElementById("root")!).render( | ||
| <React.StrictMode> | ||
| <App /> | ||
| </React.StrictMode> | ||
| ); | ||
| <App /> | ||
| </React.StrictMode>, | ||
| ) |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| import { createSlice } from "@reduxjs/toolkit" | ||
|
|
||
| export type UserType = { | ||
| user: string | null, | ||
| isLoggedIn: boolean; | ||
| isLoggedInKey: string; | ||
| } | ||
|
|
||
| const initialState : UserType = { | ||
| user: localStorage.getItem('user'), | ||
| //TODO: isLoggedIn: 'user' in localStorage, | ||
| isLoggedIn: true, | ||
| isLoggedInKey: "isLoggedIn" | ||
| } | ||
|
|
||
|
|
||
| const userSlice = createSlice({ | ||
| name: "user", | ||
| initialState, | ||
| reducers: { | ||
| setIsLoggedInTrue (state, action) { | ||
| action.payload; | ||
| state.isLoggedIn = true; | ||
| //TODO: localStorage.setItem("user.isLoggedIn", 'true'); | ||
| }, | ||
|
|
||
| setIsLoggedInFalse (state, action) { | ||
| action.payload; | ||
| state.isLoggedIn = false; | ||
| //TODO: localStorage.setItem("user.isLoggedIn", 'false'); | ||
| } | ||
| } | ||
| }); | ||
|
|
||
| export const {setIsLoggedInTrue, setIsLoggedInFalse} = userSlice.actions; | ||
|
|
||
| export default userSlice.reducer; | ||
|
|
Oops, something went wrong.