diff options
Diffstat (limited to 'admin/src/pages/UpdateRequests/UpdateRequests.jsx')
-rw-r--r-- | admin/src/pages/UpdateRequests/UpdateRequests.jsx | 55 |
1 files changed, 37 insertions, 18 deletions
diff --git a/admin/src/pages/UpdateRequests/UpdateRequests.jsx b/admin/src/pages/UpdateRequests/UpdateRequests.jsx index 7888e7f..010a3ea 100644 --- a/admin/src/pages/UpdateRequests/UpdateRequests.jsx +++ b/admin/src/pages/UpdateRequests/UpdateRequests.jsx @@ -1,4 +1,4 @@ -import React from 'react'; +import React, { useState } from 'react'; import Accordion from '../../components/Accordion/Accordion'; import Button from '../../components/Button/Button'; import Header from '../../components/Header/Header'; @@ -7,15 +7,15 @@ import { getUpdatingUsers, updateUser, } from '../../services/apiservice'; -import {useQuery, useMutation} from 'react-query'; -import {useNavigate} from 'react-router-dom'; +import { useQuery, useMutation } from 'react-query'; +import { useNavigate } from 'react-router-dom'; import styles from './UpdateRequests.module.css'; import BackButton from '../../components/BackButton/BackButton'; import Spinner from '../../components/Spinner/Spinner'; const UpdateRequests = () => { const navigate = useNavigate(); - const {data, isLoading, isError, refetch} = useQuery( + const { data, isLoading, isError, refetch } = useQuery( 'updating', getUpdatingUsers ); @@ -25,12 +25,27 @@ const UpdateRequests = () => { }, }); - const updateUse = useMutation((id) => updateUser(id, {verified: true}), { + const updateUse = useMutation((id) => updateUser(id, { verified: true }), { onSuccess: () => { refetch(); }, }); + const [inputText, setInputText] = useState(""); + + const inputHandler = (e) => { + const lowerCase = e.target.value.toLowerCase(); + setInputText(lowerCase); + }; + + const filteredData = data?.data?.filter((el) => { + if (inputText === '') { + return el; + } else { + return el.name.toLowerCase().includes(inputText); + } + }) + if (isLoading) { return <Spinner heading='Admin' />; } @@ -42,25 +57,29 @@ const UpdateRequests = () => { return ( <div className={styles.unverified_users}> <Header subheading='Admin' /> + <h1 className={styles.unverified_users__heading}>Search</h1> + <input + className={styles.input__search} + onChange={inputHandler} + placeholder="Enter name of user to search" + /> <BackButton onClick={() => navigate('/')} /> <h1 className={styles.unverified_users__heading}>Update Requests</h1> <div className={styles.accordion}> {data?.data.length !== 0 ? ( - data?.data.map((item) => ( + filteredData?.map((item) => ( <div className={styles.unverified_users__accordion} key={item._id}> <Accordion name={item.name} user={item} /> - <div> - <Button - title='Accept' - color='green' - onClick={() => updateUse.mutate(item._id)} - /> - <Button - title='Reject' - color='red' - onClick={() => deleteUse.mutate(item._id)} - /> - </div> + <Button + title='Accept' + color='green' + onClick={() => updateUse.mutate(item._id)} + /> + <Button + title='Reject' + color='red' + onClick={() => deleteUse.mutate(item._id)} + /> </div> )) ) : ( |