ruidy/devbook_ts
1
0
Fork 0
mirror of https://github.com/rjNemo/devbook_ts synced 2026-06-12 13:36:43 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

postpage

Browse source
This commit is contained in:
Ruidy Nemausat 2020-05-12 21:52:42 +02:00
parent 8ce0341b27
commit ca5d5292b2
4 changed files with 50 additions and 61 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

30
src/models/Post.ts
View file

@ -1,13 +1,37 @@
import Comment from '../types/Comment'; import Comment from '../types/Comment';
interface Post { interface Post {
userID: string; // userID: string;
name: string; name: string;
text: string; text: string;
picture: string; picture: string;
likes: string[]; // likes: string[];
comments: Comment[]; comments: Comment[];
date: Date; // date: Date;
} }
export const dummyPost: Post = {
picture:
'https://www.gravatar.com/avatar/205e460b479e2e5b48aec07710c08d50?s=200',
name: 'John Doe',
text:
'Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint possimus corporis sunt necessitatibus! Minus nesciunt soluta suscipit nobis. Amet accusamus distinctio cupiditate blanditiis dolor? Illo perferendis eveniet cum cupiditate aliquam?',
comments: [
{
picture:
'https://www.gravatar.com/avatar/205e460b479e2e5b48aec07710c08d50?s=200',
name: 'John Doe',
text:
'Lorem ipsum dolor sit amet consectetur adipisicing elit. Sintpossimus corporis sunt necessitatibus! Minus nesciunt solutasuscipit nobis. Amet accusamus distinctio cupiditate blanditiis dolor? Illo perferendis eveniet cum cupiditate aliquam?',
},
{
picture:
'https://www.gravatar.com/avatar/205e460b479e2e5b48aec07710c08d50?s=200',
name: 'Ruidy Nemo',
text:
'Lorem ipsum dolor sit amet consectetur adipisicing elit. Sintpossimus corporis sunt necessitatibus! Minus nesciunt solutasuscipit nobis. Amet accusamus distinctio cupiditate blanditiis dolor? Illo perferendis eveniet cum cupiditate aliquam?',
},
],
};
export default Post; export default Post;

1
src/pages/EditProfile.tsx
View file

@ -1,5 +1,4 @@
import React, {FC} from 'react'; import React, {FC} from 'react';
import Header from '../components/Header';
import {FontAwesomeIcon} from '@fortawesome/react-fontawesome'; import {FontAwesomeIcon} from '@fortawesome/react-fontawesome';
import { import {
faTwitter, faTwitter,

62
src/pages/Post.tsx
View file

@ -1,28 +1,22 @@
import React, {FC} from 'react'; import React, {FC} from 'react';
import Post, {dummyPost as post} from '../models/Post';
import Comment from '../types/Comment';
const Post: FC = () => ( const PostPage: FC<Post> = () => (
<section className="container"> <section className="container">
<a href="posts.html" className="btn btn-light"> <a href="posts.html" className="btn btn-light">
Back To Posts Back To Posts
</a> </a>
<div className="post bg-white p-1 my-1"> <div className="post bg-white p-1 my-1">
<div> <div>
<a href="profile.html"> <a href="profile.html">
<img <img className="round-img" src={post.picture} alt={post.name} />
className="round-img" <h4>{post.name}</h4>
src="https://www.gravatar.com/avatar/205e460b479e2e5b48aec07710c08d50?s=200"
alt=""
/>
<h4>John Doe</h4>
</a> </a>
</div> </div>
<div> <div>
<p className="my-1"> <p className="my-1">{post.text}</p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint possimus
corporis sunt necessitatibus! Minus nesciunt soluta suscipit nobis.
Amet accusamus distinctio cupiditate blanditiis dolor? Illo
perferendis eveniet cum cupiditate aliquam?
</p>
</div> </div>
</div> </div>
@ -42,49 +36,21 @@ const Post: FC = () => (
</div> </div>
<div className="posts"> <div className="posts">
<div className="post bg-white p-1 my-1"> {post.comments.map((c: Comment, i: number) => (
<div className="post bg-white p-1 my-1" key={i}>
<div> <div>
<a href="profile.html"> <a href="profile.html">
<img <img className="round-img" src={c.picture} alt={c.name} />
className="round-img" <h4>{c.name}</h4>
src="https://www.gravatar.com/avatar/205e460b479e2e5b48aec07710c08d50?s=200"
alt=""
/>
<h4>John Doe</h4>
</a> </a>
</div> </div>
<div> <div>
<p className="my-1"> <p className="my-1">{c.text}</p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint
possimus corporis sunt necessitatibus! Minus nesciunt soluta
suscipit nobis. Amet accusamus distinctio cupiditate blanditiis
dolor? Illo perferendis eveniet cum cupiditate aliquam?
</p>
</div>
</div>
<div className="post bg-white p-1 my-1">
<div>
<a href="profile.html">
<img
className="round-img"
src="https://www.gravatar.com/avatar/205e460b479e2e5b48aec07710c08d50?s=200"
alt=""
/>
<h4>John Doe</h4>
</a>
</div>
<div>
<p className="my-1">
Lorem ipsum dolor sit amet consectetur adipisicing elit. Sint
possimus corporis sunt necessitatibus! Minus nesciunt soluta
suscipit nobis. Amet accusamus distinctio cupiditate blanditiis
dolor? Illo perferendis eveniet cum cupiditate aliquam?
</p>
</div> </div>
</div> </div>
))}
</div> </div>
</section> </section>
); );
export default Post; export default PostPage;

6
src/types/Comment.ts
View file

@ -1,9 +1,9 @@
interface Comment { interface Comment {
userID: string; // userID: string;
text: string; text: string;
name: string; name: string;
avatar: string; picture: string;
date: Date; // date: Date;
} }
export default Comment; export default Comment;