ECEntrics
/
concordia
mirror of https://gitlab.com/ecentrics/concordia
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Merge branch 'implement-ui' into restore-docker-configuration 

# Conflicts:
#	packages/concordia-app/src/components/PostCreate/index.jsx
#	packages/concordia-app/src/components/PostList/PostListRow/index.jsx
#	packages/concordia-app/src/redux/sagas/peerDbReplicationSaga.js
#	packages/concordia-app/src/views/Topic/TopicCreate/index.jsx
develop
Apostolos Fanakis 4 years ago
parent
11cb281bd2 13b0224d36
commit
2c0df97a6b
11 changed files with 31 additions and 58 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 1
      packages/concordia-app/package.json
  2. 5
      packages/concordia-app/public/locales/en/translation.json
  3. 27
      packages/concordia-app/src/components/PostCreate/index.jsx
  4. 8
      packages/concordia-app/src/components/PostCreate/styles.css
  5. 19
      packages/concordia-app/src/components/PostList/PostListRow/index.jsx
  6. 4
      packages/concordia-app/src/components/PostList/PostListRow/styles.css
  7. 12
      packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx
  8. 2
      packages/concordia-app/src/constants/orbit/PostsDatabaseKeys.js
  9. 3
      packages/concordia-app/src/redux/sagas/peerDbReplicationSaga.js
  10. 3
      packages/concordia-app/src/views/Topic/TopicCreate/index.jsx
  11. 5
      yarn.lock

1
packages/concordia-app/package.json
View File

@ -45,6 +45,7 @@
"react-router-dom": "^5.2.0", "react-router-dom": "^5.2.0",
"react-scripts": "~3.4.3", "react-scripts": "~3.4.3",
"redux-saga": "~1.1.3", "redux-saga": "~1.1.3",
"react-timeago": "~5.2.0",
"semantic-ui-css": "~2.4.1", "semantic-ui-css": "~2.4.1",
"semantic-ui-react": "~1.2.1", "semantic-ui-react": "~1.2.1",
"web3": "1.3.0" "web3": "1.3.0"

5
packages/concordia-app/public/locales/en/translation.json
View File

@ -6,7 +6,6 @@
"post.create.form.send.button": "Post", "post.create.form.send.button": "Post",
"post.form.content.field.placeholder": "Message", "post.form.content.field.placeholder": "Message",
"post.form.subject.field.placeholder": "Subject", "post.form.subject.field.placeholder": "Subject",
"post.list.row.author.pre": "Post by",
"post.list.row.post.id": "#{{id}}", "post.list.row.post.id": "#{{id}}",
"profile.general.tab.address.row.title": "Account address:", "profile.general.tab.address.row.title": "Account address:",
"profile.general.tab.location.row.title": "Location:", "profile.general.tab.location.row.title": "Location:",
@ -52,7 +51,7 @@
"topic.create.form.post.button": "Post", "topic.create.form.post.button": "Post",
"topic.create.form.subject.field.label": "Topic subject", "topic.create.form.subject.field.label": "Topic subject",
"topic.create.form.subject.field.placeholder": "Subject", "topic.create.form.subject.field.placeholder": "Subject",
"topic.list.row.author.date": "Created by {{author}}, {{timeAgo}}", "topic.list.row.author": "by {{author}}",
"topic.list.row.number.of.replies": "{{numberOfReplies}} replies", "topic.list.row.number.of.replies": "{{numberOfReplies}} replies",
"topic.list.row.topic.id": "#{{id}}" "topic.list.row.topic.id": "#{{id}}"
} }

27
packages/concordia-app/src/components/PostCreate/index.jsx
View File

@ -14,7 +14,7 @@ import { USER_PROFILE_PICTURE } from '../../constants/orbit/UserDatabaseKeys';
import { breeze, drizzle } from '../../redux/store'; import { breeze, drizzle } from '../../redux/store';
import './styles.css'; import './styles.css';
import { TRANSACTION_ERROR, TRANSACTION_SUCCESS } from '../../constants/TransactionStatus'; import { TRANSACTION_ERROR, TRANSACTION_SUCCESS } from '../../constants/TransactionStatus';
import { POST_CONTENT, POST_SUBJECT } from '../../constants/orbit/PostsDatabaseKeys'; import { POST_CONTENT } from '../../constants/orbit/PostsDatabaseKeys';
import { FORUM_CONTRACT } from '../../constants/contracts/ContractNames'; import { FORUM_CONTRACT } from '../../constants/contracts/ContractNames';
import { POST_CREATED_EVENT } from '../../constants/contracts/events/ForumContractEvents'; import { POST_CREATED_EVENT } from '../../constants/contracts/events/ForumContractEvents';
@ -27,7 +27,7 @@ const PostCreate = (props) => {
} = props; } = props;
const transactionStack = useSelector((state) => state.transactionStack); const transactionStack = useSelector((state) => state.transactionStack);
const transactions = useSelector((state) => state.transactions); const transactions = useSelector((state) => state.transactions);
const [postSubject, setPostSubject] = useState(initialPostSubject); const [postSubject] = useState(initialPostSubject);
const [postContent, setPostContent] = useState(''); const [postContent, setPostContent] = useState('');
const [userProfilePictureUrl, setUserProfilePictureUrl] = useState(); const [userProfilePictureUrl, setUserProfilePictureUrl] = useState();
const [createPostCacheSendStackId, setCreatePostCacheSendStackId] = useState(''); const [createPostCacheSendStackId, setCreatePostCacheSendStackId] = useState('');
@ -68,9 +68,6 @@ const PostCreate = (props) => {
} }
switch (event.target.name) { switch (event.target.name) {
case 'postSubject':
setPostSubject(event.target.value);
break;
case 'postContent': case 'postContent':
setPostContent(event.target.value); setPostContent(event.target.value);
break; break;
@ -94,11 +91,9 @@ const PostCreate = (props) => {
postsDb postsDb
.put(contractPostId, { .put(contractPostId, {
[POST_SUBJECT]: postSubject,
[POST_CONTENT]: postContent, [POST_CONTENT]: postContent,
}, { pin: true }) }, { pin: true })
.then(() => { .then(() => {
setPostSubject(initialPostSubject);
setPostContent(''); setPostContent('');
setPosting(false); setPosting(false);
setStoringPost(false); setStoringPost(false);
@ -147,21 +142,6 @@ const PostCreate = (props) => {
</Feed.Label> </Feed.Label>
<Feed.Content> <Feed.Content>
<Feed.Summary> <Feed.Summary>
<div>
<Input
placeholder={t('post.form.subject.field.placeholder')}
name="postSubject"
className="subject-input"
size="mini"
value={postSubject}
onChange={handleInputChange}
/>
<span className="post-summary-meta-index">
{t('post.list.row.post.id', { id: postIndexInTopic })}
</span>
</div>
</Feed.Summary>
<Feed.Extra>
<Form> <Form>
<TextArea <TextArea
placeholder={t('post.form.content.field.placeholder')} placeholder={t('post.form.content.field.placeholder')}
@ -172,8 +152,7 @@ const PostCreate = (props) => {
onChange={handleInputChange} onChange={handleInputChange}
/> />
</Form> </Form>
</Feed.Extra> </Feed.Summary>
<Feed.Meta> <Feed.Meta>
<Feed.Like> <Feed.Like>
<Form.Button <Form.Button

8
packages/concordia-app/src/components/PostCreate/styles.css
View File

@ -8,10 +8,6 @@
opacity: 0.4; opacity: 0.4;
} }
.post-summary-meta-date { .like:hover .icon {
float: right !important; color: #fff !important;
}
.subject-input {
min-width: 300px;
} }

19
packages/concordia-app/src/components/PostList/PostListRow/index.jsx
View File

@ -6,7 +6,7 @@ import {
} from 'semantic-ui-react'; } from 'semantic-ui-react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import moment from 'moment'; import TimeAgo from 'react-timeago';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
import { FETCH_USER_DATABASE } from '../../../redux/actions/peerDbReplicationActions'; import { FETCH_USER_DATABASE } from '../../../redux/actions/peerDbReplicationActions';
@ -15,7 +15,7 @@ import './styles.css';
import { POSTS_DATABASE, USER_DATABASE } from '../../../constants/orbit/OrbitDatabases'; import { POSTS_DATABASE, USER_DATABASE } from '../../../constants/orbit/OrbitDatabases';
import determineKVAddress from '../../../utils/orbitUtils'; import determineKVAddress from '../../../utils/orbitUtils';
import { USER_PROFILE_PICTURE } from '../../../constants/orbit/UserDatabaseKeys'; import { USER_PROFILE_PICTURE } from '../../../constants/orbit/UserDatabaseKeys';
import { POST_CONTENT, POST_SUBJECT } from '../../../constants/orbit/PostsDatabaseKeys'; import { POST_CONTENT } from '../../../constants/orbit/PostsDatabaseKeys';
import { FORUM_CONTRACT } from '../../../constants/contracts/ContractNames'; import { FORUM_CONTRACT } from '../../../constants/contracts/ContractNames';
const { orbit } = breeze; const { orbit } = breeze;
@ -28,7 +28,6 @@ const PostListRow = (props) => {
const [postAuthorAddress, setPostAuthorAddress] = useState(null); const [postAuthorAddress, setPostAuthorAddress] = useState(null);
const [postAuthor, setPostAuthor] = useState(null); const [postAuthor, setPostAuthor] = useState(null);
const [timeAgo, setTimeAgo] = useState(null); const [timeAgo, setTimeAgo] = useState(null);
const [postSubject, setPostSubject] = useState(null);
const [postContent, setPostContent] = useState(null); const [postContent, setPostContent] = useState(null);
const [postAuthorMeta, setPostAuthorMeta] = useState(null); const [postAuthorMeta, setPostAuthorMeta] = useState(null);
const userAddress = useSelector((state) => state.user.address); const userAddress = useSelector((state) => state.user.address);
@ -41,7 +40,7 @@ const PostListRow = (props) => {
if (!loading && postCallHash && getPostResults[postCallHash] !== undefined) { if (!loading && postCallHash && getPostResults[postCallHash] !== undefined) {
setPostAuthorAddress(getPostResults[postCallHash].value[0]); setPostAuthorAddress(getPostResults[postCallHash].value[0]);
setPostAuthor(getPostResults[postCallHash].value[1]); setPostAuthor(getPostResults[postCallHash].value[1]);
setTimeAgo(moment(getPostResults[postCallHash].value[2] * 1000).fromNow()); setTimeAgo(getPostResults[postCallHash].value[2] * 1000);
} }
}, [getPostResults, loading, postCallHash]); }, [getPostResults, loading, postCallHash]);
@ -68,7 +67,6 @@ const PostListRow = (props) => {
.find((post) => post.id === postId); .find((post) => post.id === postId);
if (postFound) { if (postFound) {
setPostSubject(postFound[POST_SUBJECT]);
setPostContent(postFound[POST_CONTENT]); setPostContent(postFound[POST_CONTENT]);
} }
}, [postId, posts]); }, [postId, posts]);
@ -126,9 +124,6 @@ const PostListRow = (props) => {
<Feed.Content> <Feed.Content>
<Feed.Summary> <Feed.Summary>
<div> <div>
{postSubject !== null
? postSubject
: <Placeholder><Placeholder.Line length="very long" /></Placeholder>}
<span className="post-summary-meta-index"> <span className="post-summary-meta-index">
{t('post.list.row.post.id', { id: postIndexInTopic })} {t('post.list.row.post.id', { id: postIndexInTopic })}
</span> </span>
@ -136,10 +131,10 @@ const PostListRow = (props) => {
{postAuthor !== null && setPostAuthorAddress !== null && timeAgo !== null {postAuthor !== null && setPostAuthorAddress !== null && timeAgo !== null
? ( ? (
<> <>
{t('post.list.row.author.pre')}
&nbsp;
<Feed.User as={Link} to={`/users/${postAuthorAddress}`}>{postAuthor}</Feed.User> <Feed.User as={Link} to={`/users/${postAuthorAddress}`}>{postAuthor}</Feed.User>
<Feed.Date className="post-summary-meta-date">{timeAgo}</Feed.Date> <Feed.Date className="post-summary-meta-date">
<TimeAgo date={timeAgo} />
</Feed.Date>
</> </>
) )
: <Placeholder><Placeholder.Line length="medium" /></Placeholder>} : <Placeholder><Placeholder.Line length="medium" /></Placeholder>}
@ -150,7 +145,7 @@ const PostListRow = (props) => {
</Feed.Content> </Feed.Content>
</Dimmer.Dimmable> </Dimmer.Dimmable>
), [ ), [
authorAvatarLink, loading, postAuthor, postAuthorAddress, postContent, postIndexInTopic, postSubject, t, timeAgo, authorAvatarLink, loading, postAuthor, postAuthorAddress, postContent, postIndexInTopic, t, timeAgo,
]); ]);
}; };

4
packages/concordia-app/src/components/PostList/PostListRow/styles.css
View File

@ -7,7 +7,3 @@
font-size: 12px; font-size: 12px;
opacity: 0.4; opacity: 0.4;
} }
.post-summary-meta-date {
float: right !important;
}

12
packages/concordia-app/src/components/TopicList/TopicListRow/index.jsx
View File

@ -6,7 +6,7 @@ import {
} from 'semantic-ui-react'; } from 'semantic-ui-react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
import moment from 'moment'; import TimeAgo from 'react-timeago';
import { useHistory } from 'react-router'; import { useHistory } from 'react-router';
import { useDispatch, useSelector } from 'react-redux'; import { useDispatch, useSelector } from 'react-redux';
import { Link } from 'react-router-dom'; import { Link } from 'react-router-dom';
@ -41,7 +41,7 @@ const TopicListRow = (props) => {
if (!loading && topicCallHash && getTopicResults[topicCallHash] !== undefined) { if (!loading && topicCallHash && getTopicResults[topicCallHash] !== undefined) {
setTopicAuthorAddress(getTopicResults[topicCallHash].value[0]); setTopicAuthorAddress(getTopicResults[topicCallHash].value[0]);
setTopicAuthor(getTopicResults[topicCallHash].value[1]); setTopicAuthor(getTopicResults[topicCallHash].value[1]);
setTimeAgo(moment(getTopicResults[topicCallHash].value[2] * 1000).fromNow()); setTimeAgo(getTopicResults[topicCallHash].value[2] * 1000);
setNumberOfReplies(getTopicResults[topicCallHash].value[3].length); setNumberOfReplies(getTopicResults[topicCallHash].value[3].length);
} }
}, [getTopicResults, loading, topicCallHash]); }, [getTopicResults, loading, topicCallHash]);
@ -151,7 +151,13 @@ const TopicListRow = (props) => {
<Grid verticalAlign="middle"> <Grid verticalAlign="middle">
<Grid.Column floated="left" width={14}> <Grid.Column floated="left" width={14}>
{topicAuthor !== null && timeAgo !== null {topicAuthor !== null && timeAgo !== null
? t('topic.list.row.author.date', { author: topicAuthor, timeAgo }) ? (
<div>
{t('topic.list.row.author', { author: topicAuthor })}
,&nbsp;
<TimeAgo date={timeAgo} />
</div>
)
: <Placeholder><Placeholder.Line length="long" /></Placeholder>} : <Placeholder><Placeholder.Line length="long" /></Placeholder>}
</Grid.Column> </Grid.Column>
<Grid.Column floated="right" width={2} textAlign="right"> <Grid.Column floated="right" width={2} textAlign="right">

2
packages/concordia-app/src/constants/orbit/PostsDatabaseKeys.js
View File

@ -1,8 +1,6 @@
export const POST_SUBJECT = 'subject';
export const POST_CONTENT = 'content'; export const POST_CONTENT = 'content';
const postsDatabaseKeys = [ const postsDatabaseKeys = [
POST_SUBJECT,
POST_CONTENT, POST_CONTENT,
]; ];

3
packages/concordia-app/src/redux/sagas/peerDbReplicationSaga.js
View File

@ -12,7 +12,7 @@ import { FETCH_USER_DATABASE, UPDATE_ORBIT_DATA } from '../actions/peerDbReplica
import { POSTS_DATABASE, TOPICS_DATABASE, USER_DATABASE } from '../../constants/orbit/OrbitDatabases'; import { POSTS_DATABASE, TOPICS_DATABASE, USER_DATABASE } from '../../constants/orbit/OrbitDatabases';
import userDatabaseKeys from '../../constants/orbit/UserDatabaseKeys'; import userDatabaseKeys from '../../constants/orbit/UserDatabaseKeys';
import { TOPIC_SUBJECT } from '../../constants/orbit/TopicsDatabaseKeys'; import { TOPIC_SUBJECT } from '../../constants/orbit/TopicsDatabaseKeys';
import { POST_CONTENT, POST_SUBJECT } from '../../constants/orbit/PostsDatabaseKeys'; import { POST_CONTENT } from '../../constants/orbit/PostsDatabaseKeys';
function* fetchUserDb({ orbit, userAddress, dbName }) { function* fetchUserDb({ orbit, userAddress, dbName }) {
const peerDbAddress = yield call(determineKVAddress, { const peerDbAddress = yield call(determineKVAddress, {
@ -94,7 +94,6 @@ function* updateReduxState({ database }) {
...oldPostsUnchanged, ...oldPostsUnchanged,
...Object.entries(database.all).map(([key, value]) => ({ ...Object.entries(database.all).map(([key, value]) => ({
id: parseInt(key, 10), id: parseInt(key, 10),
[POST_SUBJECT]: value[POST_SUBJECT],
[POST_CONTENT]: value[POST_CONTENT], [POST_CONTENT]: value[POST_CONTENT],
})), })),
], ],

3
packages/concordia-app/src/views/Topic/TopicCreate/index.jsx
View File

@ -12,7 +12,7 @@ import { drizzle, breeze } from '../../../redux/store';
import { TRANSACTION_ERROR, TRANSACTION_SUCCESS } from '../../../constants/TransactionStatus'; import { TRANSACTION_ERROR, TRANSACTION_SUCCESS } from '../../../constants/TransactionStatus';
import { POSTS_DATABASE, TOPICS_DATABASE } from '../../../constants/orbit/OrbitDatabases'; import { POSTS_DATABASE, TOPICS_DATABASE } from '../../../constants/orbit/OrbitDatabases';
import { TOPIC_SUBJECT } from '../../../constants/orbit/TopicsDatabaseKeys'; import { TOPIC_SUBJECT } from '../../../constants/orbit/TopicsDatabaseKeys';
import { POST_CONTENT, POST_SUBJECT } from '../../../constants/orbit/PostsDatabaseKeys'; import { POST_CONTENT } from '../../../constants/orbit/PostsDatabaseKeys';
import { FORUM_CONTRACT } from '../../../constants/contracts/ContractNames'; import { FORUM_CONTRACT } from '../../../constants/contracts/ContractNames';
import { TOPIC_CREATED_EVENT } from '../../../constants/contracts/events/ForumContractEvents'; import { TOPIC_CREATED_EVENT } from '../../../constants/contracts/events/ForumContractEvents';
@ -74,7 +74,6 @@ const TopicCreate = (props) => {
.put(topicId, { [TOPIC_SUBJECT]: subjectInput }, { pin: true }) .put(topicId, { [TOPIC_SUBJECT]: subjectInput }, { pin: true })
.then(() => postsDb .then(() => postsDb
.put(postId, { .put(postId, {
[POST_SUBJECT]: subjectInput,
[POST_CONTENT]: contentInput, [POST_CONTENT]: contentInput,
}, { pin: true })) }, { pin: true }))
.then(() => { .then(() => {

5
yarn.lock
View File

@ -14396,6 +14396,11 @@ react-scripts@~3.4.3:
optionalDependencies: optionalDependencies:
fsevents "2.1.2" fsevents "2.1.2"
react-timeago@~5.2.0:
version "5.2.0"
resolved "https://registry.yarnpkg.com/react-timeago/-/react-timeago-5.2.0.tgz#d655d40aa55e4fe08a92234481a6aea7f656ab5d"
integrity sha512-wCEEDGQHMdFh/PLp+Hj5vk9ZoC4KjQ5u0u6+KrrY9rny5LqJ2gZvNNEAS4mhSZDV1i7JLgQI5VQTAux7f+vj2w==
react@~16.13.1: react@~16.13.1:
version "16.13.1" version "16.13.1"
resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e" resolved "https://registry.yarnpkg.com/react/-/react-16.13.1.tgz#2e818822f1a9743122c063d6410d85c1e3afe48e"

Write Preview
Loading…
Cancel
Save