안형욱

feat: 검색 조건 상태 slice 추가

......@@ -126,7 +126,11 @@ const Header = () => {
float="left"
fontsize="20px"
height="50px"
options={[{ id: 1, name: '전체' }]}
options={[
{ id: 0, name: '전체' },
{ id: 1, name: '작성자' },
{ id: 2, name: '내용' },
]}
/>
</DropDownWrap>
</DropDownContainer>
......
import React, { useState, useEffect } from 'react';
import { TiArrowSortedDown } from 'react-icons/ti';
import { Menu, MenuItem } from '@mantine/core';
import { useDispatch } from 'react-redux';
import styled from 'styled-components';
import { dropdownHeaderColorMap } from '../../lib/styles/palette';
import { setSearchOption } from '../../features/searchOption';
const DropDownBlock = styled.div`
margin: 0 auto;
......@@ -41,6 +43,7 @@ const DropDown = ({
size,
}) => {
const [menuTitle, setTitle] = useState('');
const dispatch = useDispatch();
useEffect(() => {
setTitle(title);
}, []);
......@@ -62,14 +65,15 @@ const DropDown = ({
</DropDownWrap>
}
>
{options.map(friend => (
{options.map(option => (
<MenuItem
value={friend.id}
value={option.id}
onClick={() => {
setTitle(friend.name);
dispatch(setSearchOption(option.id));
setTitle(option.name);
}}
>
{friend.name}
{option.name}
</MenuItem>
))}
</DropDownHeader>
......
import { createSlice } from '@reduxjs/toolkit';
const OPTION = ['ALL', 'WRITER', 'CONTENT'];
const searchOptionSlice = createSlice({
name: 'searchOption',
initialState: {
option: OPTION[0],
},
reducers: {
setSearchOption: (state, action) => {
state.option = OPTION[action.payload];
},
},
});
export const { setSearchOption } = searchOptionSlice.actions;
export default searchOptionSlice.reducer;
......@@ -51,9 +51,9 @@ const HomePage = () => {
fontsize="20px"
height="50px"
options={[
{ id: 1, name: '전체' },
{ id: 2, name: '개인' },
{ id: 3, name: '부서' },
{ id: 0, name: '전체' },
{ id: 1, name: '작성자' },
{ id: 2, name: '내용' },
]}
/>
<Input color="blue" paddingsize="10px" width="100%" display />
......
import { combineReducers } from 'redux';
import parsedDocumentsReducer from '../features/parsedDocumentsSlice';
import searchOptionReducer from '../features/searchOption';
export default combineReducers({
parsedDocuments: parsedDocumentsReducer,
searchOption: searchOptionReducer,
});
......