✨ feat: add admin banned word view (#426)

backend/streetdrop-admin/streetdrop-admin-server/src/main/java/com/depromeet/domains/item/controller/BannedWordController.java

@@ -0,0 +1,30 @@
+package com.depromeet.domains.item.controller;
+
+
+import com.depromeet.domains.item.service.BannedWordService;
+import com.depromeet.domains.user.dto.ResponseDto;
+import lombok.RequiredArgsConstructor;
+import org.springframework.data.domain.Pageable;
+import org.springframework.data.domain.Sort;
+import org.springframework.data.web.PageableDefault;
+import org.springframework.http.ResponseEntity;
+import org.springframework.web.bind.annotation.GetMapping;
+import org.springframework.web.bind.annotation.RequestMapping;
+import org.springframework.web.bind.annotation.RestController;
+
+@RestController
+@RequiredArgsConstructor
+@RequestMapping("/banned-words")
+public class BannedWordController {
+    private final BannedWordService bannedWordService;
+
+    @GetMapping
+    public ResponseEntity<?> getBannedWords(
+            @PageableDefault(size = 20, page = 0, sort = "id",
+                    direction = Sort.Direction.DESC) Pageable pageable
+    ) {
+        var result = bannedWordService.getBannedWords(pageable);
+        return ResponseDto.ok(result);
+    }
+
+}

backend/streetdrop-admin/streetdrop-admin-server/src/main/java/com/depromeet/domains/item/dto/BannedWordAllResponseDto.java

@@ -0,0 +1,16 @@
+package com.depromeet.domains.item.dto;
+
+import com.depromeet.common.dto.PageMetaData;
+import lombok.AllArgsConstructor;
+import lombok.Getter;
+import lombok.NoArgsConstructor;
+
+import java.util.List;
+
+@AllArgsConstructor
+@NoArgsConstructor
+@Getter
+public class BannedWordAllResponseDto {
+    List<BannedWordResponseDto> data;
+    PageMetaData meta;
+}

backend/streetdrop-admin/streetdrop-admin-server/src/main/java/com/depromeet/domains/item/dto/BannedWordResponseDto.java

@@ -0,0 +1,17 @@
+package com.depromeet.domains.item.dto;
+
+import lombok.AllArgsConstructor;
+import lombok.Builder;
+import lombok.Getter;
+import lombok.NoArgsConstructor;
+
+@AllArgsConstructor
+@NoArgsConstructor
+@Builder
+@Getter
+public class BannedWordResponseDto {
+
+    private Long id;
+    private String word;
+
+}

backend/streetdrop-admin/streetdrop-admin-server/src/main/java/com/depromeet/domains/item/repository/BannedWordRepository.java

@@ -0,0 +1,10 @@
+package com.depromeet.domains.item.repository;
+
+import com.depromeet.common.entity.BannedWord;
+import org.springframework.data.domain.Page;
+import org.springframework.data.domain.Pageable;
+import org.springframework.data.jpa.repository.JpaRepository;
+
+public interface BannedWordRepository extends JpaRepository<BannedWord, Long> {
+    Page<BannedWord> findAll(Pageable pageable);
+}

backend/streetdrop-admin/streetdrop-admin-server/src/main/java/com/depromeet/domains/item/service/BannedWordService.java

@@ -0,0 +1,39 @@
+package com.depromeet.domains.item.service;
+
+import com.depromeet.common.dto.PageMetaData;
+import com.depromeet.domains.item.dto.BannedWordAllResponseDto;
+import com.depromeet.domains.item.dto.BannedWordResponseDto;
+import com.depromeet.domains.item.repository.BannedWordRepository;
+import lombok.RequiredArgsConstructor;
+import org.springframework.data.domain.Pageable;
+import org.springframework.stereotype.Service;
+
+import java.util.List;
+
+@Service
+@RequiredArgsConstructor
+public class BannedWordService {
+
+    private final BannedWordRepository bannedWordRepository;
+
+    public BannedWordAllResponseDto getBannedWords(Pageable pageable) {
+        var bannedWord = bannedWordRepository.findAll(pageable);
+        PageMetaData pageMetaData = new PageMetaData(
+                bannedWord.getNumber(),
+                bannedWord.getSize(),
+                (int) bannedWord.getTotalElements(),
+                bannedWord.getTotalPages()
+        );
+
+        List<BannedWordResponseDto> bannedWords = bannedWord.getContent()
+                .stream()
+                .map((word) -> {
+                    return BannedWordResponseDto.builder()
+                            .id(word.getId())
+                            .word(word.getWord())
+                            .build();
+                }).toList();
+
+        return new BannedWordAllResponseDto(bannedWords, pageMetaData);
+    }
+}

backend/streetdrop-admin/streetdrop-admin-web/src/App.js

@@ -19,6 +19,7 @@ import MemberListPage from "./components/member/MemberListPage";
 import MemberLoginLogPage from "./components/member/MemberLoginLogPage";
 import MemberSecuritySettingPage from "./components/member/MemberSecuritySettingPage";
 import ItemReportPage from "./components/items/ItemReportPage";
+import BannedWordPage from "./components/items/BannedWordPage";
 
 const App = () => {
     return (
@@ -30,6 +31,7 @@ const App = () => {
                         <Route exact path="/" element={<Dashboard/>}/>
                         <Route path="/items" element={<ItemListPage/>}/>
                         <Route path="/items/report" element={<ItemReportPage/>}/>
+                        <Route path='/banned-words' element={<BannedWordPage/>}/>
                         <Route path="/drop-music" element={<SearchDropMusic/>}/>
                         <Route path="/drop-music/details" element={<DropSingleMusic/>}/>
                         <Route path='/drop-music/result/success' element={<DropMusicSuccess/>}/>

backend/streetdrop-admin/streetdrop-admin-web/src/api/domain/item/BannedWordApi.js

@@ -0,0 +1,15 @@
+import {axiosAuthInstance} from "../../AxiosInstance";
+
+
+const BannedWordApi = {
+    getBannedWords: (page, size) => {
+        return axiosAuthInstance.get('/banned-words', {
+            params: {
+                page: page,
+                size: size
+            }
+        })
+    },
+}
+
+export default BannedWordApi;

backend/streetdrop-admin/streetdrop-admin-web/src/components/items/BannedWordPage.js

@@ -0,0 +1,78 @@
+import React, {useEffect, useState} from "react";
+import {Table} from "antd";
+import BasicLayout from "../../layout/BasicLayout";
+import BannedWordApi from "../../api/domain/item/BannedWordApi";
+
+function BannedWordPage() {
+    const [data, setData] = useState([]);
+
+    const [tableParams, setTableParams] = useState({
+        pagination: {
+            current: 1,
+            pageSize: 30
+        },
+    });
+
+    useEffect(() => {
+        fetchData();
+    }, [JSON.stringify(tableParams)]);
+
+
+    const fetchData = async () => {
+        const response = await BannedWordApi.getBannedWords(tableParams.pagination.current - 1, tableParams.pagination.pageSize);
+        setData(response.data['data']);
+        setTableParams({
+            ...tableParams,
+            pagination: {
+                ...tableParams.pagination,
+                total: response.data['meta']['totalElements'],
+            },
+        });
+    }
+
+
+    const columns = [
+        {
+            title: 'ID',
+            dataIndex: 'id',
+            key: 'id',
+        },
+        {
+            title: '금칙어',
+            dataIndex: 'word',
+        }
+    ];
+
+
+    const handleTableChange = (
+        pagination,
+    ) => {
+        setTableParams({
+            pagination,
+        });
+
+        if (pagination.pageSize !== tableParams.pagination?.pageSize) {
+            setData([]);
+        }
+    };
+
+
+    return (
+        <>
+            <BasicLayout>
+                <h3 style={{marginBottom: '10px'}}>금칙어 관리</h3>
+                <p style={{color: 'gray'}}>아이템 콘텐츠의 금칙어를 관리할 수 있습니다.</p>
+                <Table
+                    style={{marginTop: '20px'}}
+                    columns={columns}
+                    rowKey={record => record.id}
+                    pagination={tableParams.pagination}
+                    dataSource={data}
+                    onChange={handleTableChange}
+                />
+            </BasicLayout>
+        </>
+    )
+}
+
+export default BannedWordPage;

backend/streetdrop-admin/streetdrop-admin-web/src/layout/common/Menu.js

@@ -32,6 +32,9 @@ const MenuComponent = () => {
                     <Link to="/items/report">• 아이템 신고</Link>
                 </Menu.Item>
                 <Menu.Item key="dropitem-menu-4">
+                    <Link to="/banned-words">• 금칙어 관리</Link>
+                </Menu.Item>
+                <Menu.Item key="dropitem-menu-5">
                     <Link to="/music/recommend">• 음악 검색어 추천</Link>
                 </Menu.Item>
             </Menu.SubMenu>