Skip to content

[Issue-36]: Make the Due Date filter workable and Many more changes t… #49

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
karanmistry007 merged 1 commit into from
Jul 20, 2025
Merged

[Issue-36]: Make the Due Date filter workable and Many more changes t… #49

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion frontend/src/components/charts/StatusDonutChart.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -39,7 +39,6 @@ const chartConfig = {
} satisfies ChartConfig

export const StatusDonutChart = ({ data }: any) => {
console.log(data)
const totalQuickdos = data.reduce((acc: any, curr: any) => acc + curr.quickdo, 0)

return (
Expand Down
254 changes: 191 additions & 63 deletions frontend/src/components/layout/filters.tsx
View file
Open in desktop

Large diffs are not rendered by default.

8 changes: 6 additions & 2 deletions frontend/src/components/layout/quickdo-item.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -29,6 +29,7 @@ const QuickDoItem = (props: ListItemProps) => {
const [categories, setCategories] = useState<useAllCategories[]>(props.todoData.categories);
const [showCategories, setShowCategories] = useState<boolean>(false);
const [allCategories, setAllCategories] = useState<useAllCategories[]>(props.allCategories);
const [datePopupOpen, setDatePopupOpen] = useState<boolean>(false);


//? STATUS HANDLER
Expand Down Expand Up @@ -170,7 +171,7 @@ const QuickDoItem = (props: ListItemProps) => {
{/* DUE DATE */}
<div className="item hidden lg:block lg:col-span-2 justify-self-center">

<Popover>
<Popover open={datePopupOpen} onOpenChange={setDatePopupOpen}>
<PopoverTrigger asChild>
<Button
variant={"transparent"}
Expand All @@ -195,7 +196,10 @@ const QuickDoItem = (props: ListItemProps) => {
<Calendar
mode="single"
selected={(new Date(date))}
onSelect={handleSetDate}
onSelect={(e) => {
handleSetDate(e);
setDatePopupOpen(false);
}}
initialFocus
/>
</PopoverContent>
Expand Down
16 changes: 14 additions & 2 deletions frontend/src/components/layout/sort.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,17 +1,29 @@
import React from "react";
import { Select, SelectTrigger, SelectContent, SelectValue, SelectItem } from "@/components/ui/select";
import { BsSortDownAlt, BsSortUp } from "react-icons/bs";
import { useSortDataItems } from "@/types/Common";

interface SortProps {
currentSort: string;
currentSortDirection: string;
useSortData: { name: string; sort: string }[];
// useSortData: { name: string; sort: string }[];
setCurrentSort: (sort: string) => void;
setCurrentSortDirection: (direction: string) => void;
setRefreshState: (state: boolean) => void;
}

const Sort: React.FC<SortProps> = ({ currentSort, currentSortDirection, useSortData, setCurrentSort, setCurrentSortDirection, setRefreshState }) => {
// ? DEFINE SORTING DATA
const useSortData: useSortDataItems[] = [
{ name: "Created", sort: "creation" },
{ name: "Modified", sort: "modified" },
{ name: "Importance", sort: "is_important" },
{ name: "Due Date", sort: "date" },
{ name: "Reminder", sort: "send_reminder" },
{ name: "Status", sort: "status" },
{ name: "Description", sort: "description" },
]

const Sort: React.FC<SortProps> = ({ currentSort, currentSortDirection, setCurrentSort, setCurrentSortDirection, setRefreshState }) => {
return (
<div className="sort-quickdo flex border-neutral-200 border rounded-md w-fit shadow-sm sm:order-1">
<Select onValueChange={(e) => { setCurrentSort(e); setRefreshState(true); }}>
Expand Down
70 changes: 8 additions & 62 deletions frontend/src/pages/quickdo/group-by-view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,9 +3,7 @@ import CreateQuickDo from "@/components/ui/create-quickdo";
import QuickDoItem from "@/components/layout/quickdo-item";
import {
useAllQuickDoData,
useSortDataItems,
DashboardProps,
useStatusFiltersItems,
} from "@/types/Common";
import { toast } from 'sonner'
import {
Expand All @@ -21,24 +19,12 @@ import Filters from "@/components/layout/filters";
import Sort from "@/components/layout/sort";
import Navbar from "@/components/layout/navbar";
import Sidebar from "@/components/layout/sidebar";
import {
useStatusFilterData,
createFilterHandler,
createClearFiltersHandler,
} from "@/utils/filter-utils"

// ? DEFINE STATUS DROPDOWN DATA
const useStatusFilterData: useStatusFiltersItems[] = [
{ name: "Open" },
{ name: "Completed" },
{ name: "Cancelled" },
]

// ? DEFINE SORTING DATA
const useSortData: useSortDataItems[] = [
{ name: "Created", sort: "creation" },
{ name: "Modified", sort: "modified" },
{ name: "Importance", sort: "is_important" },
{ name: "Due Date", sort: "date" },
{ name: "Reminder", sort: "send_reminder" },
{ name: "Status", sort: "status" },
{ name: "Description", sort: "description" },
];

const GroupByView = (props: DashboardProps) => {

Expand All @@ -59,50 +45,11 @@ const GroupByView = (props: DashboardProps) => {
const [completedQuickDoData, setCompletedQuickDoData] = useState<useAllQuickDoData[]>([]);
const [cancelledQuickDoData, setCancelledQuickDoData] = useState<useAllQuickDoData[]>([]);


// ? HANDLE FILTERS DATA
const handleFilters = (key: string, value: string, child_table = "") => {
setFilters((prevFilters) => {
// ? FIND THE INDEX OF EXISTING FILTER BASED ON KEY OR CHILD TABLE
const index = prevFilters.findIndex(
(filter: any) => filter[0] === (child_table || key)
);

const updatedFilters = [...prevFilters];
const fieldIndex = child_table ? 3 : 2; // ? DETERMINE FIELD BASED ON CHILD TABLE

if (index !== -1) {
const values = updatedFilters[index][fieldIndex] || [];

// ? REMOVE VALUE IF IT EXISTS
if (values.includes(value)) {
updatedFilters[index][fieldIndex] = values.filter(
(item: string) => item !== value
);

// ? REMOVE FILTER COMPLETELY IF EMPTY
if (updatedFilters[index][fieldIndex].length === 0) {
updatedFilters.splice(index, 1);
}
} else {
// ? ADD VALUE IF NOT EXISTS
updatedFilters[index][fieldIndex] = [...values, value];
}
} else {
// ? ADD NEW FILTER IF NOT EXISTS
updatedFilters.push(
child_table
? [child_table, key, "in", [value]]
: [key, "in", [value]]
);
}

return updatedFilters;
});
};
// ? DYNAMIC HANDLE FILTERS FUNCTION
const handleFilters = createFilterHandler(setFilters);

// ? HANDLE CLEAR FILTERS
const handleClearFilters = () => setFilters([]);
const handleClearFilters = createClearFiltersHandler(setFilters);

// ? USE EFFECT ON FILTERS AND SORT CHANGES
useEffect(() => {
Expand Down Expand Up @@ -219,7 +166,6 @@ const GroupByView = (props: DashboardProps) => {
<Sort
currentSort={currentSort}
currentSortDirection={currentSortDirection}
useSortData={useSortData}
setCurrentSort={setCurrentSort}
setCurrentSortDirection={setCurrentSortDirection}
setRefreshState={setRefreshState}
Expand Down
74 changes: 9 additions & 65 deletions frontend/src/pages/quickdo/inbox-view.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,10 +1,6 @@
import { useEffect, useState } from "react";
import CreateQuickDo from "../../components/ui/create-quickdo";
import {
useSortDataItems,
DashboardProps,
useStatusFiltersItems,
} from "../../types/Common";
import { DashboardProps } from "../../types/Common";
import { toast } from 'sonner'
import { addQuickDo, deleteQuickDo, fetchQuickDos, updateQuickDo } from "@/utils/quickdo";
import { fetchCategoryList } from "@/utils/quickdo-category";
Expand All @@ -13,24 +9,12 @@ import Sort from "@/components/layout/sort";
import QuickdoList from "@/components/layout/quickdo-list";
import Navbar from "@/components/layout/navbar";
import Sidebar from "@/components/layout/sidebar";
import {
useStatusFilterData,
createFilterHandler,
createClearFiltersHandler,
} from "@/utils/filter-utils"

// ? DEFINE STATUS DROPDOWN DATA
const useStatusFilterData: useStatusFiltersItems[] = [
{ name: "Open" },
{ name: "Completed" },
{ name: "Cancelled" },
]

// ? DEFINE SORTING DATA
const useSortData: useSortDataItems[] = [
{ name: "Created", sort: "creation" },
{ name: "Modified", sort: "modified" },
{ name: "Importance", sort: "is_important" },
{ name: "Due Date", sort: "date" },
{ name: "Reminder", sort: "send_reminder" },
{ name: "Status", sort: "status" },
{ name: "Description", sort: "description" },
];

const InboxView = (props: DashboardProps) => {

Expand All @@ -43,49 +27,11 @@ const InboxView = (props: DashboardProps) => {
const [getAllCategories, setGetAllCategories] = useState<any[]>([]);
const [allTodoData, setAllTodoData] = useState<any[]>([]);

// ? HANDLE FILTERS DATA
const handleFilters = (key: string, value: string, child_table = "") => {
setFilters((prevFilters) => {
// ? FIND THE INDEX OF EXISTING FILTER BASED ON KEY OR CHILD TABLE
const index = prevFilters.findIndex(
(filter: any) => filter[0] === (child_table || key)
);

const updatedFilters = [...prevFilters];
const fieldIndex = child_table ? 3 : 2; // ? DETERMINE FIELD BASED ON CHILD TABLE

if (index !== -1) {
const values = updatedFilters[index][fieldIndex] || [];

// ? REMOVE VALUE IF IT EXISTS
if (values.includes(value)) {
updatedFilters[index][fieldIndex] = values.filter(
(item: string) => item !== value
);

// ? REMOVE FILTER COMPLETELY IF EMPTY
if (updatedFilters[index][fieldIndex].length === 0) {
updatedFilters.splice(index, 1);
}
} else {
// ? ADD VALUE IF NOT EXISTS
updatedFilters[index][fieldIndex] = [...values, value];
}
} else {
// ? ADD NEW FILTER IF NOT EXISTS
updatedFilters.push(
child_table
? [child_table, key, "in", [value]]
: [key, "in", [value]]
);
}

return updatedFilters;
});
};
// ? DYNAMIC HANDLE FILTERS FUNCTION
const handleFilters = createFilterHandler(setFilters);

// ? HANDLE CLEAR FILTERS
const handleClearFilters = () => setFilters([]);
const handleClearFilters = createClearFiltersHandler(setFilters);

// ? USE EFFECT ON FILTERS AND SORT CHANGES
useEffect(() => {
Expand Down Expand Up @@ -155,7 +101,6 @@ const InboxView = (props: DashboardProps) => {
// ? UPDATE REFRESH STATE
const handleRefreshState = (state: boolean) => setRefreshState(state);


return (
<>

Expand Down Expand Up @@ -193,7 +138,6 @@ const InboxView = (props: DashboardProps) => {
<Sort
currentSort={currentSort}
currentSortDirection={currentSortDirection}
useSortData={useSortData}
setCurrentSort={setCurrentSort}
setCurrentSortDirection={setCurrentSortDirection}
setRefreshState={setRefreshState}
Expand Down
Loading