Skip to content

Commit

Permalink
Updates
Browse files Browse the repository at this point in the history
  • Loading branch information
@BerkeAras
BerkeAras committed Jan 22, 2022
1 parent 9c57259 commit b45a59f
Show file tree
Hide file tree
Showing 13 changed files with 197 additions and 171 deletions.
2 changes: 1 addition & 1 deletion public/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
<link rel="manifest" href="%PUBLIC_URL%/assets/site.webmanifest" />
<link rel="icon" href="%PUBLIC_URL%/assets/favicon.ico" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Initializing – WorkGroup</title>
</head>

Expand Down
81 changes: 51 additions & 30 deletions src/components/SidebarRight/index.jsx
View file
Original file line number Diff line number Diff line change
@@ -1,4 +1,4 @@
import React from 'react'
import React, { useState } from 'react'
import './style.scss'
import { Card, Icon } from 'semantic-ui-react'
import { FontAwesomeIcon } from '@fortawesome/react-fontawesome'
Expand All @@ -8,40 +8,61 @@ import { BrowserRouter as Router, Switch, Route, Link, Redirect, useParams } fro
import { User, Users, Calendar } from 'react-feather'
import packageJson from '../../../package.json'
import logo from '../../static/logo.svg'
import CookieBanner from '../_App_CookieBanner'

library.add(faUser, faUserFriends, faCalendarWeek)

const SidebarRight = () => {
const [showCookieBanner, setShowCookieBanner] = useState(false)

return (
<div className="sidebar_right">
<Card>
<Card.Content extra>About WorkGroup {packageJson.version}</Card.Content>
<Card.Content className="about-card-content">
<a className="about-link" target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup">
Project
</a>
&nbsp;–&nbsp;
<a className="about-link" target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup/blob/main/LICENSE">
License
</a>
&nbsp;–&nbsp;
<a className="about-link" target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup/blob/main/CONTRIBUTING.md">
Contributing
</a>
&nbsp;–&nbsp;
<a className="about-link" target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup#contact">
Contact
</a>
</Card.Content>
<Card.Content className="about-card-content">
<a target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup" className="about-logo">
<img src={logo} />
<br />
an open source project.
</a>
</Card.Content>
</Card>
</div>
<>
<div className="sidebar_right">
<Card>
<Card.Content extra>About WorkGroup {packageJson.version}</Card.Content>
<Card.Content className="about-card-content">
<a className="about-link" target="_blank" rel="noreferrer" href="https://workgroup.berkearas.de/">
Project
</a>
<a className="about-link" target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup/blob/main/LICENSE">
License
</a>
<a className="about-link" target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup/blob/main/CONTRIBUTING.md">
Contributing
</a>
<a className="about-link" target="_blank" rel="noreferrer" href="https://github.com/BerkeAras/WorkGroup#contact">
Contact
</a>
<a className="about-link" target="_blank" rel="noreferrer" href="https://workgroup.berkearas.de/imprint">
Imprint
</a>
<a className="about-link" target="_blank" rel="noreferrer" href="https://workgroup.berkearas.de/data-policy">
Data Policy
</a>
<a
className="about-link"
href="#"
onClick={(e) => {
e.preventDefault()
localStorage.removeItem('cookies_accepted')
setShowCookieBanner(true)
}}
>
Cookie Consent
</a>
</Card.Content>
<Card.Content className="about-card-content">
<a target="_blank" rel="noreferrer" href="https://workgroup.berkearas.de/" className="about-logo">
<img src={logo} />
<br />
an open source project.
</a>
</Card.Content>
</Card>
</div>

{showCookieBanner && <CookieBanner isLoggedIn={true} />}
</>
)
}

Expand Down
14 changes: 14 additions & 0 deletions src/components/SidebarRight/style.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -60,6 +60,20 @@ body {
}
}
}

.about-card-content {
a.about-link {
padding: 0px 1px;
margin: 2px 5px;
opacity: 0.8;

&:hover,
&:focus-visible,
&:active {
opacity: 1;
}
}
}
}

@media (max-width: 1130px) {
Expand Down
110 changes: 56 additions & 54 deletions src/components/_App_PostsList/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -8,63 +8,61 @@ import getFriendlyDate from '../../utils/getFriendlyDate'
import loadPosts from '../../utils/loadPosts'
import likePost from '../../utils/likePost'
import toggleComment from '../../utils/toggleComment'
import VirtualScroll from "react-dynamic-virtual-scroll";
import VirtualScroll from 'react-dynamic-virtual-scroll'

import unknownAvatar from '../../static/unknown.png'

import CommentSection from '../_App_CommentSection/'
import ReportPost from '../_App_ReportPost/'

export default function PostsList(props) {

const [items, setItems] = useState([]);
const [isLoading, setIsLoading] = useState(true);
const [items, setItems] = useState([])
const [isLoading, setIsLoading] = useState(true)
const [paginationPage, setPaginationPage] = useState(1)
const [totalPaginationPages, setTotalPagionationPages] = useState(1)
const [isLoadingMore, setIsLoadingMore] = useState(false);
const [visibleCommentSections, setVisibleCommentSections] = useState([]);
const [emptyStates, setEmptyStates] = useState(["It's empty here. Start sharing something about your thoughts!", 'Your friends are shy. Get started and write your first post.']);
const [imageModalVisible, setImageModalVisible] = useState(false);
const [imageModalUrl, setImageModalUrl] = useState('');
const [reportModalVisible, setReportModalVisible] = useState(false);
const [reportModalPostId, setReportModalPostId] = useState(0);
const [reportSuccessVisible, setReportSuccessVisible] = useState(false);
const [reportErrorVisible, setReportErrorVisible] = useState(false);
const [isLoadingMore, setIsLoadingMore] = useState(false)
const [visibleCommentSections, setVisibleCommentSections] = useState([])
const [emptyStates, setEmptyStates] = useState(["It's empty here. Start sharing something about your thoughts!", 'Your friends are shy. Get started and write your first post.'])
const [imageModalVisible, setImageModalVisible] = useState(false)
const [imageModalUrl, setImageModalUrl] = useState('')
const [reportModalVisible, setReportModalVisible] = useState(false)
const [reportModalPostId, setReportModalPostId] = useState(0)
const [reportSuccessVisible, setReportSuccessVisible] = useState(false)
const [reportErrorVisible, setReportErrorVisible] = useState(false)

useEffect(() => {
loadMore();
console.log(props.group, props.user);
loadMore()
}, [])

const loadMore = (page = 1) => {
setIsLoading(true);
setIsLoading(true)
document.querySelector('.app').scrollTo(0, 0)

let postLoader;
let postLoader

if (props.group !== undefined) {
postLoader = loadPosts({page: page, filterBy: 'group', filter: props.group});
postLoader = loadPosts({ page: page, filterBy: 'group', filter: props.group })
} else {

if (props.user !== "*") {
postLoader = loadPosts({page: page, filterBy: 'user', filter: props.user});
if (props.user !== '*') {
postLoader = loadPosts({ page: page, filterBy: 'user', filter: props.user })
} else {
postLoader = loadPosts({page: page});
postLoader = loadPosts({ page: page })
}

}

setPaginationPage(page);

postLoader.then(res => {
setIsLoading(false);
setItems(Object.values(res.posts));
setTotalPagionationPages(res.totalPages);
}).catch(err => {
console.error(err);
setIsLoading(false);
setItems([]);
})
setPaginationPage(page)

postLoader
.then((res) => {
setIsLoading(false)
setItems(Object.values(res.posts))
setTotalPagionationPages(res.totalPages)
})
.catch((err) => {
console.error(err)
setIsLoading(false)
setItems([])
})
}

const handlePaginationChange = (event) => {
Expand Down Expand Up @@ -109,12 +107,12 @@ export default function PostsList(props) {
const reportPost = (e, postId) => {
e.preventDefault()

setReportModalVisible(true);
setReportModalPostId(postId);
setReportModalVisible(true)
setReportModalPostId(postId)
}

const commentOpener = (e) => {
setVisibleCommentSections(toggleComment(e, visibleCommentSections));
setVisibleCommentSections(toggleComment(e, visibleCommentSections))
}

return (
Expand Down Expand Up @@ -202,11 +200,25 @@ export default function PostsList(props) {
)}
</Feed.Extra>
<Feed.Meta>
<Feed.Like href="#" onClick={(e) => {likePost(e)}} id={'post_like_id_' + item.id} className={item.hasLiked}>
<Feed.Like
href="#"
onClick={(e) => {
likePost(e)
}}
id={'post_like_id_' + item.id}
className={item.hasLiked}
>
<ThumbsUp size={16} strokeWidth={2.5} />
<span>{getLikes(item.likes)}</span>
</Feed.Like>
<a href="#" className="comment-button" onClick={(e) => {commentOpener(e)}} id={'post_comment_id_' + item.id}>
<a
href="#"
className="comment-button"
onClick={(e) => {
commentOpener(e)
}}
id={'post_comment_id_' + item.id}
>
<MessageCircle size={16} strokeWidth={2.5} />
<span>{getComments(item.comments)}</span>
</a>
Expand All @@ -228,10 +240,9 @@ export default function PostsList(props) {
</React.Fragment>
))}

<div style={{textAlign:'center',width:'100%'}}>
<Pagination style={{marginTop:'20px'}} activePage={paginationPage} onPageChange={(event) => handlePaginationChange(event)} totalPages={totalPaginationPages} />
<div style={{ textAlign: 'center', width: '100%' }}>
<Pagination style={{ marginTop: '20px' }} activePage={paginationPage} onPageChange={(event) => handlePaginationChange(event)} totalPages={totalPaginationPages} />
</div>

</React.Fragment>
) : (
<Feed.Event>
Expand Down Expand Up @@ -272,19 +283,11 @@ export default function PostsList(props) {
/>
)}

<Modal
onClose={() => setReportSuccessVisible(false)}
onOpen={() => setReportSuccessVisible(true)}
open={reportSuccessVisible}
size="mini"
>
<Modal onClose={() => setReportSuccessVisible(false)} onOpen={() => setReportSuccessVisible(true)} open={reportSuccessVisible} size="mini">
<Modal.Header>Post reported!</Modal.Header>
<Modal.Content>Thank you for your feedback about this post. We will review it immediately.</Modal.Content>
<Modal.Actions>
<Button
color="black"
onClick={() => setReportSuccessVisible(false)}
>
<Button color="black" onClick={() => setReportSuccessVisible(false)}>
Dismiss
</Button>
</Modal.Actions>
Expand All @@ -300,10 +303,9 @@ export default function PostsList(props) {
</Modal>
</div>
)

}

PostsList.propTypes = {
user: PropTypes.string,
group: PropTypes.any,
}
}
2 changes: 0 additions & 2 deletions src/components/_Group_GroupBanner/index.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -232,9 +232,7 @@ function GroupBanner(props) {
fetch(process.env.REACT_APP_API_URL + '/api/group/getAllMembers?group_id=' + props.groupInformation['id'], requestOptions)
.then((response) => response.json())
.then((result) => {
console.log(result['users'])
setGroupMembers(result['users'])

setIsLoadingRequests(false)
})
}
Expand Down
Loading

0 comments on commit b45a59f

Please sign in to comment.