diff --git a/assets/eva-icons/post-actions/comment-active.png b/assets/eva-icons/post-actions/comment-active.png deleted file mode 100644 index c9a5a10..0000000 Binary files a/assets/eva-icons/post-actions/comment-active.png and /dev/null differ diff --git a/assets/eva-icons/post-actions/comment-full.png b/assets/eva-icons/post-actions/comment-full.png deleted file mode 100644 index 00951c8..0000000 Binary files a/assets/eva-icons/post-actions/comment-full.png and /dev/null differ diff --git a/assets/eva-icons/post-actions/comment-inactive.png b/assets/eva-icons/post-actions/comment-inactive.png deleted file mode 100644 index 6a44b47..0000000 Binary files a/assets/eva-icons/post-actions/comment-inactive.png and /dev/null differ diff --git a/assets/eva-icons/post-actions/comment.png b/assets/eva-icons/post-actions/comment.png deleted file mode 100644 index 87eb205..0000000 Binary files a/assets/eva-icons/post-actions/comment.png and /dev/null differ diff --git a/src/components/pages/feed.js b/src/components/pages/feed.js index 74a3a55..b2ee92d 100644 --- a/src/components/pages/feed.js +++ b/src/components/pages/feed.js @@ -12,6 +12,7 @@ const TEST_POSTS = [ id: 1, avatar: TEST_IMAGE, username: "njms", + replies_count: 3, favourited: false, reblogged: false, content: "Also learning Claire de Lune feels a lot like reading the communist manifesto", @@ -26,6 +27,7 @@ const TEST_POSTS = [ username: "njms", favourited: false, reblogged: false, + replies_count: 0, content: "Also learning Claire de Lune feels a lot like reading the communist manifesto", timestamp: 1596745156000, media_attachments: [ @@ -47,7 +49,7 @@ const FeedJsx = (props) => { - + You're all caught up. @@ -61,7 +63,7 @@ const FeedJsx = (props) => { - + ); }; @@ -98,4 +100,4 @@ const styles = { } }; -export default FeedJsx; \ No newline at end of file +export default FeedJsx; diff --git a/src/components/posts/post-action-bar.js b/src/components/posts/post-action-bar.js index 2712911..458cc9d 100644 --- a/src/components/posts/post-action-bar.js +++ b/src/components/posts/post-action-bar.js @@ -62,10 +62,6 @@ const PostActionBarJsx = (props) => { active: require("assets/eva-icons/post-actions/heart-active.png"), inactive: require("assets/eva-icons/post-actions/heart-inactive.png") }, - comment: { - active: require("assets/eva-icons/post-actions/comment-active.png"), - inactive: require("assets/eva-icons/post-actions/comment-inactive.png") - }, reblog: { active: require("assets/eva-icons/post-actions/reblog-active.png"), inactive: require("assets/eva-icons/post-actions/reblog-inactive.png") @@ -82,13 +78,7 @@ const PostActionBarJsx = (props) => { pack = { icons.heart } state = { state } callback = { () => favouritedCallback(state, setState) } /> - - commentCallback(state, setState) } /> - + { ) } +const SCREEN_WIDTH = Dimensions.get("window").width; const styles = { flexContainer: { display: "flex", flexDirection: "row", - padding: Dimensions.get("window").width / 40 + padding: SCREEN_WIDTH / 40 }, icon: { width: 30, height: 30, - marginRight: Dimensions.get("window").width / 20 + marginRight: SCREEN_WIDTH / 20 }, lastIcon: { marginLeft: "auto" diff --git a/src/components/posts/post.js b/src/components/posts/post.js index c08cd65..5fc6e48 100644 --- a/src/components/posts/post.js +++ b/src/components/posts/post.js @@ -18,6 +18,14 @@ const TEST_IMAGE = "https://cache.desktopnexus.com/thumbseg/2255/2255124-bigthum // This will be used in RawPostJsx const { SlideInMenu } = renderers; +function pluralize(n, singular, plural) { + if (n < 2) { + return singular; + } else { + return plural; + } +} + function getAutoHeight(w1, h1, w2) { /* Given the original dimensions and the new width, calculate what would @@ -44,7 +52,6 @@ function timeToAge(time1, time2) { */ const between = (n, lower, upper) => n >= lower && n < upper; - const pluralize = (n, singular, plural) => n < 2 ? singular : plural; const diff = time1 - time2; @@ -69,6 +76,17 @@ function timeToAge(time1, time2) { } export const RawPostJsx = (props) => { + const repliesCount = props.data.replies_count; + + let commentsText; + if (repliesCount == 0) { + commentsText = "View comments"; + } else { + commentsText = "View " + + repliesCount + + pluralize(repliesCount, " comment", " comments"); + } + return ( @@ -107,6 +125,12 @@ export const RawPostJsx = (props) => { { props.data.username } { props.data.content } + + + { commentsText } + + + { timeToAge((new Date()).getTime(), props.data.timestamp) } @@ -237,10 +261,13 @@ const styles = { caption: { padding: SCREEN_WIDTH / 24, }, + comments: { + paddingTop: SCREEN_WIDTH / 50, + color: "#666", + }, captionDate: { fontSize: "0.8em", color: "#666", - paddingTop: 10 } };