Skip to content

Commit

Permalink
Merge branch 'main' of https://github.com/BerkeAras/WorkGroup
Browse files Browse the repository at this point in the history
  • Loading branch information
@BerkeAras
BerkeAras committed Mar 19, 2022
2 parents cd22c4d + 50dab0b commit 13d58dc
Show file tree
Hide file tree
Showing 6 changed files with 109 additions and 21 deletions.
29 changes: 26 additions & 3 deletions src/components/Header/HeaderSearchField/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ import ConfigContext from '../../../store/ConfigContext'
// Icons
import { library } from '@fortawesome/fontawesome-svg-core'
import { faUsers, faCalendarDay, faHashtag } from '@fortawesome/free-solid-svg-icons'
import { User, Search, Hash, Users, Zap, AlertTriangle, Folder, FileText } from 'react-feather'
import { User, Search, Hash, Users, Zap, AlertTriangle, Folder, FileText, BookOpen } from 'react-feather'
library.add(faUsers)
library.add(faCalendarDay)
library.add(faHashtag)
Expand All @@ -21,6 +21,7 @@ const SearchField = () => {
const [topicResult, setTopicResult] = useState([])
const [knowledgeBaseFoldersResult, setKnowledgeBaseFoldersResult] = useState([])
const [knowledgeBaseFilesResult, setKnowledgeBaseFilesResult] = useState([])
const [postsResult, setPostsResult] = useState([])
const [isLoadingResults, setIsLoadingResults] = useState(false)
const [minimumSearchLength, setMinimumSearchLength] = useState(3)

Expand Down Expand Up @@ -51,6 +52,7 @@ const SearchField = () => {
setTopicResult([])
setKnowledgeBaseFoldersResult([])
setKnowledgeBaseFilesResult([])
setPostsResult([])
setIsLoadingResults(false)
} else {
controller.abort()
Expand All @@ -76,12 +78,14 @@ const SearchField = () => {
let topicResult = result[2]
let knowledgeBaseFolders = result[3]
let knowledgeBaseFiles = result[4]
let postResult = result[5]

setUserResult(userResult)
setGroupResult(groupResult)
setTopicResult(topicResult)
setKnowledgeBaseFoldersResult(knowledgeBaseFolders)
setKnowledgeBaseFilesResult(knowledgeBaseFiles)
setPostsResult(Object.keys(postResult).map((key) => postResult[key]))

setIsLoadingResults(false)
})
Expand Down Expand Up @@ -123,7 +127,7 @@ const SearchField = () => {
value={searchQuery}
onFocus={searchFieldFocus}
onChange={searchQueryChangeHandler}
placeholder="Search for colleagues, groups, events and more..."
placeholder="Search for colleagues, groups, files and more..."
/>
{isLoadingResults && <span className="loader"></span>}
</form>
Expand Down Expand Up @@ -204,6 +208,23 @@ const SearchField = () => {
})}
</>
)}
{(postsResult && postsResult.length > 0) && (
<>
<span className="divider">Posts</span>
{postsResult.map((postResult) => {
return (
<li key={postResult.id}>
<Link
onClick={() => document.activeElement.blur()}
to={'/app/post/' + postResult.id}
>
<BookOpen size={18} strokeWidth={2.7} /> {postResult.post_content}
</Link>
</li>
)
})}
</>
)}

{userResult &&
groupResult &&
Expand All @@ -214,6 +235,7 @@ const SearchField = () => {
topicResult.length == 0 &&
knowledgeBaseFoldersResult.length == 0 &&
knowledgeBaseFilesResult.length == 0 &&
postsResult.length == 0 &&
searchQuery.length >= minimumSearchLength && (
<center className="search-error">
<AlertTriangle size={35} strokeWidth={2} />
Expand All @@ -227,12 +249,13 @@ const SearchField = () => {
topicResult.length == 0 &&
knowledgeBaseFoldersResult.length == 0 &&
knowledgeBaseFilesResult.length == 0 &&
postsResult.length == 0 &&
searchQuery.length < minimumSearchLength) ||
searchQuery.length == 0) && (
<center className="search-error">
<Zap size={35} strokeWidth={2} />
<br />
<span>Search for colleagues, groups, events and more...</span>
<span>Search for colleagues, groups, files and more...</span>
</center>
)}
</ul>
Expand Down
13 changes: 13 additions & 0 deletions src/utils/validateEmail.jsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
export default function validateEmail(email) {
let validated = String(email)
.toLowerCase()
.match(
/^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-ZÄäÖöÜü\-0-9]+\.)+[a-zA-Z]{2,}))$/
);

if (validated == null) {
return false;
} else {
return true;
}
}
6 changes: 4 additions & 2 deletions src/views/App/style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,10 @@ body {
.app {
padding: 0;
background: #f0f5f7;
overflow: auto !important;
overflow-x: hidden;
overflow-y: auto !important;
}

.main_content {
padding: 0 calc((100% - 1200px) / 2);
}
Expand All @@ -28,4 +30,4 @@ body ::-webkit-scrollbar {

body ::-webkit-scrollbar-thumb {
background: $primary-color !important;
}
}
30 changes: 25 additions & 5 deletions src/views/auth/PasswordReset/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,9 +2,10 @@
import React from 'react'
import { BrowserRouter as Router, Switch, Route, Link, Redirect } from 'react-router-dom'
import './style.scss'
import { Button, Input, Message, Card } from 'semantic-ui-react'
import { Button, Input, Message } from 'semantic-ui-react'
import logo from '../../../static/logo.svg'
import ConfigContext from '../../../store/ConfigContext'
import validateEmail from '../../../utils/validateEmail'

class PasswordReset extends React.Component {
static contextType = ConfigContext
Expand Down Expand Up @@ -59,6 +60,13 @@ class PasswordReset extends React.Component {

if (this.state.email.trim() !== '') {
setTimeout(() => {

if (!validateEmail(this.state.email.trim())) {
this.setState({ error: 'mail_not_valid' })
this.setState({ isResetting: false })
return;
}

const requestOptions = {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
Expand Down Expand Up @@ -185,7 +193,9 @@ class PasswordReset extends React.Component {
return (
<>
<div className="loginContainer">
<img className="logo" alt="Logo" src={logo} />
<Link to="/">
<img className="logo" alt="Logo" src={logo} />
</Link>
<>
{this.state.showPinCard == '0' && (
<>
Expand Down Expand Up @@ -226,6 +236,16 @@ class PasswordReset extends React.Component {
) : (
<div />
)}

{this.state.error === 'mail_not_valid' ? (
<Message negative>
<Message.Header>Oh no! An error occurred 😢.</Message.Header>
<p>Your E-Mail Address does not look correct. Are you sure you entered it correctly?</p>
</Message>
) : (
<div />
)}

{this.state.success ? (
<Message positive>
<Message.Header>Please check your email inbox to reset your password.</Message.Header>
Expand All @@ -235,7 +255,7 @@ class PasswordReset extends React.Component {
)}

<form className="" onSubmit={this.handleSubmit}>
<Input fluid onChange={this.emailChangeHandler} type="email" placeholder="E-Mail" id="userEmail" />
<Input fluid onChange={this.emailChangeHandler} autoComplete="email" type="email" placeholder="E-Mail" id="userEmail" />
<br />
{this.state.isResetting ? (
<Button loading primary type="submit">
Expand Down Expand Up @@ -358,9 +378,9 @@ class PasswordReset extends React.Component {
)}

<form className="" onSubmit={this.handlePasswordSubmit}>
<Input fluid onChange={this.password1ChangeHandler} type="password" placeholder="New Password" id="userPassword1" />
<Input fluid onChange={this.password1ChangeHandler} type="password" autoComplete="new-password" placeholder="New Password" id="userPassword1" />
<br />
<Input fluid onChange={this.password2ChangeHandler} type="password" placeholder="Repeat your Password" id="userPassword2" />
<Input fluid onChange={this.password2ChangeHandler} type="password" autoComplete="new-password" placeholder="Repeat your Password" id="userPassword2" />
<br />
{this.state.isResetting ? (
<Button loading primary type="submit">
Expand Down
27 changes: 23 additions & 4 deletions src/views/auth/SignIn/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,13 +4,15 @@ import './style.scss'
import { Button, Input, Message, Card } from 'semantic-ui-react'
import logo from '../../../static/logo.svg'
import ConfigContext from '../../../store/ConfigContext'
import validateEmail from '../../../utils/validateEmail'

const SignIn = () => {
const contextValue = useContext(ConfigContext)
const [email, setEmail] = useState('')
const [password, setPassword] = useState('')
const [error, setError] = useState(false)
const [connectionError, setConnectionError] = useState(false)
const [mailError, setMailError] = useState(false)
const [isLoggingIn, setIsLoggingIn] = useState(false)
const [canLogin, setCanLogin] = useState(false)
const [isLoggedIn, setIsLoggedIn] = useState(false)
Expand All @@ -37,6 +39,13 @@ const SignIn = () => {
}),
}

if (!validateEmail(email)) {
setError(false);
setMailError(true)
setIsLoggingIn(false)
return;
}

// eslint-disable-next-line no-undef
fetch(process.env.REACT_APP_API_URL + '/api/auth/login', requestOptions).then((response) => {
if (response.status == 200) {
Expand All @@ -55,12 +64,14 @@ const SignIn = () => {
} else {
setIsLoggedIn(false)
setIsLoggingIn(false)
setMailError(false)
setError(true)
}
})
} else {
setIsLoggedIn(false)
setIsLoggingIn(false)
setMailError(false)
setError(true)
}
})
Expand Down Expand Up @@ -92,7 +103,9 @@ const SignIn = () => {
return (
<>
<div className="loginContainer">
<img className="logo" alt="Logo" src={logo} />
<Link to="/">
<img className="logo" alt="Logo" src={logo} />
</Link>
<div className="formContainer">
{connectionError ? (
<Message negative>
Expand All @@ -106,13 +119,19 @@ const SignIn = () => {
{error && (
<Message negative>
<Message.Header>Oh no! An error occurred 😢.</Message.Header>
<p> E-Mail or password incorrect! </p>
<p>E-Mail or password incorrect!</p>
</Message>
)}
{mailError && (
<Message negative>
<Message.Header>Oh no! An error occurred 😢.</Message.Header>
<p>Your E-Mail Address does not look correct. Are you sure you entered it correctly?</p>
</Message>
)}
<form className="" onSubmit={handleSubmit}>
<Input fluid onChange={emailChangeHandler} type="email" placeholder="E-Mail" id="userEmail" />
<Input fluid onChange={emailChangeHandler} type="email" autoComplete="email" placeholder="E-Mail" id="userEmail" />
<br />
<Input fluid onChange={passwordChangeHandler} type="password" placeholder="Password" id="userPassword" />
<Input fluid onChange={passwordChangeHandler} type="password" autoComplete="current-password" placeholder="Password" id="userPassword" />
<br />
{isLoggingIn ? (
<Button loading primary disabled={!canLogin} type="submit">
Expand Down
25 changes: 18 additions & 7 deletions src/views/auth/SignUp/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,14 +6,17 @@ import { Button, Input, Message, Loader } from 'semantic-ui-react'
import logo from '../../../static/logo.svg'
import PropTypes from 'prop-types'
import ConfigContext from '../../../store/ConfigContext'
import validateEmail from '../../../utils/validateEmail'

const SignUpWrapper = () => {
const [isWaitingForActivation, setIsWaitingForActivation] = useState(false)

return (
<>
<div className="loginContainer">
<img className="logo" alt="Logo" src={logo} />
<Link to="/">
<img className="logo" alt="Logo" src={logo} />
</Link>
{!isWaitingForActivation ? <SignUp isWaitingForActivation={isWaitingForActivation} setIsWaitingForActivation={setIsWaitingForActivation} /> : <WaitActivation />}
</div>
<div className="loginBackground"></div>
Expand Down Expand Up @@ -55,12 +58,19 @@ const SignUp = (props) => {
setIsSigningUp(false)
} else {
setTimeout(() => {

if (!validateEmail(email.trim())) {
setError('mail_not_valid')
setIsSigningUp(false)
return;
}

const requestOptions = {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({
name: name,
email: email,
name: name.trim(),
email: email.trim(),
password: password,
password_confirmation: passwordRepeat,
}),
Expand Down Expand Up @@ -144,15 +154,15 @@ const SignUp = (props) => {
<ErrorMsg errorCode={'no_permission'} />
) : (
<form className="" onSubmit={(e) => handleSubmit(e)}>
<Input autoFocus fluid onChange={(e) => setName(e.target.value)} type="text" placeholder="Name" id="userName" />
<Input autoFocus fluid onChange={(e) => setName(e.target.value)} type="text" autoComplete="name" placeholder="Name" id="userName" />
<br />
<Input fluid onChange={(e) => setEmail(e.target.value)} type="email" placeholder="E-Mail" id="userEmail" />
<Input fluid onChange={(e) => setEmail(e.target.value)} autoComplete="email" type="email" placeholder="E-Mail" id="userEmail" />
<small>Please enter your real e-mail address. You will need to confirm it in the next step.</small>
<br />
<br />
<Input fluid onChange={(e) => setPassword(e.target.value)} type="password" placeholder="Password" id="userPassword" />
<Input fluid onChange={(e) => setPassword(e.target.value)} autoComplete="new-password" type="password" placeholder="Password" id="userPassword" />
<br />
<Input fluid onChange={(e) => setPasswordRepeat(e.target.value)} type="password" placeholder="Repeat password" id="userPasswordRepeat" />
<Input fluid onChange={(e) => setPasswordRepeat(e.target.value)} autoComplete="new-password" type="password" placeholder="Repeat password" id="userPasswordRepeat" />
<br />
{isSigningUp ? (
<Button loading primary type="submit">
Expand Down Expand Up @@ -186,6 +196,7 @@ const ErrorMsg = (props) => {
password_too_short: 'Your password is too short! Please enter at least 8 characters.',
no_permission: 'You do not have permission to sign up.',
unknown_error: 'An unknown error occured! Please try again later.',
mail_not_valid: 'Your E-Mail Address does not look correct. Are you sure you entered it correctly?'
}

return (
Expand Down

1 comment on commit 13d58dc

@vercel
Copy link

@vercel vercel bot commented on 13d58dc Mar 19, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Successfully deployed to the following URLs:

Please sign in to comment.