Fakultas Ilmu Komputer UI

Commit 98c67a46 authored by Jonathan's avatar Jonathan
Browse files

Merge branch 'jonathan' into 'master'

edit Topic pages and set only user with role admin can visit create topic page

See merge request !24
parents a4fe86a3 9601cde5
......@@ -4,8 +4,13 @@ import { useInput } from '../../helpers/hooks/input-hook';
import '../../styles/topic/CreateTopicForm.css';
import authHeader from '../../helpers/services/authHeader.service';
import { API_URL } from '../../config/keys';
import AuthService from '../../helpers/services/auth.service';
export default function CreateTopicForm(props) {
if (AuthService.getCurrentUser().data.role != "admin") {
props.history.push("/page/1")
}
const { value: name, bind: bindName, reset: resetName } = useInput('');
const [message, setMessage] = useState('');
......
......@@ -6,11 +6,14 @@ import { API_URL } from '../../config/keys';
import '../../styles/topic/Topic.css';
import Button from '../utility/Button';
import Pagination from '../thread/Pagination';
import AuthService from '../../helpers/services/auth.service';
import authHeader from '../../helpers/services/authHeader.service';
export default function Topic(props) {
const { params } = props.match;
const currentPage = params.pageNumber;
const topicParam = params.topic;
const isAdmin = AuthService.getCurrentUser().data.role
const [threads, setThreads] = useState([]);
const [totalItems, setTotalItems] = useState(0);
......@@ -37,6 +40,15 @@ export default function Topic(props) {
window.location.reload();
}
const deleteTopic = async () => {
try {
await axios.delete(`${API_URL}/topics/${topicParam}`, {
headers: authHeader(),
});
props.history.push(`/topic`)
} catch (error) {}
};
return (
<div className="topicContainer">
<div className="header">
......@@ -44,7 +56,19 @@ export default function Topic(props) {
<b>Topic: {topicParam}</b>
</h1>
{loggedIn && (
<Button text="Create Thread" color="orange" url="create/thread" />
<Button
text="Create Thread"
color="orange"
url="create/thread" />
)}
{loggedIn && isAdmin == "admin" && (
<button
type="button"
className="deleteTopicButton"
onClick={() => deleteTopic()}
>
Delete This Topic
</button>
)}
</div>
<div className="list_threads_section">
......
......@@ -2,10 +2,14 @@ import React, { useEffect, useState } from 'react';
import axios from 'axios';
import { Link } from 'react-router-dom';
import { API_URL } from '../../config/keys';
import { loggedIn } from '../../helpers/services/loggedIn.service';
import '../../styles/topic/TopicList.css';
import Button from '../utility/Button';
import AuthService from '../../helpers/services/auth.service';
export default function TopicList(props) {
const [topics, setTopics] = useState([]);
const isAdmin = AuthService.getCurrentUser().data.role
useEffect(() => {
const fetch = async () => {
......@@ -17,7 +21,12 @@ export default function TopicList(props) {
return (
<div className="topicContainer">
<h1>Topic List</h1>
<div className="headerTopic">
<h1>Topic List</h1>
{loggedIn && isAdmin == "admin" && (
<Button text="Create Topic" color="orange" url="create/topic" />
)}
</div>
<div className="topics">
{topics.map((value) => (
<Link
......
......@@ -44,4 +44,15 @@
color: #DE6600 !important;
font-weight: bold;
opacity: 1!important;
}
.deleteTopicButton {
border: 1px solid #D7443E;
border-radius: 4px;
padding: 8px;
font-size: 16px;
font-family: "DM Sans";
color: #D7443E;
margin-left: 24px;
background-color: transparent!important;
}
\ No newline at end of file
......@@ -7,7 +7,6 @@
font-size: 36px;
font-weight: bold;
color: #003F5A;
margin-bottom: 60px;
}
.topics {
......@@ -35,3 +34,10 @@
color: #DE6600!important;
margin: 0px;
}
.headerTopic {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 60px;
}
\ No newline at end of file
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment