How do I implement data range filtering in Typescript?

Question

How do I implement data range filtering in Typescript?

Seeking assistance with filtering data by date range and forwarding the results to the client. The objective is to extract tickets created within specific dates, but I keep encountering a console error which is proving challenging to resolve.

    var before:Date = req.query.before;
  if(before !== undefined){
        //@ts-ignore
        var after:Date = req.query.before;
        var filteredData = tempData.filter(function(t){
        return res.send(new Date(t.creationTime) >= after && new Date(t.creationTime) <= before);      
        });
  }

This is the error message displayed in the console:

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client
    at ServerResponse.setHeader (_http_outgoing.js:558:11)
    at ServerResponse.header (C:\Project\server\node_modules\express\lib\response.js:771:10)
    at ServerResponse.json (C:\Project\server\node_modules\express\lib\response.js:264:10)
    at ServerResponse.send (C:\Project\server\node_modules\express\lib\response.js:158:21)
    at C:\Project\server\index.ts:48:20
    at Array.filter (<anonymous>)
    at C:\Project\server\index.ts:47:37
    at Layer.handle [as handle_request] (C:\Project\server\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Project\server\node_modules\express\lib\router\route.js:137:13)  
    at Route.dispatch (C:\Project\server\node_modules\express\lib\router\route.js:112:3)

typescript express date http filter

Answer 1

Answer №1

Each element in the tempData array is evaluated by the function provided to the filter method.

Within the filter function, there is a call to the res.send() method which sends a response back to the client. It's important to note that this method should only be called once per request, but currently, it is being called for each element in the tempData array.

To optimize your code, consider filtering the data first before sending it back to the client.

let filteredData = tempData.filter(function(t){
    return new Date(t.creationTime) >= after && new Date(t.creationTime) <= before;
});
res.send(filteredData);

In addition, there seems to be an issue with your code where both the before and after variables are set to req.query.before.

The statement

new Date(t.creationTime) <= before && new Date(t.creationTime) >= after;

will likely result in yielding false unless t.creationTime equals req.query.before, leading to an empty array for filteredData. Refer to the documentation on the filter method for more insights.

A possible solution (assuming req.query.after is defined) could be:

const before:Date = req.query.before;
  if(before !== undefined){
        //@ts-ignore
        const after:Date = req.query.after;
        let filteredData = tempData.filter(function(t){
          return new Date(t.creationTime) <= before && new Date(t.creationTime) >= after;
      });
      TICKETS_AMOUNT = filteredData.length.toString();
      res.send(filteredData);
  }

I have provided a full example below:

interface DataType {
    name: string,
    date: Date,
}

let data: Array<DataType> = [
    {"name": "foo", date: new Date(2020, 5, 12)},
    {"name": "bar", date: new Date(2020, 7, 20)},
    {"name": "baz", date: new Date(2021, 2, 23)},
];

app.get('/filter-date-range', (req, res): void => {
    let result = data;

    if (req.query.before) {
        let before: Date = new Date(String(req.query.before));
        if (!isNaN(before.getTime())) {
            result = result.filter((e) => e.date <= before);
        } else {
            res.status(400).send("Unable to parse before date.");
            return;
        }
    }

    if (req.query.after) {
        let after: Date = new Date(String(req.query.after));
        if (!isNaN(after.getTime())) {
            result = result.filter((e) => e.date >= after);
        } else {
            res.status(400).send("Unable to parse after date.");
            return;
        }
    }

    res.json(result);
});

Simply adjust the data variable to suit your specific project needs.

Answer 2

Each element in the tempData array is evaluated by the function provided to the filter method.

Within the filter function, there is a call to the res.send() method which sends a response back to the client. It's important to note that this method should only be called once per request, but currently, it is being called for each element in the tempData array.

To optimize your code, consider filtering the data first before sending it back to the client.

let filteredData = tempData.filter(function(t){
    return new Date(t.creationTime) >= after && new Date(t.creationTime) <= before;
});
res.send(filteredData);

In addition, there seems to be an issue with your code where both the before and after variables are set to req.query.before.

The statement

new Date(t.creationTime) <= before && new Date(t.creationTime) >= after;

will likely result in yielding false unless t.creationTime equals req.query.before, leading to an empty array for filteredData. Refer to the documentation on the filter method for more insights.

A possible solution (assuming req.query.after is defined) could be:

const before:Date = req.query.before;
  if(before !== undefined){
        //@ts-ignore
        const after:Date = req.query.after;
        let filteredData = tempData.filter(function(t){
          return new Date(t.creationTime) <= before && new Date(t.creationTime) >= after;
      });
      TICKETS_AMOUNT = filteredData.length.toString();
      res.send(filteredData);
  }

I have provided a full example below:

interface DataType {
    name: string,
    date: Date,
}

let data: Array<DataType> = [
    {"name": "foo", date: new Date(2020, 5, 12)},
    {"name": "bar", date: new Date(2020, 7, 20)},
    {"name": "baz", date: new Date(2021, 2, 23)},
];

app.get('/filter-date-range', (req, res): void => {
    let result = data;

    if (req.query.before) {
        let before: Date = new Date(String(req.query.before));
        if (!isNaN(before.getTime())) {
            result = result.filter((e) => e.date <= before);
        } else {
            res.status(400).send("Unable to parse before date.");
            return;
        }
    }

    if (req.query.after) {
        let after: Date = new Date(String(req.query.after));
        if (!isNaN(after.getTime())) {
            result = result.filter((e) => e.date >= after);
        } else {
            res.status(400).send("Unable to parse after date.");
            return;
        }
    }

    res.json(result);
});

Simply adjust the data variable to suit your specific project needs.

Answer 3

Answer №2

Each element in the tempData array will undergo evaluation by the function passed to the filter method.

I made a modification, and now I no longer receive console errors; however, there seems to be no output as a result.

const before: Date = req.query.before;
if(before !== undefined){
    //@ts-ignore
    const after: Date = req.query.before;
    let filteredData = tempData.filter(function(t){
        return new Date(t.creationTime) <= before && new Date(t.creationTime) >= after;
    });
    TICKETS_AMOUNT = filteredData.length.toString();
    res.send(filteredData);
}

Answer 4

Each element in the tempData array will undergo evaluation by the function passed to the filter method.

I made a modification, and now I no longer receive console errors; however, there seems to be no output as a result.

const before: Date = req.query.before;
if(before !== undefined){
    //@ts-ignore
    const after: Date = req.query.before;
    let filteredData = tempData.filter(function(t){
        return new Date(t.creationTime) <= before && new Date(t.creationTime) >= after;
    });
    TICKETS_AMOUNT = filteredData.length.toString();
    res.send(filteredData);
}

How do I implement data range filtering in Typescript?

Answer №1

Answer №2

Similar questions

Show a notification if the MongoDB collection is devoid of any data

What is the best way to initiate a refetch when the need arises to follow a different path?

Utilizing NodeJs to retrieve data asynchronously and store it in a variable for future use

Updating the value in React context does not result in the value being updated

"Error message: Trying to import a component in Angular, but encountering a message stating that the component has no exported

Integrating Google Sheets in an Express.js application involves syncing data

Error: JSON at position 1 is throwing off the syntax in EXPRESS due to an unexpected token "

"Exploring the power of Angular 16 coupled with Firebase 9 for seamless file

Issues with React Material UI Select functionality not performing as expected

Why does React redirect me to the main page after refreshing the page, even though the user is authenticated in a private route?

Exploring the depths of mongodb through targeted field queries

Error: Invalid parameter detected for Shopify script-tag

Experiencing Issues Connecting to AWS RDS MySQL Database Through Express JS

Why is Socket.io functioning on localhost but fails to work once deployed to Heroku?

How to verify if an unknown-type variable in TypeScript contains a specific property

What exactly is the functionality of the third parameter (usually next()) behind the scenes in ExpressJS once it is hidden behind the abstraction layer?

I'm looking to add autocomplete functionality to a text input in my project, and then retrieve and display data from a MySQL database using

Retrieve data from the database that meets criteria based on multiple entries in a junction table

Encountering an Uncaught TypeError when attempting to set properties of null with useRef

React: Issue with passing arguments to redux action hooks