sungjin

Add Like Post full service

1 -export const SERVER_BASE_URL = 'https://do.sungjin.dev';
...\ No newline at end of file ...\ No newline at end of file
1 +//export const SERVER_BASE_URL = 'https://do.sungjin.dev';
2 +export const SERVER_BASE_URL = "http://localhost:4000";
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -72,3 +72,16 @@ export const createComment = async (id, content) => { ...@@ -72,3 +72,16 @@ export const createComment = async (id, content) => {
72 } 72 }
73 return response.data; 73 return response.data;
74 } 74 }
75 +
76 +export const likePost = async (id) => {
77 + if (!await auth.validateToken()) {
78 + throw alert("Please login first.");
79 + }
80 + const response = await axios.post(`${SERVER_BASE_URL}/post/like/${id}`, {
81 + token: auth.getToken(),
82 + });
83 + if (response.status !== 200 && response.status !== 201) {
84 + throw new Error('Failed to like post!');
85 + }
86 + return response.data;
87 +}
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -7,6 +7,8 @@ import { Button } from "semantic-ui-react"; ...@@ -7,6 +7,8 @@ import { Button } from "semantic-ui-react";
7 import { run } from "../../api/runner"; 7 import { run } from "../../api/runner";
8 import { useSession } from "next-auth/client"; 8 import { useSession } from "next-auth/client";
9 import SyntaxHighlighter from 'react-syntax-highlighter'; 9 import SyntaxHighlighter from 'react-syntax-highlighter';
10 +import { ThumbUpIcon } from "@heroicons/react/solid";
11 +import { likePost } from "../../api/post";
10 12
11 const CodeEditor = dynamic( 13 const CodeEditor = dynamic(
12 () => import("@uiw/react-textarea-code-editor").then((mod) => mod.default), 14 () => import("@uiw/react-textarea-code-editor").then((mod) => mod.default),
...@@ -70,6 +72,16 @@ export default function Post() { ...@@ -70,6 +72,16 @@ export default function Post() {
70 setAnswer(`출력 : ${result}`); 72 setAnswer(`출력 : ${result}`);
71 } 73 }
72 74
75 + const like = async () => {
76 + if (useSession.accessToken == null) {
77 + alert("You need to login first!")
78 + router.push("/login")
79 + return;
80 + }
81 + const { id } = router.query
82 + setPost(await likePost(id));
83 + }
84 +
73 return ( 85 return (
74 <div className="ml-10 mr-10"> 86 <div className="ml-10 mr-10">
75 <h3 className="text-3xl font-bold">{post.title}</h3> 87 <h3 className="text-3xl font-bold">{post.title}</h3>
...@@ -102,7 +114,14 @@ export default function Post() { ...@@ -102,7 +114,14 @@ export default function Post() {
102 114
103 /> 115 />
104 </div> 116 </div>
105 - <div className="w-6/12 inline-block align-top">{post.explain}</div> 117 + <div className="w-6/12 inline-block align-top">
118 + <div className="w-full">{post.explain}</div>
119 + <Button className="bg-blue-500 rounded-full p-1 text-white " onClick={like}>
120 + <ThumbUpIcon className="h-5 inline-block mb-1 "></ThumbUpIcon>
121 + <span>{` Likes : ${post.likes}`}</span>
122 + </Button>
123 + </div>
124 +
106 <Button onClick={runCode} className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Run</Button> 125 <Button onClick={runCode} className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded">Run</Button>
107 <div className="">{answer}</div> 126 <div className="">{answer}</div>
108 <details> 127 <details>
......