'Json Server is not working - does not fetch to insert, but Delete is working - using REACT 18.1.0

I made a json server, after installation globally, everything is working, and the command "npx json-server --watch src/data/db.json --port 8000" to watch the data from file db.json, on port 8000, is working properly, it loads the data, and also delete, but does not insert a new item. So I need help please to fix this situation. This server is just for production mode for my application in React 18.1 and nodejs. I'm using Material-ui as well. Below my code to insert and delete data.

import React, { useEffect, useState } from 'react';
import { Container, Grid } from '@mui/material';
import CardBanks from '../components/CardBanks';


export default function Notes(){
    const [ notes, setNotes ] = useState([]); 

    useEffect(() => {
        fetch('http://localhost:8000/banks')
        .then(res => res.json())
        .then(data => setNotes(data))
    }, []);

const handleDelete = async (id) => {
    await fetch('http://localhost:8000/banks/' + id, {
        method: 'DELETE'
    })
    const newNotes = notes.filter(note => note.id != id) ;
    setNotes(newNotes);
}

    return(
        <Container>
            <Grid container spacing={3}>
           {notes.map(note => (
               <Grid item key={note.id} xs={12} md={6} lg={4}>
                  <CardBanks note={ note } handleDelete={handleDelete}/>  {/*passing props note with element note */}
               </Grid>
           ))}
           </Grid>
        </Container>
    )
}

   // Inserting a new Bank (Bank component) 

import React, { useState } from 'react';
import { FormControlLabel, RadioGroup, Typography } from '@mui/material';
import { Button } from '@mui/material';
import { Container } from '@mui/material';
import KeyboardArrowRightIcon from '@mui/icons-material/KeyboardArrowRight';
import { makeStyles } from '@mui/styles';
import { TextField } from '@mui/material';
import { Radio } from '@mui/material';
import { FormLabel } from '@mui/material';
import { FormControl } from '@mui/material';
import { useHistory } from 'react-router-dom';
import '../Styles.css';
import { Box } from '@mui/material';


const useStyles = makeStyles(({
    
    field: {
        spacing: 4,
        margimTop: 50,
        marginBottom: 100,
        display: "block",
    }
    
}));

export default function Bancos(){
    const classes = useStyles()
    const history = useHistory()
    const [name, setName] = useState('')
    const [address, setAddress] = useState('')
    const [nameError, setNameError] = useState(false)
    const [addressError, setAddressError] = useState(false)
    const [status, setStatus] =useState('active')

    const handleSubmit = (e) => {
        e.preventDefault()
        setNameError(false)
        setAddressError(false)

        if(name == ''){
            setNameError(true)
        }

        if(address == ''){
            setAddressError(true)
        }

        if( name && address){
            fetch('http://localhost:8000/banks', {
                method: 'POST',
                headers: { "Content-type": "application/json" },
                body: JSON.stringify({name, address, status})
                .then(() =>  history.push('/')),
            })
           
        }
        
    }

    return(
        <Container>
           <Typography  variant="h6" color="textSecondary" align="center" gutterBottom
            className="titleBank">
               Cadastrar um novo Banco
           </Typography>

            <form noValidate autoComplete="off" onSubmit={handleSubmit}>
            
            

After fetching a new Bank, I do a push to "/" root and it doesn't go to the root page. Follow the message of delete, but I'm not getting error message on fetching the post. Loading src/data/db.json

Done

Resources http://localhost:8000/banks

Home http://localhost:8000

Type s + enter at any time to create a snapshot of the database Watching...

GET /banks 304 25.153 ms - - GET /banks 304 5.086 ms - - GET /banks 304 3.618 ms - - GET /banks 304 4.286 ms - - GET /banks 304 3.166 ms - - DELETE /banks/4 200 7.424 ms - 2



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source