diff --git a/diskuy/.eslintcache b/diskuy/.eslintcache
index dc06ed4c2f7bc8994ebd5ad9d64c740ef9d05f28..ecc3a73a0fc12f4bded2873f94aa76289524425d 100644
--- a/diskuy/.eslintcache
+++ b/diskuy/.eslintcache
@@ -1 +1 @@
-[{"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\\Comment.js":"13","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Post.js":"14"},{"size":517,"mtime":1608228708909,"results":"15","hashOfConfig":"16"},{"size":375,"mtime":1608228708909,"results":"17","hashOfConfig":"16"},{"size":837,"mtime":1609612143893,"results":"18","hashOfConfig":"16"},{"size":1139,"mtime":1609612903308,"results":"19","hashOfConfig":"16"},{"size":943,"mtime":1609612143895,"results":"20","hashOfConfig":"16"},{"size":472,"mtime":1609612143894,"results":"21","hashOfConfig":"16"},{"size":734,"mtime":1609604488520,"results":"22","hashOfConfig":"16"},{"size":1490,"mtime":1609604488519,"results":"23","hashOfConfig":"16"},{"size":374,"mtime":1609495708947,"results":"24","hashOfConfig":"16"},{"size":3215,"mtime":1609612930247,"results":"25","hashOfConfig":"16"},{"size":703,"mtime":1609612143908,"results":"26","hashOfConfig":"16"},{"size":725,"mtime":1609612143948,"results":"27","hashOfConfig":"16"},{"size":477,"mtime":1609612143944,"results":"28","hashOfConfig":"16"},{"size":514,"mtime":1609612143941,"results":"29","hashOfConfig":"16"},{"filePath":"30","messages":"31","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},"1e00zfu",{"filePath":"33","messages":"34","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"35","messages":"36","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"37","messages":"38","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"39","messages":"40","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"41","usedDeprecatedRules":"32"},{"filePath":"42","messages":"43","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"44","messages":"45","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"46","messages":"47","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"48","usedDeprecatedRules":"32"},{"filePath":"49","messages":"50","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"53","messages":"54","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"55","messages":"56","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"57","messages":"58","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"59","messages":"60","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\index.js",[],["61","62"],"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",["63"],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Navbar.js",["64"],"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",[],"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",["65"],"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",["66"],"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\\Comment.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Post.js",[],{"ruleId":"67","replacedBy":"68"},{"ruleId":"69","replacedBy":"70"},{"ruleId":"71","severity":1,"message":"72","line":3,"column":8,"nodeType":"73","messageId":"74","endLine":3,"endColumn":14},{"ruleId":"75","severity":1,"message":"76","line":11,"column":13,"nodeType":"77","endLine":11,"endColumn":49},{"ruleId":"71","severity":1,"message":"78","line":19,"column":19,"nodeType":"73","messageId":"74","endLine":19,"endColumn":27},{"ruleId":"79","severity":1,"message":"80","line":35,"column":105,"nodeType":"81","messageId":"82","endLine":35,"endColumn":107},"no-native-reassign",["83"],"no-negated-in-lhs",["84"],"no-unused-vars","'Thread' is defined but never used.","Identifier","unusedVar","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","'response' is assigned a value but never used.","eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","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\\Comment.js":"13","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Post.js":"14","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\CommentList.js":"15"},{"size":517,"mtime":1608228708909,"results":"16","hashOfConfig":"17"},{"size":375,"mtime":1608228708909,"results":"18","hashOfConfig":"17"},{"size":837,"mtime":1609612143893,"results":"19","hashOfConfig":"17"},{"size":1139,"mtime":1609612903308,"results":"20","hashOfConfig":"17"},{"size":943,"mtime":1609612143895,"results":"21","hashOfConfig":"17"},{"size":472,"mtime":1609612143894,"results":"22","hashOfConfig":"17"},{"size":734,"mtime":1609604488520,"results":"23","hashOfConfig":"17"},{"size":1490,"mtime":1609604488519,"results":"24","hashOfConfig":"17"},{"size":374,"mtime":1609495708947,"results":"25","hashOfConfig":"17"},{"size":3160,"mtime":1609659856831,"results":"26","hashOfConfig":"17"},{"size":703,"mtime":1609612143908,"results":"27","hashOfConfig":"17"},{"size":725,"mtime":1609612143948,"results":"28","hashOfConfig":"17"},{"size":1050,"mtime":1609661277062,"results":"29","hashOfConfig":"17"},{"size":501,"mtime":1609659869366,"results":"30","hashOfConfig":"17"},{"size":687,"mtime":1609660496855,"results":"31","hashOfConfig":"17"},{"filePath":"32","messages":"33","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},"1e00zfu",{"filePath":"35","messages":"36","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"37","messages":"38","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"39","messages":"40","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"41","usedDeprecatedRules":"34"},{"filePath":"42","messages":"43","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"44","usedDeprecatedRules":"34"},{"filePath":"45","messages":"46","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"47","messages":"48","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"49","messages":"50","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"51","usedDeprecatedRules":"34"},{"filePath":"52","messages":"53","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"54","messages":"55","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"56","messages":"57","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"58","messages":"59","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"60","messages":"61","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"62","messages":"63","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"64","messages":"65","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\index.js",[],["66","67"],"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",["68"],"import React, { useEffect, useState } from \"react\";\r\nimport axios from 'axios'\r\nimport Thread from './Threads/Thread'\r\n\r\nimport { Link } from \"react-router-dom\"\r\n\r\nconst LINK = 'http://localhost:4000';\r\n\r\nexport default function Topic(props){\r\n const [thread, setThread] = useState([])\r\n const topicParam = props.match.params.topic\r\n\r\n useEffect(() => {\r\n const fetch = async () => {\r\n const responseThreads = await axios.get(`${LINK}/api/threads/`)\r\n const responseTopics = await axios.get(`${LINK}/api/topics`)\r\n \r\n const topic = responseTopics.data.data.find(topic => topic.name === topicParam).id\r\n const threads = responseThreads.data.data.filter(thread => thread.topic_id === topic)\r\n\r\n setThread(threads)\r\n \r\n }\r\n fetch() \r\n }, [topicParam])\r\n\r\n return (\r\n <div>\r\n <ul>\r\n {thread.map((value) => (\r\n <li>\r\n <Link to={`/${topicParam}/${value.id}`}>{value.title}</Link>\r\n </li>\r\n ))}\r\n </ul>\r\n </div>\r\n )\r\n}","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Navbar.js",["69"],"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",[],"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",["70"],"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",["71","72"],"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\\Comment.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\Post.js",[],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\CommentList.js",[],{"ruleId":"73","replacedBy":"74"},{"ruleId":"75","replacedBy":"76"},{"ruleId":"77","severity":1,"message":"78","line":3,"column":8,"nodeType":"79","messageId":"80","endLine":3,"endColumn":14},{"ruleId":"81","severity":1,"message":"82","line":11,"column":13,"nodeType":"83","endLine":11,"endColumn":49},{"ruleId":"77","severity":1,"message":"84","line":19,"column":19,"nodeType":"79","messageId":"80","endLine":19,"endColumn":27},{"ruleId":"85","severity":1,"message":"86","line":38,"column":105,"nodeType":"87","messageId":"88","endLine":38,"endColumn":107},{"ruleId":"89","severity":1,"message":"90","line":53,"column":8,"nodeType":"91","endLine":53,"endColumn":20,"suggestions":"92"},"no-native-reassign",["93"],"no-negated-in-lhs",["94"],"no-unused-vars","'Thread' is defined but never used.","Identifier","unusedVar","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","'response' is assigned a value but never used.","eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'refreshComment'. Either include it or remove the dependency array.","ArrayExpression",["95"],"no-global-assign","no-unsafe-negation",{"desc":"96","fix":"97"},"Update the dependencies array to be: [refreshComment, threadParm]",{"range":"98","text":"99"},[1633,1645],"[refreshComment, threadParm]"]
\ No newline at end of file
diff --git a/diskuy/src/Threads/Comment.css b/diskuy/src/Threads/Comment.css
index 29faeb13faec9cf22109816fa75bf5b248c1b645..ed1e2a220050f38627b0db229b13e477f04c4df8 100644
--- a/diskuy/src/Threads/Comment.css
+++ b/diskuy/src/Threads/Comment.css
@@ -24,9 +24,22 @@
border-radius: 8px 8px 0px 0px;
display: flex;
flex-direction: row;
+ justify-content: space-between;
padding-left: 20px;
}
+#headerData {
+ display: flex;
+ flex-direction: row;
+}
+
+#headerButton {
+ margin-top: auto;
+ margin-bottom: auto;
+ margin-right: 20px;
+ height: 36px;
+}
+
#creator {
margin-top: 30px;
margin-left: 12px;
@@ -40,6 +53,10 @@
padding-bottom: 20px;
}
+.deleteButton {
+ margin: 0;
+}
+
#isi {
margin: 0;
}
\ No newline at end of file
diff --git a/diskuy/src/Threads/Comment.js b/diskuy/src/Threads/Comment.js
index d1234ab71749988e820125f686157b7b8743de4a..c3920f47ed99b60b8277e8a23e2850e61dce8432 100644
--- a/diskuy/src/Threads/Comment.js
+++ b/diskuy/src/Threads/Comment.js
@@ -1,14 +1,32 @@
import './Comment.css';
+import axios from 'axios';
+
+const LINK = 'http://localhost:4000/';
export default function Comment(props){
+
+ const deleteComment = async (event) => {
+ try {
+ await axios.delete(`${LINK}api/post/${event}`);
+ window.location.reload();
+ } catch (error) {}
+ }
+
+ console.log(props.id)
+
return (
<div id="comment">
<div id="commentHeader">
- <div id="round"></div>
- <p id="creator">By {props.user} - 12 December 2020, 12:12AM </p>
+ <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={() => deleteComment(props.id)}>Delete</button>
+ </div>
</div>
<div id="commentContent">
- <p id="isi">{props.text}</p>
+ <p id="isi">{props.text}</p>
<p className='inline'>{props.points}</p>
</div>
</div>
diff --git a/diskuy/src/Threads/CommentList.js b/diskuy/src/Threads/CommentList.js
new file mode 100644
index 0000000000000000000000000000000000000000..6a41af0d36635b1171c2301b650ccbc532ae608a
--- /dev/null
+++ b/diskuy/src/Threads/CommentList.js
@@ -0,0 +1,21 @@
+import Comment from './Comment';
+
+export default function CommentList(props){
+ return (
+ <div>
+ {props.comment.map((value) => (
+ <div id="threadComment">
+ <Comment
+ text={value.message}
+ user="Halo guys, David disini"
+ points={value.points}
+ id={value.id}
+ user_id={value.user_id}
+ thread_id={value.thread_id}
+ topic_id={value.topic_id}
+ time={value.updated_at}/>
+ </div>
+ ))}
+ </div>
+ )
+}
\ No newline at end of file
diff --git a/diskuy/src/Threads/Post.js b/diskuy/src/Threads/Post.js
index 8b18446d38a836f3663148511881f305dd6260f2..70e2110f8c1499a4aad68292fa395658eaf360e8 100644
--- a/diskuy/src/Threads/Post.js
+++ b/diskuy/src/Threads/Post.js
@@ -5,7 +5,7 @@ export default function Post(props){
<div id="post">
<div id="postHeader">
<div id="round"></div>
- <p id="creator">By {props.user} - 12 December 2020, 12:12AM </p>
+ <p id="creator">By {props.user} - {props.time} </p>
</div>
<div id="postContent">
<h1 id="judul">{props.header}</h1>
diff --git a/diskuy/src/Threads/Thread.js b/diskuy/src/Threads/Thread.js
index 3ab350455d1540a4876a2095922ad3fa6d50ae92..18cf2f7a7b41134c3efe84d52ec53b442fa97f5e 100644
--- a/diskuy/src/Threads/Thread.js
+++ b/diskuy/src/Threads/Thread.js
@@ -1,6 +1,6 @@
import React, { useState, useEffect, useCallback } from "react";
import './Thread.css';
-import Comment from './Comment';
+import CommentList from './CommentList';
import Post from './Post';
import { useInput } from '../hooks/input-hook';
import axios from 'axios';
@@ -14,7 +14,8 @@ export default function Thread(props){
points:0,
title:"",
topic_id:"",
- user_id:""
+ user_id:"",
+ updated_at: ""
});
const [comment, setComment] = useState([{
@@ -23,11 +24,13 @@ export default function Thread(props){
status: "",
thread_id: "",
post_parent_id: "",
- user_id:""
+ user_id:"",
+ updated_at: ""
}]);
const { value: input, bind: bindInput, reset: resetInput } = useInput('');
- const threadParm = props.match.params.thread
+ const topicParm = props.match.params.topic;
+ const threadParm = props.match.params.thread;
const refreshComment = useCallback(() => {
const fetch = async () => {
@@ -46,8 +49,8 @@ export default function Thread(props){
refreshComment();
}
- fetch()
- }, [threadParm, refreshComment]);
+ fetch();
+ }, [threadParm]);
const handleSubmit = async (event) => {
event.preventDefault();
@@ -66,22 +69,22 @@ export default function Thread(props){
refreshComment();
} catch (error) {}
resetInput();
- }
+ };
return (
<div>
<div>
- <Post text={thread.content} header={thread.title} user="Hello guys David disini" points={thread.point}/>
+ <Post
+ text={thread.content}
+ header={thread.title}
+ user="Hello guys David disini"
+ points={thread.point}
+ time={thread.updated_at}/>
<h2 className='commentText'>Comment</h2>
</div>
- {comment.map((value) => (
- <div id="threadComment">
- <Comment text={value.message} user="Halo guys, David disini" points={value.points}/>
- {/* <button type="button" className="btn btn-outline-danger deleteButton" onClick={() => deleteComment(value.id)}>Delete</button> */}
- </div>
- ))}
+ <CommentList comment={comment} thread_id={threadParm} topic_id={topicParm}></CommentList>
<div id="addCommentSection">
<h3>Add New Comment</h3>