diff --git a/diskuy/.eslintcache b/diskuy/.eslintcache
index 7fee0099eba490b47ba82b7b079769f529a489ba..162d7838c8cffabf61d6f9c3a8052d6b54655371 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\\Post.js":"13","C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\CommentList.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":1609663062765,"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":3417,"mtime":1609663197910,"results":"25","hashOfConfig":"16"},{"size":703,"mtime":1609612143908,"results":"26","hashOfConfig":"16"},{"size":725,"mtime":1609612143948,"results":"27","hashOfConfig":"16"},{"size":1999,"mtime":1609665453608,"results":"28","hashOfConfig":"16"},{"size":718,"mtime":1609663316552,"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":"39","usedDeprecatedRules":"32"},{"filePath":"40","messages":"41","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"42","usedDeprecatedRules":"32"},{"filePath":"43","messages":"44","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"45","messages":"46","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"47","messages":"48","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"49","usedDeprecatedRules":"32"},{"filePath":"50","messages":"51","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"52","messages":"53","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"54","messages":"55","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"56","messages":"57","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"32"},{"filePath":"58","messages":"59","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"60","messages":"61","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\index.js",[],["62","63"],"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",["64"],"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",["65"],"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",["66","67"],"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",["68"],"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",["69","70","71"],"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",["72","73"],"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\Threads\\CommentList.js",[],{"ruleId":"74","replacedBy":"75"},{"ruleId":"76","replacedBy":"77"},{"ruleId":"78","severity":1,"message":"79","line":3,"column":8,"nodeType":"80","messageId":"81","endLine":3,"endColumn":14},{"ruleId":"82","severity":1,"message":"83","line":11,"column":13,"nodeType":"84","endLine":11,"endColumn":49},{"ruleId":"85","severity":1,"message":"86","line":8,"column":18,"nodeType":"87","messageId":"88","endLine":8,"endColumn":20},{"ruleId":"85","severity":1,"message":"86","line":14,"column":23,"nodeType":"87","messageId":"88","endLine":14,"endColumn":25},{"ruleId":"78","severity":1,"message":"89","line":19,"column":19,"nodeType":"80","messageId":"81","endLine":19,"endColumn":27},{"ruleId":"78","severity":1,"message":"90","line":5,"column":8,"nodeType":"80","messageId":"81","endLine":5,"endColumn":14},{"ruleId":"85","severity":1,"message":"86","line":39,"column":105,"nodeType":"87","messageId":"88","endLine":39,"endColumn":107},{"ruleId":"91","severity":1,"message":"92","line":54,"column":8,"nodeType":"93","endLine":54,"endColumn":20,"suggestions":"94"},{"ruleId":"85","severity":1,"message":"86","line":23,"column":18,"nodeType":"87","messageId":"88","endLine":23,"endColumn":20},{"ruleId":"85","severity":1,"message":"86","line":38,"column":27,"nodeType":"87","messageId":"88","endLine":38,"endColumn":29},"no-native-reassign",["95"],"no-negated-in-lhs",["96"],"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","eqeqeq","Expected '===' and instead saw '=='.","BinaryExpression","unexpected","'response' is assigned a value but never used.","'Button' is defined but never used.","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'refreshComment'. Either include it or remove the dependency array.","ArrayExpression",["97"],"no-global-assign","no-unsafe-negation",{"desc":"98","fix":"99"},"Update the dependencies array to be: [refreshComment, threadParm]",{"range":"100","text":"101"},[1666,1678],"[refreshComment, threadParm]"]
\ 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"},{"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":1429,"mtime":1609670377379,"results":"20","hashOfConfig":"17"},{"size":943,"mtime":1609612143895,"results":"21","hashOfConfig":"17"},{"size":472,"mtime":1609663062765,"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":3597,"mtime":1609666675852,"results":"26","hashOfConfig":"17"},{"size":703,"mtime":1609612143908,"results":"27","hashOfConfig":"17"},{"size":725,"mtime":1609612143948,"results":"28","hashOfConfig":"17"},{"size":2544,"mtime":1609667142714,"results":"29","hashOfConfig":"17"},{"size":718,"mtime":1609663316552,"results":"30","hashOfConfig":"17"},{"size":404,"mtime":1609670146539,"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":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"41","messages":"42","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"43","usedDeprecatedRules":"34"},{"filePath":"44","messages":"45","errorCount":0,"warningCount":2,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"46","messages":"47","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"48","messages":"49","errorCount":0,"warningCount":1,"fixableErrorCount":0,"fixableWarningCount":0,"source":"50","usedDeprecatedRules":"34"},{"filePath":"51","messages":"52","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"53","messages":"54","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"55","messages":"56","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"57","messages":"58","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0,"usedDeprecatedRules":"34"},{"filePath":"59","messages":"60","errorCount":0,"warningCount":3,"fixableErrorCount":0,"fixableWarningCount":0,"source":null},{"filePath":"61","messages":"62","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},{"filePath":"63","messages":"64","errorCount":0,"warningCount":0,"fixableErrorCount":0,"fixableWarningCount":0},"C:\\Users\\Ryo Axtonlie\\Documents\\..KULIAH\\SEM 5\\PemFung\\tk\\diskuy\\diskuy\\src\\index.js",[],["65","66"],"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",["67"],"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",["68","69"],"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","73"],"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",["74","75","76"],"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",[],{"ruleId":"77","replacedBy":"78"},{"ruleId":"79","replacedBy":"80"},{"ruleId":"81","severity":1,"message":"82","line":11,"column":13,"nodeType":"83","endLine":11,"endColumn":49},{"ruleId":"84","severity":1,"message":"85","line":8,"column":18,"nodeType":"86","messageId":"87","endLine":8,"endColumn":20},{"ruleId":"84","severity":1,"message":"85","line":14,"column":23,"nodeType":"86","messageId":"87","endLine":14,"endColumn":25},{"ruleId":"88","severity":1,"message":"89","line":19,"column":19,"nodeType":"90","messageId":"91","endLine":19,"endColumn":27},{"ruleId":"88","severity":1,"message":"92","line":5,"column":8,"nodeType":"90","messageId":"91","endLine":5,"endColumn":14},{"ruleId":"84","severity":1,"message":"85","line":39,"column":105,"nodeType":"86","messageId":"87","endLine":39,"endColumn":107},{"ruleId":"93","severity":1,"message":"94","line":54,"column":8,"nodeType":"95","endLine":54,"endColumn":20,"suggestions":"96"},{"ruleId":"84","severity":1,"message":"85","line":10,"column":27,"nodeType":"86","messageId":"87","endLine":10,"endColumn":29},{"ruleId":"84","severity":1,"message":"85","line":29,"column":18,"nodeType":"86","messageId":"87","endLine":29,"endColumn":20},{"ruleId":"84","severity":1,"message":"85","line":49,"column":27,"nodeType":"86","messageId":"87","endLine":49,"endColumn":29},"no-native-reassign",["97"],"no-negated-in-lhs",["98"],"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","'Button' is defined but never used.","react-hooks/exhaustive-deps","React Hook useEffect has a missing dependency: 'refreshComment'. Either include it or remove the dependency array.","ArrayExpression",["99"],"no-global-assign","no-unsafe-negation",{"desc":"100","fix":"101"},"Update the dependencies array to be: [refreshComment, threadParm]",{"range":"102","text":"103"},[1666,1678],"[refreshComment, threadParm]"]
\ No newline at end of file
diff --git a/diskuy/src/ThreadList.css b/diskuy/src/ThreadList.css
new file mode 100644
index 0000000000000000000000000000000000000000..b31b0d2bb247476a95693a0db7e6090b2f0461cf
--- /dev/null
+++ b/diskuy/src/ThreadList.css
@@ -0,0 +1,8 @@
+#threadCard {
+    width: 1080px;
+    margin-left: auto;
+    margin-right: auto;
+    padding:20px;
+    margin-top: 20px;
+    box-shadow: 0px 0px 3px 1px rgba(0,0,0,0.25);
+}
\ No newline at end of file
diff --git a/diskuy/src/ThreadList.js b/diskuy/src/ThreadList.js
new file mode 100644
index 0000000000000000000000000000000000000000..cc49e2f22259b6c4877699f73bf8b2bd09ba0510
--- /dev/null
+++ b/diskuy/src/ThreadList.js
@@ -0,0 +1,14 @@
+import './ThreadList.css';
+
+export default function ThreadList(props){
+    return (
+        <div id="threadCard">
+            <div id="threadCardHeader">
+                <h2 id="judul">{props.header}</h2>
+            </div>
+            <div id="threadCardContent">
+                <p id="creator">By {props.user} - {props.time} - {props.points} </p>
+            </div>
+        </div>
+    )
+}
\ No newline at end of file
diff --git a/diskuy/src/Threads/Post.css b/diskuy/src/Threads/Post.css
index 80c112e25fe3b09d5d4c4a51892d97b657a99df5..db873f1d1307e167bea6cbab79463eef2d7dfa75 100644
--- a/diskuy/src/Threads/Post.css
+++ b/diskuy/src/Threads/Post.css
@@ -24,6 +24,7 @@
     border-radius: 8px 8px 0px 0px;
     display: flex;
     flex-direction: row;
+    justify-content: space-between;
     padding-left: 20px;
 }
 
diff --git a/diskuy/src/Threads/Post.js b/diskuy/src/Threads/Post.js
index 54823e6538fcb98b9a413ddb92b8ee30246b1d77..7e61626e5f2a9f66c8298c2b9fffd760e4d94463 100644
--- a/diskuy/src/Threads/Post.js
+++ b/diskuy/src/Threads/Post.js
@@ -5,10 +5,16 @@ import axios from 'axios';
 const LINK = 'http://localhost:4000/';
 export default function Post(props){
 
-    const deleteComment = async (event) => {
+    const deletePost = async (event) => {
         try {
-            await axios.delete(`${LINK}api/post/${event}`);
-            window.location.reload();
+            if(event.type == "thread") {
+                console.log("aaaa")
+                await axios.delete(`${LINK}api/threads/${event.id}`);
+                props.history.push(`/${event.topic_id}`);
+            } else {
+                await axios.delete(`${LINK}api/post/${event.id}`);
+                window.location.reload();
+            }
         } catch (error) {}
     }
 
@@ -24,8 +30,13 @@ export default function Post(props){
         return (
             <div id="post">
                 <div id="postHeader">
-                    <div id="round"></div>
-                    <p id="creator">By {props.user} - {props.time} </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={() => deletePost(props)}>Delete</button>
+                    </div>
                 </div>
                 <div id="postContent">
                     <h1 id="judul">{props.header}</h1>
@@ -44,7 +55,7 @@ export default function Post(props){
                         <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>
+                        <button type="button" className="btn btn-outline-danger deleteButton" onClick={() => deletePost(props)}>Delete</button>
                     </div>
                 </div>
                 <div id="commentContent">
diff --git a/diskuy/src/Threads/Thread.js b/diskuy/src/Threads/Thread.js
index 2049b1a5638de18fdeeee1161dbd6526a0c444da..3f00baa6aff623a8fdd2b0a333d70c4b09064add 100644
--- a/diskuy/src/Threads/Thread.js
+++ b/diskuy/src/Threads/Thread.js
@@ -82,6 +82,10 @@ export default function Thread(props){
                     header={thread.title} 
                     user="Hello guys David disini" 
                     points={thread.point}
+                    id={thread.id}
+                    user_id={thread.user_id}
+                    thread_id={thread.thread_id}
+                    topic_id={thread.topic_id}
                     time={thread.updated_at}/>
                 <h2 className='commentText'>Comment</h2>
             </div>
diff --git a/diskuy/src/Topic.js b/diskuy/src/Topic.js
index 5232312154e46bb43bf368641c8f9585ad4e7698..aba2da3c3d506a84d51e80768a1181e3b7dc0e3d 100644
--- a/diskuy/src/Topic.js
+++ b/diskuy/src/Topic.js
@@ -1,6 +1,6 @@
 import React, { useEffect, useState } from "react";
 import axios from 'axios'
-import Thread from './Threads/Thread'
+import ThreadList from './ThreadList'
 
 import { Link } from "react-router-dom"
 
@@ -19,6 +19,7 @@ export default function Topic(props){
             const threads = responseThreads.data.data.filter(thread => thread.topic_id === topic)
 
             setThread(threads)
+            console.log(threads)
             
         }
         fetch()   
@@ -28,9 +29,14 @@ export default function Topic(props){
         <div>
             <ul>
                 {thread.map((value) => (
-                <li>
-                    <Link to={`/${topicParam}/${value.id}`}>{value.title}</Link>
-                </li>
+                    <Link to={`/${topicParam}/${value.id}`}>
+                        <ThreadList
+                            header={value.title}
+                            user={"Hello guys David disini"}
+                            points={value.point}
+                            time={value.updated_at}>
+                        </ThreadList>
+                    </Link>
             ))}
             </ul>
         </div>