sourabhbagrecha

import { QueryClient, QueryClientProvider } from "react-query";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import NavBar from "./components/NavBar.component";
import { UserProvider } from "./contexts/user.context";
import Analytics from "./pages/Analytics.page";
import CreateExpense from "./pages/CreateExpense.page";
import EditExpense from "./pages/EditExpense.page";
import Home from "./pages/Home.page";
import Login from "./pages/Login.page";
import PrivateRoute from "./pages/PrivateRoute.page";

sourabhbagrecha

import { BrowserRouter, Route, Routes } from "react-router-dom";
import NavBar from "./components/NavBar.component";
import { UserProvider } from "./contexts/user.context";
import Analytics from "./pages/Analytics.page";
import CreateExpense from "./pages/CreateExpense.page";
import EditExpense from "./pages/EditExpense.page";
import Home from "./pages/Home.page";
import Login from "./pages/Login.page";
import PrivateRoute from "./pages/PrivateRoute.page";
import Signup from "./pages/Signup.page";

sourabhbagrecha

import Chart from "react-google-charts";

const CategoryAnalytics = ({ data }) => {
  const chartData = [["Category", "Amount"]];
  data.forEach(({ category, amount }) => {
    chartData.push([category, amount]);
  });
  return <>
    <h3>Category Analytics</h3>
    <Chart

sourabhbagrecha

import Chart from "react-google-charts";

const ModeAnalytics = ({ data }) => {
  const chartData = [["Mode", "Amount"]];
  data.forEach(({ mode, amount }) => {
    chartData.push([mode, amount]);
  });
  return <>
    <h3>Mode Analytics</h3>
    <Chart

sourabhbagrecha

{
  "type": "object",
  "title": "ModeAnalyticsOutput",
  "properties": {
    "modes": {
      "bsonType": "array",
      "items": {
        "bsonType": "object",
        "title": "modeAnalyticsItem",
        "properties": {

sourabhbagrecha

exports = async (input) => {
  const {from, to} = input;
  const collection = context.services.get('mongodb-atlas').db('expengo').collection("expenses");
  const user = context.user.id;
  
  // Pipeline to filter relevant expenses as per the date range
  // and group them by the mode name and calculate the total amount
  // per mode.
  const pipeline = [
    {

sourabhbagrecha

import { useContext, useEffect, useState } from "react";
import { Button, Grid } from "@mui/material";
import request, { gql } from "graphql-request";
import { formatISO, subMonths, endOfToday, startOfDay, endOfDay } from "date-fns";
import { UserContext } from "../contexts/user.context";
import { GRAPHQL_ENDPOINT } from "../realm/constants";
import PageContainer from "../components/PageContainer.component";
import CustomDatePicker from "../components/CustomDatePicker.component";
import ModeAnalytics from "../components/ModeAnalytics.component";
import CategoryAnalytics from "../components/CategoryAnalytics.component";

sourabhbagrecha

{
  "type": "object",
  "title": "CategoryAnalyticsOutput",
  "properties": {
    "categories": {
      "bsonType": "array",
      "items": {
        "bsonType": "object",
        "title": "categoryAnalyticsItem",
        "properties": {

sourabhbagrecha

{
  "type": "object",
  "title": "filter",
  "properties": {
    "from": {
      "bsonType": "timestamp"
    },
    "to": {
      "bsonType": "timestamp"
    }

sourabhbagrecha

exports = async (input) => {
  // fetching the from and to date from the input query of Custom GraphQL Resolver 
  const {from, to} = input;
  const collection = context.services.get('mongodb-atlas').db('expengo').collection("expenses");
  const user = context.user.id;
  
  // Creating a pipeline that matches the current author and the timeline mentioned in the input query,
  // and then combine all the amount by category. 
  const pipeline = [
    {