Skip to content
Snippets Groups Projects
Commit ea315d57 authored by vgm18's avatar vgm18
Browse files

Fixed buttons reportar, seguir, compartilhar, guardar and entrar (in comments...

Fixed buttons reportar, seguir, compartilhar, guardar and entrar (in comments section) when not logged in, now they will call handleLogin & fixed button for Esqueceu a senha, now he will redirect properly
parent bd41681d
Branches
Tags
3 merge requests!57Merge of develop into master,!56Fixed buttons reportar, seguir, compartilhar, guardar and entrar (in comments...,!43Fixed buttons reportar, seguir, compartilhar, guardar and entrar (in comments...
...@@ -60,7 +60,7 @@ export function NoIcon (props) { ...@@ -60,7 +60,7 @@ export function NoIcon (props) {
) )
} }
const NoIconButton = styled(Button)` export const NoIconButton = styled(Button)`
.MuiButton-label { .MuiButton-label {
color : #00bcd4 !important; color : #00bcd4 !important;
} }
......
...@@ -16,7 +16,8 @@ GNU Affero General Public License for more details. ...@@ -16,7 +16,8 @@ GNU Affero General Public License for more details.
You should have received a copy of the GNU Affero General Public License You should have received a copy of the GNU Affero General Public License
along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/ along with Plataforma Integrada MEC. If not, see <http://www.gnu.org/licenses/>.*/
import React, {useState} from 'react'; import React, {useContext, useState} from 'react';
import {Store} from '../Store'
import styled from 'styled-components' import styled from 'styled-components'
import Button from '@material-ui/core/Button'; import Button from '@material-ui/core/Button';
import Menu from '@material-ui/core/Menu'; import Menu from '@material-ui/core/Menu';
...@@ -29,10 +30,37 @@ import PersonAddIcon from '@material-ui/icons/PersonAdd'; ...@@ -29,10 +30,37 @@ import PersonAddIcon from '@material-ui/icons/PersonAdd';
import {putRequest} from './HelperFunctions/getAxiosConfig' import {putRequest} from './HelperFunctions/getAxiosConfig'
import ReportModal from './ReportModal.js' import ReportModal from './ReportModal.js'
import {Link} from 'react-router-dom' import {Link} from 'react-router-dom'
import LoginModal from './LoginModal.js'
import Snackbar from '@material-ui/core/Snackbar';
import SignUpModal from './SignUpModal'
import MuiAlert from '@material-ui/lab/Alert';
function Alert(props) {
return <MuiAlert elevation={6} variant="filled" {...props} />;
}
export default function SimpleMenu(props) { export default function SimpleMenu(props) {
// const {state} = useContext(Store) const {state} = useContext(Store)
const [anchorEl, setAnchorEl] = React.useState(null); const [anchorEl, setAnchorEl] = React.useState(null);
const [loginOpen, setLogin] = useState(false)
const [successfulLoginOpen, handleSuccessfulLogin] = useState(false)
const [signUpOpen, setSignUp] = useState(false)
const handleSignUp = () => {
setSignUp(!signUpOpen)
}
const handleLogin = () => {
setLogin(!loginOpen)
}
const toggleSnackbar = (event, reason) => {
if (reason === 'clickaway') {
return;
}
handleSuccessfulLogin(false);
}
function handleClick(event) { function handleClick(event) {
setAnchorEl(event.currentTarget); setAnchorEl(event.currentTarget);
...@@ -58,6 +86,18 @@ export default function SimpleMenu(props) { ...@@ -58,6 +86,18 @@ export default function SimpleMenu(props) {
} }
return ( return (
<React.Fragment>
<Snackbar open={successfulLoginOpen} autoHideDuration={1000} onClose={toggleSnackbar}
anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
>
<Alert severity="success" style={{ backgroundColor: "#00acc1" }}>Você está conectado(a)!</Alert>
</Snackbar>
{/*-------------------------------MODALS---------------------------------------*/}
<LoginModal open={loginOpen} handleClose={() => setLogin(false)} openSignUp={handleSignUp}
openSnackbar={() => { handleSuccessfulLogin(true) }}
/>
<SignUpModal open={signUpOpen} handleClose={handleSignUp} openLogin={handleLogin} />
{/*----------------------------------------------------------------------------*/}
<> <>
{ {
reportModal && reportModal &&
...@@ -92,19 +132,37 @@ export default function SimpleMenu(props) { ...@@ -92,19 +132,37 @@ export default function SimpleMenu(props) {
) )
: :
( (
state.currentUser.id !== '' ? (
<StyledMenuItem onClick={() => {handleFollow(props.followableID)}}> <StyledMenuItem onClick={() => {handleFollow(props.followableID)}}>
<ListItemIcon><PersonAddIcon /></ListItemIcon>Seguir <ListItemIcon><PersonAddIcon /></ListItemIcon>Seguir
</StyledMenuItem> </StyledMenuItem>
) )
:
(
<StyledMenuItem onClick={() => {handleLogin(props.followableID)}}>
<ListItemIcon><PersonAddIcon /></ListItemIcon>Seguir
</StyledMenuItem>
)
)
} }
{
state.currentUser.id !== '' ? (
<StyledMenuItem onClick={() => {handleModal(true); handleClose()}}> <StyledMenuItem onClick={() => {handleModal(true); handleClose()}}>
<ListItemIcon><ReportIcon /></ListItemIcon>Reportar <ListItemIcon><ReportIcon /></ListItemIcon>Reportar
</StyledMenuItem> </StyledMenuItem>
)
:
(
<StyledMenuItem onClick={() => {handleLogin(true)}}>
<ListItemIcon><ReportIcon /></ListItemIcon>Reportar
</StyledMenuItem>
)
}
</Menu> </Menu>
</div> </div>
</> </>
</React.Fragment>
); );
} }
......
...@@ -157,7 +157,7 @@ export default function LoginContainer (props) { ...@@ -157,7 +157,7 @@ export default function LoginContainer (props) {
<RememberRecover> <RememberRecover>
<LabeledCheckbox label={<StyledLabel><StyledSpan>Lembrar-me</StyledSpan></StyledLabel>} handleChange={() => setCheckbox(!checkboxControl)}/> <LabeledCheckbox label={<StyledLabel><StyledSpan>Lembrar-me</StyledSpan></StyledLabel>} handleChange={() => setCheckbox(!checkboxControl)}/>
<UserForgotTheirPasswordSpan>Esqueceu a senha? <Link to={"recuperar-senha"} style={{textAlign: "right", color:"#4cd0e1"}} onClick={props.handleClose}>Clique aqui!</Link></UserForgotTheirPasswordSpan> <UserForgotTheirPasswordSpan>Esqueceu a senha? <Link to={"/recuperar-senha"} style={{textAlign: "right", color:"#4cd0e1"}} onClick={props.handleClose}>Clique aqui!</Link></UserForgotTheirPasswordSpan>
</RememberRecover> </RememberRecover>
<ConfirmContainerStyled> <ConfirmContainerStyled>
......
...@@ -27,12 +27,39 @@ import {apiDomain} from '../../env'; ...@@ -27,12 +27,39 @@ import {apiDomain} from '../../env';
import CommentForm from './CommentForm.js' import CommentForm from './CommentForm.js'
import Comment from '../Comment.js' import Comment from '../Comment.js'
import {getRequest} from '../HelperFunctions/getAxiosConfig' import {getRequest} from '../HelperFunctions/getAxiosConfig'
import LoginModal from './../LoginModal.js'
import Snackbar from '@material-ui/core/Snackbar';
import SignUpModal from './../SignUpModal'
import MuiAlert from '@material-ui/lab/Alert';
function Alert(props) {
return <MuiAlert elevation={6} variant="filled" {...props} />;
}
export default function CommentsArea (props) { export default function CommentsArea (props) {
const {state} = useContext(Store) const {state} = useContext(Store)
const [comentarios, setComentarios] = useState([]) const [comentarios, setComentarios] = useState([])
const [gambiarra, setState] = useState(0) const [gambiarra, setState] = useState(0)
const forceUpdate = () => {setState(gambiarra + 1)} const forceUpdate = () => {setState(gambiarra + 1)}
const [loginOpen, setLogin] = useState(false)
const [successfulLoginOpen, handleSuccessfulLogin] = useState(false)
const [signUpOpen, setSignUp] = useState(false)
const handleSignUp = () => {
setSignUp(!signUpOpen)
}
const handleLogin = () => {
setLogin(!loginOpen)
}
const toggleSnackbar = (event, reason) => {
if (reason === 'clickaway') {
return;
}
handleSuccessfulLogin(false);
}
function handleSuccess (data) { function handleSuccess (data) {
setComentarios(data.sort((a, b) => a.updated_at > b.updated_at ? -1 : 1)) setComentarios(data.sort((a, b) => a.updated_at > b.updated_at ? -1 : 1))
...@@ -45,6 +72,18 @@ export default function CommentsArea (props) { ...@@ -45,6 +72,18 @@ export default function CommentsArea (props) {
}, [gambiarra]) }, [gambiarra])
return ( return (
<React.Fragment>
<Snackbar open={successfulLoginOpen} autoHideDuration={1000} onClose={toggleSnackbar}
anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
>
<Alert severity="success" style={{ backgroundColor: "#00acc1" }}>Você está conectado(a)!</Alert>
</Snackbar>
{/*-------------------------------MODALS---------------------------------------*/}
<LoginModal open={loginOpen} handleClose={() => setLogin(false)} openSignUp={handleSignUp}
openSnackbar={() => { handleSuccessfulLogin(true) }}
/>
<SignUpModal open={signUpOpen} handleClose={handleSignUp} openLogin={handleLogin} />
{/*----------------------------------------------------------------------------*/}
<Grid container spacing={2} style={{padding : "10px"}}> <Grid container spacing={2} style={{padding : "10px"}}>
{ {
(state.currentUser.id !== '') ? (state.currentUser.id !== '') ?
...@@ -73,8 +112,7 @@ export default function CommentsArea (props) { ...@@ -73,8 +112,7 @@ export default function CommentsArea (props) {
<Grid item xs={12}> <Grid item xs={12}>
<LogInToComment> <LogInToComment>
<span className="span-laranja">Você precisa entrar para comentar</span> <span className="span-laranja">Você precisa entrar para comentar</span>
{/*adicionar funcionalidade ao botao de entrar*/} <Button onClick={() => handleLogin(true)} style={{textTransform : "uppercase", color : "#666", fontWeight : "700"}}>
<Button style={{textTransform : "uppercase", color : "#666", fontWeight : "700"}}>
<ExitToAppIcon/>ENTRAR <ExitToAppIcon/>ENTRAR
</Button> </Button>
</LogInToComment> </LogInToComment>
...@@ -123,6 +161,7 @@ export default function CommentsArea (props) { ...@@ -123,6 +161,7 @@ export default function CommentsArea (props) {
) )
} }
</Grid> </Grid>
</React.Fragment>
) )
} }
......
...@@ -21,7 +21,7 @@ import {Store} from '../../Store' ...@@ -21,7 +21,7 @@ import {Store} from '../../Store'
import styled from 'styled-components' import styled from 'styled-components'
import Grid from '@material-ui/core/Grid'; import Grid from '@material-ui/core/Grid';
import {Link} from 'react-router-dom' import {Link} from 'react-router-dom'
import {NoIcon} from '../ContactButtons/FollowButton.js' import {NoIcon, NoIconButton} from '../ContactButtons/FollowButton.js'
import {NoIconFollowing} from '../ContactButtons/FollowingButton.js' import {NoIconFollowing} from '../ContactButtons/FollowingButton.js'
import Collapse from '@material-ui/core/Collapse'; import Collapse from '@material-ui/core/Collapse';
import SdCardIcon from '@material-ui/icons/SdCard'; import SdCardIcon from '@material-ui/icons/SdCard';
...@@ -34,6 +34,14 @@ import UpdateIcon from '@material-ui/icons/Update'; ...@@ -34,6 +34,14 @@ import UpdateIcon from '@material-ui/icons/Update';
import AssignmentIcon from '@material-ui/icons/Assignment'; import AssignmentIcon from '@material-ui/icons/Assignment';
import License from '../../img/cc_license.png' import License from '../../img/cc_license.png'
import ContactCardOptions from '../ContactCardOptions.js' import ContactCardOptions from '../ContactCardOptions.js'
import LoginModal from './../LoginModal.js'
import Snackbar from '@material-ui/core/Snackbar';
import SignUpModal from './../SignUpModal'
import MuiAlert from '@material-ui/lab/Alert';
function Alert(props) {
return <MuiAlert elevation={6} variant="filled" {...props} />;
}
function AdditionalInfoItem (props) { function AdditionalInfoItem (props) {
return ( return (
...@@ -50,6 +58,25 @@ export default function Sobre (props) { ...@@ -50,6 +58,25 @@ export default function Sobre (props) {
const [collapsed, setCollapsed] = useState(false) const [collapsed, setCollapsed] = useState(false)
const toggleCollapsed = () => {setCollapsed(!collapsed)}; const toggleCollapsed = () => {setCollapsed(!collapsed)};
const [loginOpen, setLogin] = useState(false)
const [successfulLoginOpen, handleSuccessfulLogin] = useState(false)
const [signUpOpen, setSignUp] = useState(false)
const handleSignUp = () => {
setSignUp(!signUpOpen)
}
const handleLogin = () => {
setLogin(!loginOpen)
}
const toggleSnackbar = (event, reason) => {
if (reason === 'clickaway') {
return;
}
handleSuccessfulLogin(false);
}
var moment = require('moment') var moment = require('moment')
...@@ -141,6 +168,18 @@ export default function Sobre (props) { ...@@ -141,6 +168,18 @@ export default function Sobre (props) {
const toggleFollowed = () => {setFollowed(!followed)} const toggleFollowed = () => {setFollowed(!followed)}
return ( return (
<React.Fragment>
<Snackbar open={successfulLoginOpen} autoHideDuration={1000} onClose={toggleSnackbar}
anchorOrigin={{ vertical: 'top', horizontal: 'center' }}
>
<Alert severity="success" style={{ backgroundColor: "#00acc1" }}>Você está conectado(a)!</Alert>
</Snackbar>
{/*-------------------------------MODALS---------------------------------------*/}
<LoginModal open={loginOpen} handleClose={() => setLogin(false)} openSignUp={handleSignUp}
openSnackbar={() => { handleSuccessfulLogin(true) }}
/>
<SignUpModal open={signUpOpen} handleClose={handleSignUp} openLogin={handleLogin} />
{/*----------------------------------------------------------------------------*/}
<Grid container style={{paddingRight : "15px", paddingLeft : "15px"}}> <Grid container style={{paddingRight : "15px", paddingLeft : "15px"}}>
<Grid item xs={windowWidth > 990 ? 9 : 12} style={{paddingRight : "15px"}}> <Grid item xs={windowWidth > 990 ? 9 : 12} style={{paddingRight : "15px"}}>
...@@ -210,11 +249,20 @@ export default function Sobre (props) { ...@@ -210,11 +249,20 @@ export default function Sobre (props) {
) )
: :
( (
state.currentUser.id !== '' ? (
<> <>
<NoIcon followableID={props.id} toggleFollowed={toggleFollowed}/> <NoIcon followableID={props.id} toggleFollowed={toggleFollowed}/>
<ContactCardOptions followableID={props.id}/> <ContactCardOptions followableID={props.id}/>
</> </>
) )
:
(
<>
<NoIconButton onClick={() => handleLogin(true)}>seguir</NoIconButton>
<ContactCardOptions followableID={props.id}/>
</>
)
)
} }
</div> </div>
</MetasObjeto> </MetasObjeto>
...@@ -241,6 +289,7 @@ export default function Sobre (props) { ...@@ -241,6 +289,7 @@ export default function Sobre (props) {
</CollapseControl> </CollapseControl>
</Grid> </Grid>
</Grid> </Grid>
</React.Fragment>
) )
} }
......
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment