This repository has been archived by the owner on Nov 14, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 4
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Ported the auth moduel to use Redux and TypeScript. - Other related changes. The exact way we set up our store, ducks and related state will probably change in future work, so not putting too much effort in it for now. Using redux-saga for side-effect handling. The long-running goal is to get rid of Babel and port everything to using TypeScript. Also replace class components with functional components using hooks. Related to #33
- Loading branch information
Showing
48 changed files
with
763 additions
and
463 deletions.
There are no files selected for viewing
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
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
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,143 +1,120 @@ | ||
| import { connect } from "nuclear-js-react-addons-chefsplate" | ||
| import React from "react" | ||
| import { MenuItem, Nav as RefNav, Navbar, NavItem } from "react-bootstrap" | ||
| import { useSelector } from "react-redux" | ||
| import { Link } from "react-router-dom" | ||
| import { authdata, isLoggedIn, userDetails } from "../modules/auth/getters" | ||
| import { getAuthState } from "../modules/auth/selectors" | ||
| import NavDropdown from "./NavDropdown" | ||
| import NavLink from "./NavLink" | ||
|
|
||
| interface BareNavProps { | ||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| authdata: any // TODO | ||
| isLoggedIn: boolean | ||
| // eslint-disable-next-line @typescript-eslint/no-explicit-any | ||
| userDetails: any // TODO | ||
| } | ||
|
|
||
| class BareNav extends React.Component<BareNavProps> { | ||
| renderProfileMenu() { | ||
| if (this.props.authdata.get("isLoading")) { | ||
| return ( | ||
| <RefNav pullRight> | ||
| <NavItem className="navbar-text">Loading data ..</NavItem> | ||
| </RefNav> | ||
| ) | ||
| } else if (this.props.authdata.get("error")) { | ||
| return ( | ||
| <RefNav pullRight> | ||
| <NavItem className="navbar-text"> | ||
| Error: {this.props.authdata.get("error")} | ||
| </NavItem> | ||
| </RefNav> | ||
| ) | ||
| } else if (this.props.isLoggedIn) { | ||
| return ( | ||
| <RefNav pullRight> | ||
| <NavDropdown | ||
| title={this.props.userDetails.realname} | ||
| id="nav-auth-dropdown" | ||
| > | ||
| <NavLink to="/profile">Profile</NavLink> | ||
| <NavLink to="/logout">Log out</NavLink> | ||
| </NavDropdown> | ||
| </RefNav> | ||
| ) | ||
| } else { | ||
| return ( | ||
| <RefNav pullRight> | ||
| <NavLink to="/login">Log in with UiO-account</NavLink> | ||
| </RefNav> | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| render() { | ||
| const profileMenu = this.renderProfileMenu() | ||
| const ProfileMenu = () => { | ||
| const authState = useSelector(getAuthState) | ||
|
|
||
| if (authState.isLoading) { | ||
| return ( | ||
| <RefNav pullRight> | ||
| <NavItem className="navbar-text">Loading data ..</NavItem> | ||
| </RefNav> | ||
| ) | ||
| } else if (authState.error) { | ||
| return ( | ||
| <RefNav pullRight> | ||
| <NavItem className="navbar-text">Error: {authState.error}</NavItem> | ||
| </RefNav> | ||
| ) | ||
| } else if (authState.data?.loggedIn) { | ||
| return ( | ||
| <Navbar fixedTop inverse> | ||
| <Navbar.Header> | ||
| <Navbar.Brand> | ||
| <Link to="/">CYB internsystem</Link> | ||
| </Navbar.Brand> | ||
| <Navbar.Toggle /> | ||
| </Navbar.Header> | ||
| <Navbar.Collapse> | ||
| <RefNav> | ||
| <NavDropdown title="Products" id="nav-products-dropdown"> | ||
| <NavLink to="/varer/accounts">Account list</NavLink> | ||
| <NavLink to="/varer/inventorycounts">Inventory counts</NavLink> | ||
| <NavLink to="/varer/inventory">Inventory items</NavLink> | ||
| <NavLink to="/varer/salesestimates">Sales estimates</NavLink> | ||
| <NavLink to="/varer/products">Sales products</NavLink> | ||
| <NavLink to="/varer/vendors">Vendor list</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Z" id="nav-z-dropdown"> | ||
| <NavLink to="/z">Overview</NavLink> | ||
| <MenuItem divider /> | ||
| <MenuItem header>Modules</MenuItem> | ||
| <NavLink to="/z/stats">Statistics</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Vouchers" id="nav-voucher-dropdown"> | ||
| <NavLink to="/voucher/stats">Overview</NavLink> | ||
| <NavLink to="/voucher/use">Use vouchers</NavLink> | ||
| <NavLink to="/voucher/uselogs">Logs of usage</NavLink> | ||
| <NavLink to="/voucher/worklogs">Register work / logs</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Member" id="nav-member-dropdown"> | ||
| <NavLink to="/member">Overview</NavLink> | ||
| <NavLink to="/member/add">Add member</NavLink> | ||
| <NavLink to="/member/list">Member List</NavLink> | ||
| <NavLink to="/member/search">Search</NavLink> | ||
| <NavLink to="/member/lifetime">Lifetime</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Garm" id="nav-intern-dropdown"> | ||
| <NavLink to="/intern">Overview</NavLink> | ||
| <MenuItem divider /> | ||
| <NavLink to="/intern/levels">Access Levels</NavLink> | ||
| <NavLink to="/intern/groups">Groups</NavLink> | ||
| <NavLink to="/intern/interns">Interns</NavLink> | ||
| <NavLink to="/intern/roles">Roles</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Other" id="nav-other-dropdown"> | ||
| <NavItem | ||
| target="_self" | ||
| href="http://heim.ifi.uio.no/cyb/tilganger/" | ||
| > | ||
| Access control management (Garm) | ||
| </NavItem> | ||
| <NavItem target="_self" href="admin/"> | ||
| Admin Panel | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://jira.cyb.no/"> | ||
| JIRA (task management) | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://confluence.cyb.no/"> | ||
| Wiki (Confluence) | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://github.com/cybernetisk/"> | ||
| GitHub-organization | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://cybernetisk.slack.com/"> | ||
| Slack | ||
| </NavItem> | ||
| <NavItem | ||
| target="_self" | ||
| href="https://www.facebook.com/groups/CYB.intern/" | ||
| > | ||
| Facebook group: CYB Intern | ||
| </NavItem> | ||
| </NavDropdown> | ||
| </RefNav> | ||
| {profileMenu} | ||
| </Navbar.Collapse> | ||
| </Navbar> | ||
| <RefNav pullRight> | ||
| <NavDropdown | ||
| title={authState.data.details.realname} | ||
| id="nav-auth-dropdown" | ||
| > | ||
| <NavLink to="/profile">Profile</NavLink> | ||
| <NavLink to="/logout">Log out</NavLink> | ||
| </NavDropdown> | ||
| </RefNav> | ||
| ) | ||
| } else { | ||
| return ( | ||
| <RefNav pullRight> | ||
| <NavLink to="/login">Log in with UiO-account</NavLink> | ||
| </RefNav> | ||
| ) | ||
| } | ||
| } | ||
|
|
||
| export default connect(() => ({ | ||
| authdata, | ||
| userDetails, | ||
| isLoggedIn, | ||
| }))(BareNav) | ||
| export const Nav = () => ( | ||
| <Navbar fixedTop inverse> | ||
| <Navbar.Header> | ||
| <Navbar.Brand> | ||
| <Link to="/">CYB internsystem</Link> | ||
| </Navbar.Brand> | ||
| <Navbar.Toggle /> | ||
| </Navbar.Header> | ||
| <Navbar.Collapse> | ||
| <RefNav> | ||
| <NavDropdown title="Products" id="nav-products-dropdown"> | ||
| <NavLink to="/varer/accounts">Account list</NavLink> | ||
| <NavLink to="/varer/inventorycounts">Inventory counts</NavLink> | ||
| <NavLink to="/varer/inventory">Inventory items</NavLink> | ||
| <NavLink to="/varer/salesestimates">Sales estimates</NavLink> | ||
| <NavLink to="/varer/products">Sales products</NavLink> | ||
| <NavLink to="/varer/vendors">Vendor list</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Z" id="nav-z-dropdown"> | ||
| <NavLink to="/z">Overview</NavLink> | ||
| <MenuItem divider /> | ||
| <MenuItem header>Modules</MenuItem> | ||
| <NavLink to="/z/stats">Statistics</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Vouchers" id="nav-voucher-dropdown"> | ||
| <NavLink to="/voucher/stats">Overview</NavLink> | ||
| <NavLink to="/voucher/use">Use vouchers</NavLink> | ||
| <NavLink to="/voucher/uselogs">Logs of usage</NavLink> | ||
| <NavLink to="/voucher/worklogs">Register work / logs</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Member" id="nav-member-dropdown"> | ||
| <NavLink to="/member">Overview</NavLink> | ||
| <NavLink to="/member/add">Add member</NavLink> | ||
| <NavLink to="/member/list">Member List</NavLink> | ||
| <NavLink to="/member/search">Search</NavLink> | ||
| <NavLink to="/member/lifetime">Lifetime</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Garm" id="nav-intern-dropdown"> | ||
| <NavLink to="/intern">Overview</NavLink> | ||
| <MenuItem divider /> | ||
| <NavLink to="/intern/levels">Access Levels</NavLink> | ||
| <NavLink to="/intern/groups">Groups</NavLink> | ||
| <NavLink to="/intern/interns">Interns</NavLink> | ||
| <NavLink to="/intern/roles">Roles</NavLink> | ||
| </NavDropdown> | ||
| <NavDropdown title="Other" id="nav-other-dropdown"> | ||
| <NavItem target="_self" href="http://heim.ifi.uio.no/cyb/tilganger/"> | ||
| Access control management (Garm) | ||
| </NavItem> | ||
| <NavItem target="_self" href="admin/"> | ||
| Admin Panel | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://jira.cyb.no/"> | ||
| JIRA (task management) | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://confluence.cyb.no/"> | ||
| Wiki (Confluence) | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://github.com/cybernetisk/"> | ||
| GitHub-organization | ||
| </NavItem> | ||
| <NavItem target="_self" href="https://cybernetisk.slack.com/"> | ||
| Slack | ||
| </NavItem> | ||
| <NavItem | ||
| target="_self" | ||
| href="https://www.facebook.com/groups/CYB.intern/" | ||
| > | ||
| Facebook group: CYB Intern | ||
| </NavItem> | ||
| </NavDropdown> | ||
| </RefNav> | ||
| <ProfileMenu /> | ||
| </Navbar.Collapse> | ||
| </Navbar> | ||
| ) |
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,17 +1,24 @@ | ||
| import { Provider } from "nuclear-js-react-addons-chefsplate" | ||
| import { ConnectedRouter } from "connected-react-router" | ||
| import { Provider as NuclearProvider } from "nuclear-js-react-addons-chefsplate" | ||
| import React from "react" | ||
| import { Provider } from "react-redux" | ||
| import reactor from "../reactor" | ||
| import Nav from "./Nav" | ||
| import { history, store } from "../store" | ||
| import { Nav } from "./Nav" | ||
|
|
||
| export default class Root extends React.Component { | ||
| render() { | ||
| return ( | ||
| <Provider reactor={reactor}> | ||
| <div> | ||
| <Nav /> | ||
| <div className="container">{this.props.children}</div> | ||
| </div> | ||
| </Provider> | ||
| <NuclearProvider reactor={reactor}> | ||
| <Provider store={store}> | ||
| <ConnectedRouter history={history}> | ||
| <div> | ||
| <Nav /> | ||
| <div className="container">{this.props.children}</div> | ||
| </div> | ||
| </ConnectedRouter> | ||
| </Provider> | ||
| </NuclearProvider> | ||
| ) | ||
| } | ||
| } |
Empty file.
This file was deleted.
Oops, something went wrong.
Oops, something went wrong.