diff --git a/app/(private)/todos/[_id]/page.tsx b/app/(private)/todos/[_id]/page.tsx index 7a06561..f25fc84 100644 --- a/app/(private)/todos/[_id]/page.tsx +++ b/app/(private)/todos/[_id]/page.tsx @@ -32,7 +32,7 @@ import { COLORS, STYLES } from '@/lib/constants'; import { failure, openModal } from '@/lib/client_functions'; const TodosPage = ({ params }: { params: { _id: string } }) => { - const { data, refetch, loading } = useFetchData(`/api/todos?type=list&_id=${params._id}`); + const { data, refetch, loading } = useFetchData(`/api/todos?type=list&list=${params._id}`); const [todoList, setTodoList] = useState([]); const form = useForm({ @@ -97,7 +97,7 @@ const TodosPage = ({ params }: { params: { _id: string } }) => { diff --git a/app/(private)/todos/important/page.tsx b/app/(private)/todos/important/page.tsx index cfe6703..c2198e8 100644 --- a/app/(private)/todos/important/page.tsx +++ b/app/(private)/todos/important/page.tsx @@ -97,7 +97,7 @@ const TodosPage = () => { diff --git a/app/(private)/todos/page.tsx b/app/(private)/todos/page.tsx index a1d31c5..0d83222 100644 --- a/app/(private)/todos/page.tsx +++ b/app/(private)/todos/page.tsx @@ -97,7 +97,7 @@ const TodosPage = () => { @@ -109,7 +109,12 @@ const TodosPage = () => { ) : ( {data?.map((todo: TodoType) => ( - + ))} )} diff --git a/app/(private)/todos/recent/page.tsx b/app/(private)/todos/recent/page.tsx index 8a4be9e..a0e36a8 100644 --- a/app/(private)/todos/recent/page.tsx +++ b/app/(private)/todos/recent/page.tsx @@ -97,7 +97,7 @@ const TodosPage = () => { diff --git a/app/(private)/todos/today/page.tsx b/app/(private)/todos/today/page.tsx index fe6cd46..b8f7b90 100644 --- a/app/(private)/todos/today/page.tsx +++ b/app/(private)/todos/today/page.tsx @@ -97,7 +97,7 @@ const TodosPage = () => { diff --git a/app/(private)/todos/upcoming/page.tsx b/app/(private)/todos/upcoming/page.tsx index 96f34b0..d0f7501 100644 --- a/app/(private)/todos/upcoming/page.tsx +++ b/app/(private)/todos/upcoming/page.tsx @@ -97,7 +97,7 @@ const TodosPage = () => { diff --git a/app/layout.tsx b/app/layout.tsx index 2ee876e..37f7fe1 100644 --- a/app/layout.tsx +++ b/app/layout.tsx @@ -22,7 +22,7 @@ export default function RootLayout({ children }: { children: any }) { content="minimum-scale=1, initial-scale=1, width=device-width, user-scalable=no" /> - + diff --git a/components/Layout/Layout.tsx b/components/Layout/Layout.tsx index fb73889..0493914 100644 --- a/components/Layout/Layout.tsx +++ b/components/Layout/Layout.tsx @@ -7,12 +7,14 @@ import { Button, Container, Group, + Indicator, Popover, rem, SimpleGrid, Stack, } from '@mantine/core'; -import { useDisclosure } from '@mantine/hooks'; +import { useDisclosure, useNetwork } from '@mantine/hooks'; +import { notifications } from '@mantine/notifications'; import { IconGridDots, IconList } from '@tabler/icons-react'; import { signOut, useSession } from 'next-auth/react'; import { usePathname, useRouter } from 'next/navigation'; @@ -21,8 +23,10 @@ import React, { useCallback, useEffect, useState } from 'react'; import axios from 'axios'; import { App } from '../App'; import { APPS } from '@/lib/constants'; +import { failure } from '@/lib/client_functions'; export default function Layout({ children }: { children: React.ReactNode }) { + const network = useNetwork(); const [mobileOpened, { toggle: toggleMobile, close }] = useDisclosure(); const [desktopOpened, { toggle: toggleDesktop }] = useDisclosure(true); const [opened, setOpened] = useState(false); @@ -48,9 +52,13 @@ export default function Layout({ children }: { children: React.ReactNode }) { ); const getList = async () => { - setAPP(APPS.find((app) => `/${rootpath}` === app?.path)); - const { data } = await axios.get(`/api/list?schema=${rootpath}`); - setAPP((old = { sidebar: [] }) => ({ ...old, sidebar: [...old.sidebar, ...data] })); + try { + setAPP(APPS.find((app) => `/${rootpath}` === app?.path)); + const { data } = await axios.get(`/api/list?schema=${rootpath}`); + setAPP((old = { sidebar: [] }) => ({ ...old, sidebar: [...old.sidebar, ...data] })); + } catch (error) { + failure('Something went wrong'); + } }; if (isLoggedOff) { @@ -63,6 +71,22 @@ export default function Layout({ children }: { children: React.ReactNode }) { nprogress.complete(); }, [pathname]); + useEffect(() => { + if (!network.online) { + notifications.clean(); + notifications.show({ + title: 'Waiting for connection.. ', + message: 'Please connect to the internet...', + color: 'red', + autoClose: false, + loading: true, + withCloseButton: false, + }); + } else { + notifications.clean(); + } + }, [network.online]); + if (loading) { return <>; } @@ -116,15 +140,17 @@ export default function Layout({ children }: { children: React.ReactNode }) { shadow="md" > - setOpened((o) => !o)} - > - - + + setOpened((o) => !o)} + > + + + @@ -184,7 +210,7 @@ export default function Layout({ children }: { children: React.ReactNode }) { leftSection={item?.icon || } radius={0} variant={pathname === item?.path ? 'filled' : 'subtle'} - color={item?.color || APP.color} + color={`${item?.color || APP.color}${pathname === item?.path ? '.3' : '.5'}`} fullWidth > {item?.label} diff --git a/components/Note/Note.tsx b/components/Note/Note.tsx index a0670e3..ee9d621 100644 --- a/components/Note/Note.tsx +++ b/components/Note/Note.tsx @@ -10,7 +10,7 @@ const Note = ({ note, handleClick }: Props) => ( handleClick(note)} diff --git a/components/Todo/TodoPageActions.tsx b/components/Todo/TodoPageActions.tsx index 258c4c3..6eda1d4 100644 --- a/components/Todo/TodoPageActions.tsx +++ b/components/Todo/TodoPageActions.tsx @@ -22,7 +22,6 @@ import { IconPlaylistAdd, IconPlus, IconPrinter, - IconShare, IconTrash, } from '@tabler/icons-react'; import axios from 'axios'; @@ -52,6 +51,7 @@ const TodoPageActions = ({ refetch, getTodoLists, todoList, isListPage = false } color: '', title: '', }); + const selected = todoList.find((l) => l._id === pathname.split('/')[2]); const form = useForm({ initialValues: { @@ -124,14 +124,13 @@ const TodoPageActions = ({ refetch, getTodoLists, todoList, isListPage = false } return ( - {todoList.find((l) => l._id === pathname.split('/')[2])?.title} + + {selected?.title || pathname.split('/')[pathname.split('/').length - 1]} + window.print()} title="Print"> - - - @@ -153,7 +152,6 @@ const TodoPageActions = ({ refetch, getTodoLists, todoList, isListPage = false } color="gray" title="Rename list" onClick={() => { - const selected = todoList.find((l) => l._id === pathname.split('/')[2]); setList({ _id: pathname.split('/')[2], title: selected?.title, diff --git a/lib/client_functions.tsx b/lib/client_functions.tsx index f01ae43..9b58168 100644 --- a/lib/client_functions.tsx +++ b/lib/client_functions.tsx @@ -9,7 +9,7 @@ export const failure = (message: string) => title: 'Error', message, color: 'red', - autoClose: 5000, + autoClose: 2000, withCloseButton: true, icon: , }); @@ -19,7 +19,7 @@ export const success = (message: string) => title: 'Success', message, color: 'green', - autoClose: 5000, + autoClose: 2000, withCloseButton: true, icon: , }); diff --git a/lib/constants.tsx b/lib/constants.tsx index 464d3b1..a85324b 100644 --- a/lib/constants.tsx +++ b/lib/constants.tsx @@ -44,8 +44,8 @@ export const APPS: AppType[] = [ { label: 'Todos', path: '/todos', + color: 'teal', icon: , - color: 'red', sidebar: [ { label: 'All', path: '/todos', icon: }, { label: 'Today', path: '/todos/today', icon: }, @@ -56,7 +56,7 @@ export const APPS: AppType[] = [ }, { label: 'Calendar', path: '/calendar', icon: , color: 'green', sidebar: [] }, { label: 'Forum', path: '/forum', icon: , color: 'indigo', sidebar: [] }, - { label: 'Passwords', path: '/passwords', icon: , color: 'teal', sidebar: [] }, + { label: 'Passwords', path: '/passwords', icon: , color: 'red', sidebar: [] }, { label: 'Document', path: '/document', diff --git a/lib/functions.ts b/lib/functions.ts index f7d7e63..d5810c1 100644 --- a/lib/functions.ts +++ b/lib/functions.ts @@ -37,25 +37,27 @@ export const getTodaysTodos = async (user: any) => date: { $gte: dayjs().startOf('day').toDate(), $lte: dayjs().endOf('day').toDate() }, }) .populate({ path: 'list', select: 'title color' }) - .sort('-updatedAt'); + .sort({ isCompleted: -1 }); export const getUpcomingTodos = async (user: any) => Todo.find({ user, date: { $gt: dayjs().startOf('day').toDate() } }) .populate({ path: 'list', select: 'title color' }) - .sort('-updatedAt'); + .sort({ isCompleted: -1 }); export const getRecentTodos = async (user: any) => Todo.find({ user, date: { $lt: dayjs().startOf('day').toDate() } }) .populate({ path: 'list', select: 'title color' }) - .sort('-updatedAt'); + .sort({ isCompleted: -1 }); export const getImportantTodos = async (user: any) => Todo.find({ user, isImportant: true }) .populate({ path: 'list', select: 'title color' }) - .sort('-updatedAt'); + .sort({ isCompleted: -1 }); export const getListTodos = async (user: any, list: string) => - Todo.find({ user, list }).populate({ path: 'list', select: 'title color' }).sort('-updatedAt'); + Todo.find({ user, list }) + .populate({ path: 'list', select: 'title color' }) + .sort({ isCompleted: -1 }); export const getAllTodos = async (user: any) => Todo.find({ user }) .populate({ path: 'list', select: 'title color', }) - .sort('-updatedAt'); + .sort({ isCompleted: -1 });