Refactored
This commit is contained in:
parent
9da1dfd51f
commit
124170492c
31
src/App.tsx
31
src/App.tsx
@ -5,6 +5,8 @@ import "./App.scss";
|
||||
import Schedule from "./components/Calendar/";
|
||||
import { appointments } from "./components/Calendar/appointments";
|
||||
import RightBar from "./components/RightBar";
|
||||
import BusinessLogicContext from "./businesslogic/BusinessLogicContext";
|
||||
import { BuisnessProvided } from "./businesslogic/BusinessLogicProvider";
|
||||
|
||||
function App() {
|
||||
const [isOpenTransfer, setOpenTransfer] = useState(false);
|
||||
@ -53,17 +55,24 @@ function App() {
|
||||
|
||||
return (
|
||||
<div className="App">
|
||||
<TopBar
|
||||
textChangeHandler={(e) => {
|
||||
setText(e.target.value);
|
||||
}}
|
||||
handleTransfer={(e) => {
|
||||
setOpenTransfer(!isOpenTransfer);
|
||||
}}
|
||||
onLangChange={(e) => {
|
||||
console.log(e);
|
||||
}}
|
||||
/>
|
||||
<BusinessLogicContext.Consumer>
|
||||
{(context) => (
|
||||
<TopBar
|
||||
textChangeHandler={(e) => {
|
||||
setText(e.target.value);
|
||||
}}
|
||||
handleTransfer={(e) => {
|
||||
setOpenTransfer(!isOpenTransfer);
|
||||
}}
|
||||
onLangChange={(e) => {
|
||||
console.log(e);
|
||||
}}
|
||||
handleLogout={() => {
|
||||
(context as BuisnessProvided).reducers.userlogout();
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</BusinessLogicContext.Consumer>
|
||||
<Transfer
|
||||
isOpen={isOpenTransfer}
|
||||
handleClose={(e) => {
|
||||
|
@ -4,7 +4,9 @@ import { User } from "./models/user";
|
||||
|
||||
export interface BuisnessProvided {
|
||||
states: BusinessState;
|
||||
reducers: () => void;
|
||||
reducers: {
|
||||
userlogout: () => void;
|
||||
};
|
||||
}
|
||||
|
||||
interface BusinessState {
|
||||
@ -42,11 +44,15 @@ class BusinessLogicProvider extends Component<Props, BusinessState> {
|
||||
}
|
||||
|
||||
redirectToCASLogoutService() {
|
||||
window.location.replace(`https://cas.amu.edu.pl/cas/logout?service=${window.origin}`);
|
||||
window.location.replace(
|
||||
`https://cas.amu.edu.pl/cas/logout?service=${window.origin}`
|
||||
);
|
||||
}
|
||||
|
||||
redirectToCASLoginService() {
|
||||
window.location.replace(`https://cas.amu.edu.pl/cas/login?service=${window.origin}&locale=pl`);
|
||||
window.location.replace(
|
||||
`https://cas.amu.edu.pl/cas/login?service=${window.origin}&locale=pl`
|
||||
);
|
||||
}
|
||||
|
||||
render() {
|
||||
@ -54,8 +60,10 @@ class BusinessLogicProvider extends Component<Props, BusinessState> {
|
||||
<BusinessLogicContext.Provider
|
||||
value={{
|
||||
states: this.state,
|
||||
reducers: () => {
|
||||
this.logout();
|
||||
reducers: {
|
||||
userlogout: () => {
|
||||
this.logout();
|
||||
},
|
||||
},
|
||||
}}
|
||||
>
|
||||
|
@ -21,14 +21,15 @@ export default class RightBar extends React.Component<
|
||||
<div className="right-bar">
|
||||
<BusinessLogicContext.Consumer>
|
||||
{(context) => (
|
||||
<h1>
|
||||
<p>
|
||||
{JSON.stringify(
|
||||
(context as BuisnessProvided).states.user
|
||||
?.ticket
|
||||
)}
|
||||
</h1>
|
||||
</p>
|
||||
)}
|
||||
</BusinessLogicContext.Consumer>
|
||||
<p>Semestr zimowy 2020/2021</p>
|
||||
{this.props.lectures.map((classgroup, index) => (
|
||||
<Class
|
||||
onClassHover={this.props.onClassHover}
|
||||
|
@ -1,16 +1,16 @@
|
||||
import { Menu, MenuItem } from "@material-ui/core";
|
||||
import React, { FC } from "react";
|
||||
import BusinessLogicContext from "../../businesslogic/BusinessLogicContext";
|
||||
import { BuisnessProvided } from "../../businesslogic/BusinessLogicProvider";
|
||||
|
||||
interface ProfileProps {
|
||||
anchorEl: HTMLElement | null;
|
||||
handleClose: () => void;
|
||||
handleLogout: () => void;
|
||||
}
|
||||
|
||||
export const Profile: FC<ProfileProps> = ({
|
||||
anchorEl,
|
||||
handleClose,
|
||||
handleLogout,
|
||||
...restProps
|
||||
}) => {
|
||||
return (
|
||||
@ -24,17 +24,13 @@ export const Profile: FC<ProfileProps> = ({
|
||||
>
|
||||
<MenuItem>Profile</MenuItem>
|
||||
<MenuItem>My account</MenuItem>
|
||||
<BusinessLogicContext.Consumer>
|
||||
{(context) => (
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
(context as BuisnessProvided).reducers();
|
||||
}}
|
||||
>
|
||||
Logout
|
||||
</MenuItem>
|
||||
)}
|
||||
</BusinessLogicContext.Consumer>
|
||||
<MenuItem
|
||||
onClick={() => {
|
||||
handleLogout();
|
||||
}}
|
||||
>
|
||||
Logout
|
||||
</MenuItem>
|
||||
</Menu>
|
||||
);
|
||||
};
|
||||
|
@ -12,7 +12,10 @@ import { Profile } from "./Profile";
|
||||
interface TopBarProps {
|
||||
handleTransfer: (e: React.MouseEvent) => void;
|
||||
onLangChange: (lang: boolean) => void;
|
||||
textChangeHandler: (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void;
|
||||
handleLogout: () => void;
|
||||
textChangeHandler: (
|
||||
e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>
|
||||
) => void;
|
||||
}
|
||||
|
||||
interface TopBarState {
|
||||
@ -64,29 +67,55 @@ export default class TopBar extends React.Component<TopBarProps, TopBarState> {
|
||||
return (
|
||||
<div className="top-bar">
|
||||
<div className="top-bar__logo">
|
||||
<img className="top-bar__logo-image" alt="logo" src="https://plannaplan.pl/img/logo.svg" />
|
||||
<img
|
||||
className="top-bar__logo-image"
|
||||
alt="logo"
|
||||
src="https://plannaplan.pl/img/logo.svg"
|
||||
/>
|
||||
<div className="top-bar__tekst"> plan na plan </div>
|
||||
</div>
|
||||
<div className="top-bar__input-div">
|
||||
<img className="top-bar__input-icon" alt="search" src={Search} />
|
||||
<img
|
||||
className="top-bar__input-icon"
|
||||
alt="search"
|
||||
src={Search}
|
||||
/>
|
||||
<Input
|
||||
placeholder="Wyszukaj..."
|
||||
inputProps={{ "aria-label": "description" }}
|
||||
className="top-bar__input-field"
|
||||
onChange={(e) => this.handleChange(e)}
|
||||
/>
|
||||
<img className="top-bar__input-icon" alt="close" src={CloseIcon} />
|
||||
<img
|
||||
className="top-bar__input-icon"
|
||||
alt="close"
|
||||
src={CloseIcon}
|
||||
/>
|
||||
</div>
|
||||
<div className="top-bar__icon-box">
|
||||
<img className="top-bar__icon" alt="transfer" src={Transfer} onClick={this.handleTransfer} />
|
||||
<img
|
||||
className="top-bar__icon"
|
||||
alt="transfer"
|
||||
src={Transfer}
|
||||
onClick={this.handleTransfer}
|
||||
/>
|
||||
<img
|
||||
className="top-bar__icon"
|
||||
alt="change_language"
|
||||
src={this.state.isPolish ? UK : PL}
|
||||
onClick={this.onLangChange}
|
||||
/>
|
||||
<img className="top-bar__icon" alt="profile" src={User} onClick={this.handleProfile} />
|
||||
<Profile anchorEl={this.state.anchorEl} handleClose={this.handleClose} />
|
||||
<img
|
||||
className="top-bar__icon"
|
||||
alt="profile"
|
||||
src={User}
|
||||
onClick={this.handleProfile}
|
||||
/>
|
||||
<Profile
|
||||
anchorEl={this.state.anchorEl}
|
||||
handleClose={this.handleClose}
|
||||
handleLogout={this.props.handleLogout}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
Loading…
Reference in New Issue
Block a user