58 lines
1.2 KiB
TypeScript
58 lines
1.2 KiB
TypeScript
import { useState, useEffect } from 'react';
|
|
import StaticPost from "./staticPost";
|
|
|
|
export interface PostContent {
|
|
id: number,
|
|
title: string,
|
|
content: string,
|
|
userId: number,
|
|
parentId: number,
|
|
createdAt: string,
|
|
author: {
|
|
name: string,
|
|
display_name: string,
|
|
id: number
|
|
},
|
|
replies: any[];
|
|
_count: {
|
|
replies: number;
|
|
};
|
|
}
|
|
|
|
export interface PostProps {
|
|
postId: number;
|
|
}
|
|
|
|
|
|
export default function Post({ postId }: PostProps) {
|
|
const [postContent, setPostContent] = useState<PostContent>();
|
|
const [isLoading, setIsLoading] = useState(true);
|
|
|
|
useEffect(() => {
|
|
const fetchPost = async () => {
|
|
const response = await fetch(`http://localhost:8787/posts/${postId}/view`);
|
|
const jsonContent: Array<PostContent> = await response.json();
|
|
|
|
let newPostContent: PostContent = jsonContent[0] as PostContent;
|
|
|
|
if (newPostContent) {
|
|
setPostContent(newPostContent);
|
|
setIsLoading(false);
|
|
}
|
|
};
|
|
fetchPost();
|
|
}, []);
|
|
|
|
if (isLoading) {
|
|
return <div>Loading...</div>;
|
|
}
|
|
|
|
if (!postContent) {
|
|
return <p>Failed to load!</p>;
|
|
}
|
|
|
|
|
|
return (
|
|
<StaticPost postContent={postContent} />
|
|
)
|
|
}
|