diff --git a/diskuy/.eslintcache b/diskuy/.eslintcache
index 342f299f6d92bcb49fdae01a8c93f5989120a297..acd94851027974329c7b33796939a1d29514edd9 100644
--- a/diskuy/.eslintcache
+++ b/diskuy/.eslintcache
@@ -1 +1 @@
-[{"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\index.js":"1","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\reportWebVitals.js":"2","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\App.js":"3","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Navbar.js":"4","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Profile\\Profile.js":"5","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Topic.js":"6","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\TopicList.js":"7","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\ListThreads.js":"8","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\Thread.js":"9","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Form.js":"10","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\Post.js":"11","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Button.js":"12","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\hooks\\input-hook.js":"13","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\CommentList.js":"14","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\ThreadList.js":"15","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\PreviewThread.js":"16"},{"size":517,"mtime":1608489407339,"results":"17","hashOfConfig":"18"},{"size":375,"mtime":1608489407340,"results":"19","hashOfConfig":"18"},{"size":855,"mtime":1609671879086,"results":"20","hashOfConfig":"18"},{"size":943,"mtime":1609624158939,"results":"21","hashOfConfig":"18"},{"size":1864,"mtime":1609671879113,"results":"22","hashOfConfig":"18"},{"size":1429,"mtime":1609671615513,"results":"23","hashOfConfig":"18"},{"size":734,"mtime":1609624159220,"results":"24","hashOfConfig":"18"},{"size":703,"mtime":1609624159124,"results":"25","hashOfConfig":"18"},{"size":3597,"mtime":1609671615504,"results":"26","hashOfConfig":"18"},{"size":1661,"mtime":1609671879111,"results":"27","hashOfConfig":"18"},{"size":2544,"mtime":1609671615502,"results":"28","hashOfConfig":"18"},{"size":310,"mtime":1609672020693,"results":"29","hashOfConfig":"18"},{"size":374,"mtime":1609624159225,"results":"30","hashOfConfig":"18"},{"size":718,"mtime":1609671615484,"results":"31","hashOfConfig":"18"},{"size":404,"mtime":1609671615456,"results":"32","hashOfConfig":"18"},{"size":751,"mtime":1609671879114,"results":"33","hashOfConfig":"18"},{"filePath":"34","messages":"35","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},"3m9re2",{"filePath":"37","messages":"38","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"39","messages":"40","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"41","messages":"42","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"43","messages":"44","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"45","messages":"46","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"47","messages":"48","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"49","messages":"50","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"53","usedDeprecatedRules":"36"},{"filePath":"54","messages":"55","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"56","usedDeprecatedRules":"36"},{"filePath":"57","messages":"58","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"59","messages":"60","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"61","messages":"62","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"63","messages":"64","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"65","messages":"66","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"67","messages":"68","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"69","usedDeprecatedRules":"36"},"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\index.js",[],["70","71"],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\reportWebVitals.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\App.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Navbar.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Profile\\Profile.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Topic.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\TopicList.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\ListThreads.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\Thread.js",["72"],"import React, { useState, useEffect, useCallback } from \"react\";\r\nimport './Thread.css';\r\nimport CommentList from './CommentList';\r\nimport Post from './Post';\r\nimport Button from '../Button';\r\nimport { useInput } from '../hooks/input-hook';\r\nimport axios from 'axios';\r\n\r\nconst LINK = 'http://localhost:4000/';\r\n\r\nexport default function Thread(props){\r\n const [thread, setThread] = useState({\r\n content : \"\",\r\n id:\"\",\r\n points:0,\r\n title:\"\",\r\n topic_id:\"\",\r\n user_id:\"\",\r\n updated_at: \"\"\r\n });\r\n\r\n const [comment, setComment] = useState([{\r\n message : \"\",\r\n points: 0,\r\n status: \"\",\r\n thread_id: \"\",\r\n post_parent_id: \"\",\r\n user_id:\"\",\r\n updated_at: \"\"\r\n }]);\r\n\r\n const { value: input, bind: bindInput, reset: resetInput } = useInput('');\r\n const topicParm = props.match.params.topic;\r\n const threadParm = props.match.params.thread;\r\n\r\n const refreshComment = useCallback(() => {\r\n const fetch = async () => {\r\n const responseComment = await axios.get(`${LINK}/api/post/`);\r\n const responseCommentData = responseComment.data.data.filter(comments => comments.thread_id == threadParm);\r\n setComment(responseCommentData);\r\n }\r\n fetch();\r\n }, [threadParm]);\r\n\r\n useEffect(() => {\r\n const fetch = async () => {\r\n const responseThread = await axios.get(`${LINK}/api/threads/${threadParm}`);\r\n const responseThreadData = responseThread.data.data;\r\n setThread(responseThreadData);\r\n\r\n refreshComment();\r\n }\r\n fetch();\r\n }, [threadParm]);\r\n\r\n const handleSubmit = async (event) => {\r\n event.preventDefault();\r\n\r\n try {\r\n await axios.post(`${LINK}api/post`, {\r\n post : {\r\n message : input,\r\n points : 0,\r\n status : 'iniapa',\r\n thread_id : threadParm,\r\n post_parent_id: \"\",\r\n user_id : 1\r\n }\r\n })\r\n refreshComment();\r\n } catch (error) {}\r\n resetInput();\r\n };\r\n\r\n\r\n return (\r\n <div>\r\n <div>\r\n <Post \r\n type=\"thread\"\r\n text={thread.content} \r\n header={thread.title} \r\n user=\"Hello guys David disini\" \r\n points={thread.point}\r\n id={thread.id}\r\n user_id={thread.user_id}\r\n thread_id={thread.thread_id}\r\n topic_id={thread.topic_id}\r\n time={thread.updated_at}/>\r\n <h2 className='commentText'>Comment</h2>\r\n </div>\r\n\r\n <CommentList comment={comment} thread_id={threadParm} topic_id={topicParm}></CommentList>\r\n\r\n <div id=\"addCommentSection\">\r\n <h3>Add New Comment</h3>\r\n <form onSubmit={handleSubmit}>\r\n <textarea className=\"form-control commentBox\" cols=\"70\" rows=\"5\" \r\n {...bindInput}> \r\n </textarea>\r\n {/* <Button \r\n type=\"button\" \r\n text=\"Add Comment\" \r\n color=\"btn-primary btn_cancel\"></Button> */}\r\n <button className=\"btn btn-primary btn_cancel\" id=\"addCommentButton\" type=\"submit\">Add Comment</button>\r\n </form>\r\n </div>\r\n </div>\r\n )\r\n}","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Form.js",["73"],"import axios from \"axios\";\r\nimport React from \"react\";\r\nimport { useInput } from './hooks/input-hook';\r\nimport './Form.css';\r\n\r\nconst LINK = 'http://localhost:4000';\r\n\r\nexport default function Form(props){\r\n const { value: title, bind: bindTitle, reset: resetTitle } = useInput('')\r\n const { value: body, bind: bindBody, reset: resetBody } = useInput('')\r\n\r\n const topicParam = props.match.params.topic\r\n\r\n const handleSubmit = async (event) => {\r\n event.preventDefault();\r\n\r\n try {\r\n const responseTopics = await axios.get(`${LINK}/api/topics`)\r\n const topic = responseTopics.data.data.find(topic => topic.name === topicParam).id\r\n const response = await axios.post(`${LINK}/api/threads`, {\r\n thread: {\r\n content : body,\r\n points : 0,\r\n title : title,\r\n topic_id : topic,\r\n user_id : 1\r\n }\r\n })\r\n props.history.push(`/${topicParam}`)\r\n }\r\n catch(error){\r\n\r\n }\r\n resetBody(); \r\n resetTitle();\r\n }\r\n\r\n return (\r\n <form onSubmit={handleSubmit}>\r\n <div className=\"form_container\">\r\n <label for=\"title\">Title</label>\r\n <input type='text' name=\"title\" placeholder=\"Your threads title\" required=\"false\" {...bindTitle}/>\r\n <label for=\"body\">Body</label>\r\n <input type='text' name=\"body\" placeholder=\"Tulis\" required=\"false\" {...bindBody}/>\r\n <input type=\"submit\" value=\"Submit\"/>\r\n </div>\r\n </form>\r\n )\r\n}\r\n","F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\Post.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Button.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\hooks\\input-hook.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\CommentList.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\ThreadList.js",[],"F:\\Jonathan\\Kuliah\\Pemfung\\diskuy\\diskuy\\src\\Threads\\PreviewThread.js",["74","75"],"import React from \"react\";\r\n\r\nimport axios from \"axios\";\r\n\r\nconst LINK = 'http://localhost:4000';\r\n\r\n\r\nfunction PreviewThread (props) {\r\n\r\n // const userName = await axios.get(`${LINK}/api/threads/${props.user_id}`);\r\n // const topic_id = `${props.topic_id}`\r\n // const topicName = await axios.get(`${LINK}/api/topics/${props.topic_id}`).data.data.find(topic => topic.name === topic_id).id\r\n return (\r\n <div className=\"thread_container\">\r\n <h1>{props.title}</h1>\r\n <div className=\"label\">\r\n <h2>{props.topic_id}</h2>\r\n </div>\r\n <div className=\"info\">\r\n <h3>{props.timestamp}</h3>\r\n </div>\r\n </div>\r\n )\r\n}\r\n\r\nexport default PreviewThread;",{"ruleId":"76","replacedBy":"77"},{"ruleId":"78","replacedBy":"79"},{"ruleId":"80","severity":1,"message":"81","line":35,"column":105,"nodeType":"82","messageId":"83","endLine":35,"endColumn":107},{"ruleId":"84","severity":1,"message":"85","line":20,"column":19,"nodeType":"86","messageId":"87","endLine":20,"endColumn":27},{"ruleId":"84","severity":1,"message":"88","line":3,"column":8,"nodeType":"86","messageId":"87","endLine":3,"endColumn":13},{"ruleId":"84","severity":1,"message":"89","line":5,"column":7,"nodeType":"86","messageId":"87","endLine":5,"endColumn":11},"no-native-reassign",["90"],"no-negated-in-lhs",["91"],"eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","no-unused-vars","'response' is assigned a value but never used.","Identifier","unusedVar","'axios' is defined but never used.","'LINK' is assigned a value but never used.","no-global-assign","no-unsafe-negation"]
\ No newline at end of file
+[{"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\index.js":"1","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\reportWebVitals.js":"2","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\App.js":"3","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Topic.js":"4","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Navbar.js":"5","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Button.js":"6","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\TopicList.js":"7","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Form.js":"8","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\hooks\\input-hook.js":"9","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Thread.js":"10","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\ListThreads.js":"11","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Profile\\Profile.js":"12","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Post.js":"13","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\CommentList.js":"14","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\ThreadList.js":"15","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\PreviewThread.js":"16"},{"size":517,"mtime":1608228708909,"results":"17","hashOfConfig":"18"},{"size":375,"mtime":1608228708909,"results":"19","hashOfConfig":"18"},{"size":855,"mtime":1609674995190,"results":"20","hashOfConfig":"18"},{"size":1429,"mtime":1609670377379,"results":"21","hashOfConfig":"18"},{"size":943,"mtime":1609612143895,"results":"22","hashOfConfig":"18"},{"size":310,"mtime":1609674995191,"results":"23","hashOfConfig":"18"},{"size":734,"mtime":1609604488520,"results":"24","hashOfConfig":"18"},{"size":1661,"mtime":1609674995193,"results":"25","hashOfConfig":"18"},{"size":374,"mtime":1609495708947,"results":"26","hashOfConfig":"18"},{"size":3717,"mtime":1609674275237,"results":"27","hashOfConfig":"18"},{"size":703,"mtime":1609612143908,"results":"28","hashOfConfig":"18"},{"size":1864,"mtime":1609674995194,"results":"29","hashOfConfig":"18"},{"size":1325,"mtime":1609673984957,"results":"30","hashOfConfig":"18"},{"size":718,"mtime":1609663316552,"results":"31","hashOfConfig":"18"},{"size":404,"mtime":1609674083165,"results":"32","hashOfConfig":"18"},{"size":751,"mtime":1609674995195,"results":"33","hashOfConfig":"18"},{"filePath":"34","messages":"35","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},"1e00zfu",{"filePath":"37","messages":"38","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"39","messages":"40","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"41","messages":"42","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"43","messages":"44","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"45","usedDeprecatedRules":"36"},{"filePath":"46","messages":"47","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":"48","usedDeprecatedRules":"36"},{"filePath":"49","messages":"50","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"53","usedDeprecatedRules":"36"},{"filePath":"54","messages":"55","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"56","messages":"57","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"58","messages":"59","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"60","messages":"61","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"36"},{"filePath":"62","messages":"63","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"64","messages":"65","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"66","messages":"67","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"68","messages":"69","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\index.js",[],["70","71"],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\reportWebVitals.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\App.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Topic.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Navbar.js",["72"],"import React from \"react\";\r\nimport {ReactComponent as DiskuyLogo} from './Logo.svg';\r\nimport './Navbar.css';\r\nimport {\r\n Link\r\n } from \"react-router-dom\"\r\n\r\nconst Navbar = () => {\r\n return (\r\n <nav id = \"navbar\" className='navbar navbar-expand-lg navbar-light position-sticky fixed-top'>\r\n <a className=\"navbar-brand\" href=\"\">\r\n <div className=\"d-flex align-items-center\">\r\n <Link to=\"/\"><DiskuyLogo /></Link>\r\n </div>\r\n </a>\r\n <ul className=\"navbar-nav ml-auto\">\r\n <li className=\"nav-item ml-auto\">\r\n <Link to=\"/topic\" className=\"nav-link\"><b>Home</b></Link>\r\n </li>\r\n <li className=\"nav-item ml-auto\">\r\n <Link to=\"/thread\" className=\"nav-link\"><b>Threads</b></Link>\r\n </li>\r\n <li className=\"nav-item ml-auto\">\r\n <Link to=\"/profile\" className=\"nav-link\"><b>Profile</b></Link>\r\n </li>\r\n </ul>\r\n </nav>\r\n );\r\n}\r\n\r\nexport default Navbar;\r\n","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Button.js",["73","74"],"import React from \"react\";\r\nimport './Button.css';\r\nimport {\r\n Link\r\n } from \"react-router-dom\"\r\n\r\nfunction Button(props) {\r\n return (\r\n <Link to={`/${props.url}`}>\r\n <button className={`button ${props.color}`}>{props.text}</button>\r\n </Link>\r\n )\r\n}\r\n\r\nexport default Button;","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\TopicList.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Form.js",["75"],"import axios from \"axios\";\r\nimport React from \"react\";\r\nimport { useInput } from './hooks/input-hook';\r\n\r\nconst LINK = 'http://localhost:4000';\r\n\r\nexport default function Form(props){\r\n const { value: title, bind: bindTitle, reset: resetTitle } = useInput('')\r\n const { value: body, bind: bindBody, reset: resetBody } = useInput('')\r\n\r\n const topicParam = props.match.params.topic\r\n\r\n const handleSubmit = async (event) => {\r\n event.preventDefault();\r\n\r\n try {\r\n const responseTopics = await axios.get(`${LINK}/api/topics`)\r\n const topic = responseTopics.data.data.find(topic => topic.name === topicParam).id\r\n const response = await axios.post(`${LINK}/api/threads`, {\r\n thread: {\r\n content : body,\r\n points : 0,\r\n title : title,\r\n topic_id : topic,\r\n user_id : 1\r\n }\r\n })\r\n props.history.push(`/${topicParam}`)\r\n }\r\n catch(error){\r\n\r\n }\r\n resetBody(); \r\n resetTitle();\r\n }\r\n\r\n return (\r\n <form onSubmit={handleSubmit}>\r\n <label>\r\n Title:\r\n <input type='text' {...bindTitle}/>\r\n </label>\r\n <label>\r\n Body:\r\n <input type='text' {...bindBody}/>\r\n </label>\r\n <input type=\"submit\" value=\"Submit\"/>\r\n </form>\r\n )\r\n}","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\hooks\\input-hook.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Thread.js",["76","77"],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\ListThreads.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Profile\\Profile.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Post.js",["78"],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\CommentList.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\ThreadList.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\PreviewThread.js",["79","80"],{"ruleId":"81","replacedBy":"82"},{"ruleId":"83","replacedBy":"84"},{"ruleId":"85","severity":1,"message":"86","line":11,"column":13,"nodeType":"87","endLine":11,"endColumn":49},{"ruleId":"88","severity":1,"message":"89","line":8,"column":18,"nodeType":"90","messageId":"91","endLine":8,"endColumn":20},{"ruleId":"88","severity":1,"message":"89","line":14,"column":23,"nodeType":"90","messageId":"91","endLine":14,"endColumn":25},{"ruleId":"92","severity":1,"message":"93","line":19,"column":19,"nodeType":"94","messageId":"95","endLine":19,"endColumn":27},{"ruleId":"88","severity":1,"message":"89","line":38,"column":105,"nodeType":"90","messageId":"91","endLine":38,"endColumn":107},{"ruleId":"96","severity":1,"message":"97","line":62,"column":8,"nodeType":"98","endLine":62,"endColumn":20,"suggestions":"99"},{"ruleId":"88","severity":1,"message":"89","line":10,"column":27,"nodeType":"90","messageId":"91","endLine":10,"endColumn":29},{"ruleId":"92","severity":1,"message":"100","line":3,"column":8,"nodeType":"94","messageId":"95","endLine":3,"endColumn":13},{"ruleId":"92","severity":1,"message":"101","line":5,"column":7,"nodeType":"94","messageId":"95","endLine":5,"endColumn":11},"no-native-reassign",["102"],"no-negated-in-lhs",["103"],"jsx-a11y/anchor-is-valid","The href attribute requires a valid value to be accessible. Provide a valid, navigable address as the href value. If you cannot provide a valid href, but still need the element to resemble a link, use a button and change it with appropriate styles. Learn more: https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/anchor-is-valid.md","JSXOpeningElement","eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","no-unused-vars","'response' is assigned a value but never used.","Identifier","unusedVar","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'refreshComment'. Either include it or remove the dependency array.","ArrayExpression",["104"],"'axios' is defined but never used.","'LINK' is assigned a value but never used.","no-global-assign","no-unsafe-negation",{"desc":"105","fix":"106"},"Update the dependencies array to be: [refreshComment, threadParm]",{"range":"107","text":"108"},[1842,1854],"[refreshComment, threadParm]"]
\ No newline at end of file
diff --git a/diskuy/src/Threads/Post.js b/diskuy/src/Threads/Post.js
index 7e61626e5f2a9f66c8298c2b9fffd760e4d94463..db6eacd79bc2b11a102d0e177592e1473318ea95 100644
--- a/diskuy/src/Threads/Post.js
+++ b/diskuy/src/Threads/Post.js
@@ -18,51 +18,22 @@ export default function Post(props){
} catch (error) {}
}
- const scrollBottom = () => {
- window.scrollTo(
- {
- top: document.documentElement.scrollHeight,
- behavior: 'smooth'
- });
- }
-
- if(props.type=="thread") {
- return (
- <div id="post">
- <div id="postHeader">
- <div id="headerData">
- <div id="round"></div>
- <p id="creator">By {props.user} - {props.time} </p>
- </div>
- <div id="headerButton">
- <button type="button" className="btn btn-outline-danger deleteButton" onClick={() => deletePost(props)}>Delete</button>
- </div>
+ return (
+ <div id="post">
+ <div id="postHeader">
+ <div id="headerData">
+ <div id="round"></div>
+ <p id="creator">By {props.user} - {props.time} </p>
</div>
- <div id="postContent">
- <h1 id="judul">{props.header}</h1>
- <p id="isi">{props.text}</p>
- <p className='inline'>{props.points}</p>
- <button type="button" className="btn btn-primary btn_cancel" onClick={scrollBottom}>Comment</button>
+ <div id="headerButton">
+ <button type="button" className="btn btn-outline-danger deleteButton" onClick={() => deletePost(props)}>Delete</button>
</div>
</div>
- )
- } else if (props.type == "comment") {
- return (
- <div id="comment">
- <div id="commentHeader">
- <div id="headerData">
- <div id="round"></div>
- <p id="creator">By {props.user} - {props.time} </p>
- </div>
- <div id="headerButton">
- <button type="button" className="btn btn-outline-danger deleteButton" onClick={() => deletePost(props)}>Delete</button>
- </div>
- </div>
- <div id="commentContent">
- <p id="isi">{props.text}</p>
- <p className='inline'>{props.points}</p>
- </div>
+ <div id="postContent">
+ <h1 id="judul">{props.header}</h1>
+ <p id="isi">{props.text}</p>
+ <p className='inline'>{props.points}</p>
</div>
- )
- }
+ </div>
+ )
}
\ No newline at end of file
diff --git a/diskuy/src/Threads/Thread.css b/diskuy/src/Threads/Thread.css
index ab40a28fa0fed03e725716d7268ee6b358eb812a..4fa1fd5a315bfa6a8db1d348b0af4b56493138a9 100644
--- a/diskuy/src/Threads/Thread.css
+++ b/diskuy/src/Threads/Thread.css
@@ -37,4 +37,9 @@
margin-right: auto;
margin-bottom: 20px;
width: 160px;
+}
+
+.scrollButton {
+ margin-top: 20px;
+ margin-left: 100px;
}
\ No newline at end of file
diff --git a/diskuy/src/Threads/Thread.js b/diskuy/src/Threads/Thread.js
index 3f00baa6aff623a8fdd2b0a333d70c4b09064add..2db9294c741f5633a585962a3f22e3cb309df1ce 100644
--- a/diskuy/src/Threads/Thread.js
+++ b/diskuy/src/Threads/Thread.js
@@ -2,7 +2,6 @@ import React, { useState, useEffect, useCallback } from "react";
import './Thread.css';
import CommentList from './CommentList';
import Post from './Post';
-import Button from '../Button';
import { useInput } from '../hooks/input-hook';
import axios from 'axios';
@@ -42,6 +41,15 @@ export default function Thread(props){
fetch();
}, [threadParm]);
+ const scrollBottom = () => {
+ window.scrollTo(
+ {
+ top: document.documentElement.scrollHeight,
+ behavior: 'smooth'
+ }
+ );
+ }
+
useEffect(() => {
const fetch = async () => {
const responseThread = await axios.get(`${LINK}/api/threads/${threadParm}`);
@@ -87,9 +95,11 @@ export default function Thread(props){
thread_id={thread.thread_id}
topic_id={thread.topic_id}
time={thread.updated_at}/>
- <h2 className='commentText'>Comment</h2>
</div>
+ <button type="button" className="btn btn-primary btn_cancel scrollButton" onClick={scrollBottom}>Add New Comment</button>
+ <h2 className='commentText'>Comment</h2>
+
<CommentList comment={comment} thread_id={threadParm} topic_id={topicParm}></CommentList>
<div id="addCommentSection">
@@ -98,10 +108,6 @@ export default function Thread(props){
<textarea className="form-control commentBox" cols="70" rows="5"
{...bindInput}>
</textarea>
- {/* <Button
- type="button"
- text="Add Comment"
- color="btn-primary btn_cancel"></Button> */}
<button className="btn btn-primary btn_cancel" id="addCommentButton" type="submit">Add Comment</button>
</form>
</div>