0

I'm wondering how to create an onClick function where you are able to sort an array of data into their respected dates. Such as Day, Month, and year.

desired output would be onClick today only today's date will show up.

My output currently is ["12/19/2020"] and

2: {id: 3, type: "Groceries", spent: 100, date: "12/19/2020"}

Here's what I've tried so far.

     const onClickDay = (date) => {
    const getExpenseSavings = () => {
      getAllData().then((res) => {
        setSave(res[1]);
        setExpense(res[2]);
      });
    };
    const getSaveDates = save.map((item) => {
      const d = item.date;
      const saveConverted = DateTime.fromISO(d).toLocaleString();
      return { ...item, date: saveConverted };
    });

    const getExpenseDate = expense.map((item) => {
      const d = item.date;
      const expenseConverted = DateTime.fromISO(d).toLocaleString();
      return { ...item, date: expenseConverted };
    });

    setData([[getExpenseDate], [getSaveDates]]);
  };

//Where I'm filtering the dates by my onClick...
  const filterDay = () => {
    if (data !== null) {
      const results = data.filter((date) => {
        return setMonth(date.getMonth() + 1);
        setDay(date.getDate());
        setYear(date.getFullYear());
      });
      setFilterResults(results);
    }
  };

And my Hooks...

    const [year, setYear] = useState([d.getFullYear()]);
  const [month, setMonth] = useState([d.getMonth() + 1]);
  const [day, setDay] = useState([d.getDate()]);

  const [filter, setFilter] = useState("");
  const [filterResults, setFilterResults] = useState([]);

  const [data, setData] = useState([null]); //this is where my dates are stored atm...
  const [expense, setExpense] = useState(null);
  const [save, setSave] = useState(null);

  const [showing, setShowing] = useState(false);

Thanks in advance! Please help...

PrinceJelly
  • 63
  • 9
  • please come with a working snippet, if you have a snippet that shows your problem clearly, it will solve your problem much faster compare to come without a snippet, in example, you can create a snippet from code sandbox – Nisharg Shah Dec 23 '20 at 21:45

1 Answers1

0

How to sort an array by date value in JavaScript

Find out how to sort an array of items by date value in JavaScript Say you have an array of objects like this, which contains a set of date objects:

const activities = [
  { title: 'Hiking', date: new Date('2019-06-28') },
  { title: 'Shopping', date: new Date('2019-06-10') },
  { title: 'Trekking', date: new Date('2019-06-22') }
]

You want to sort those activities by the date property. You can use the sort() method of Array, which takes a callback function, which takes as parameters 2 objects contained in the array (which we call a and b):

const sortedActivities = activities.sort((a, b) => b.date - a.date)

When we return a positive value, the function communicates to sort() that the object b takes precedence in sorting over the object a. Returning a negative value will do the opposite.

The sort() method returns a new sorted array, but it also sorts the original array in place. Thus, both the sortedActivities and activities arrays are now sorted. One option to protect the original array from being modified is to use the slice() method to create a copy of the array prior to sorting, as follows:

const sortedActivities = activities.slice().sort((a, b) => b.date - a.date)

Read this:

https://flaviocopes.com/how-to-sort-array-by-date-javascript/

https://gist.github.com/onpubcom/1772996

How to sort an array by a date property

Mahdi zoraghi
  • 388
  • 7