Skip to content

Commit

Permalink
fix: make fixes requested while review
Browse files Browse the repository at this point in the history
  • Loading branch information
Kanak1125 committed Feb 19, 2025
1 parent 883c3b9 commit 7f9585b
Show file tree
Hide file tree
Showing 13 changed files with 168 additions and 136 deletions.
46 changes: 2 additions & 44 deletions frontend/app/dashboard/lists/columns.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,7 @@
import React from 'react'
import { ColumnDef } from '@tanstack/react-table';
import { formatDate } from '@/lib/utils';
import { Edit3, Trash2 } from 'lucide-react';
import { EditListForm } from '@/components/ListForms';
import Modal from '@/components/Modal';
import { useDeleteListMutation, useGetListsQuery } from '@/app/services/ListApi';
import ActionsColumn from './components/ActionsColumn';

const namespaceId = "e3bda5cf-760e-43ea-8e9a-c2c3c5f95b82";

Expand Down Expand Up @@ -34,46 +31,7 @@ export const columns: ColumnDef<any>[] = [
{
accessorKey: "actions",
header: "",
cell: ({ row }) => {
const listId = row.original.id;

const { refetch } = useGetListsQuery(namespaceId);

const [ deleteList, { isLoading: isDeleting, error: deletionError } ] = useDeleteListMutation();

const deleteListHandler = async (id: string) => {
if (deletionError) {
return <div>Error deleting the list</div>
}

await deleteList({ namespaceId, listId: id });
refetch();
}


return (
<div className='flex space-x-4 text-primary items-center'>
{/* <button className='transition-all duration-300 ease-in-out hover:scale-105'><Edit3 size={16} /></button> */}
<Modal
triggerButton={<Edit3
size={20}
strokeWidth={1.5}
className='text-lime-400 hover:text-lime-500'
/>}
dialogBody={<EditListForm listId={listId}/>}
dialogTitle={"Edit Template"}
dialogDescription={"Edit your template"}
/>
<button
className='transition-all duration-300 ease-in-out hover:scale-105'
onClick={() => deleteListHandler(listId)}
>
<Trash2 strokeWidth={1.5} size={20} className='text-red-400 hover:text-red-500' />
</button>
</div>
)
}

cell: ({ row }) => <ActionsColumn row={row} namespaceId={namespaceId}/>
},
]

Expand Down
52 changes: 52 additions & 0 deletions frontend/app/dashboard/lists/components/ActionsColumn.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import { useGetListsQuery, useDeleteListMutation } from '@/app/services/ListApi';
import { EditListForm } from '@/components/ListForms';
import Modal from '@/components/Modal';
import { Row } from '@tanstack/react-table';
import { Edit3, Trash2 } from 'lucide-react';
import React from 'react'

interface ActionsColumnProps {
row: Row<any>,
namespaceId: string,
};

const ActionsColumn = ({
row,
namespaceId,
}: ActionsColumnProps) => {
const listId = row.original.id;

const [ deleteList, { isLoading: isDeleting, error: deletionError } ] = useDeleteListMutation();

const deleteListHandler = async (id: string) => {
if (deletionError) {
return <div>Error deleting the list</div>
}

await deleteList({ namespaceId, listId: id });
}

return (
<div className='flex space-x-4 text-primary items-center'>
{/* <button className='transition-all duration-300 ease-in-out hover:scale-105'><Edit3 size={16} /></button> */}
<Modal
triggerButton={<Edit3
size={20}
strokeWidth={1.5}
className='text-lime-400 hover:text-lime-500'
/>}
dialogBody={<EditListForm listId={listId}/>}
dialogTitle={"Edit Template"}
dialogDescription={"Edit your template"}
/>
<button
className='transition-all duration-300 ease-in-out hover:scale-105'
onClick={() => deleteListHandler(listId)}
>
<Trash2 strokeWidth={1.5} size={20} className='text-red-400 hover:text-red-500' />
</button>
</div>
);
}

export default ActionsColumn
14 changes: 2 additions & 12 deletions frontend/app/dashboard/lists/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,11 @@
import React from 'react'

import Modal from '@/components/Modal';
import { Plus } from "lucide-react";
import { AddListForm } from '@/components/ListForms';
import { useGetListsQuery } from '@/app/services/ListApi';
import { Button } from '@/components/ui/button';
import DataTable from '@/components/DataTable';
import columns from './columns';

const addButton = (
<Button variant={"default"}>
<>
<Plus size={24} />
<span className='ml-1'>New</span>
</>
</Button>
);
import AddButton from '@/components/common/AddButton';

const page = () => {
const namespaceId = "e3bda5cf-760e-43ea-8e9a-c2c3c5f95b82";
Expand All @@ -41,7 +31,7 @@ const page = () => {
<span>({lists?.length})</span>
</h1>
<Modal
triggerButton={addButton}
triggerButton={<AddButton />}
dialogBody={<AddListForm />}
dialogTitle={"New template"}
dialogDescription={"Add a new template"}
Expand Down
49 changes: 2 additions & 47 deletions frontend/app/dashboard/templates/columns.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,7 @@
import React from 'react'
import { ColumnDef } from '@tanstack/react-table';
import { formatDate } from '@/lib/utils';
import { Edit3, ScanEye, Trash2 } from 'lucide-react';
import { EditTemplateForm } from '@/components/TemplateForms';
import Modal from '@/components/Modal';
import { useDeleteTemplateMutation, useGetTemplatesQuery } from '@/app/services/TemplateApi';
import ActionsColumn from './components/ActionsColumn';


export const columns: ColumnDef<any>[] = [
Expand All @@ -28,49 +25,7 @@ export const columns: ColumnDef<any>[] = [
{
accessorKey: "actions",
header: "",
cell: ({ row }) => {
const templateId = row.original.id;

const { refetch } = useGetTemplatesQuery();

const [ deleteTemplate, { isLoading: isDeleting, error: deletionError } ] = useDeleteTemplateMutation();

const deleteTemplateHandler = async (id: string) => {
if (deletionError) {
return <div>Error deleting the list</div>
}

await deleteTemplate(id);
refetch();
}


return (
<div className='flex space-x-4 text-primary items-center'>
<button className='transition-all duration-300 ease-in-out hover:scale-105'><ScanEye size={20} /></button>
{/* <button className='transition-all duration-300 ease-in-out hover:scale-105'><Edit3 size={16} /></button> */}
<Modal
triggerButton={<Edit3
size={20}
strokeWidth={1.5}
className='text-lime-400 transition-all duration-300 ease-in-out hover:scale-105 hover:text-lime-500'
/>}
dialogBody={<EditTemplateForm templateId={templateId}/>}
dialogTitle={"Edit Template"}
dialogDescription={"Edit your template"}
/>
<button
className='transition-all duration-300 ease-in-out hover:scale-105 text-red-400 hover:text-red-500'
onClick={() => {
deleteTemplateHandler(templateId);
}}
>
<Trash2 size={20} strokeWidth={1.5} />
</button>
</div>
)
}

cell: ({ row }) => <ActionsColumn row={row} />,
},
]

Expand Down
52 changes: 52 additions & 0 deletions frontend/app/dashboard/templates/components/ActionsColumn.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,52 @@
import { useGetTemplatesQuery, useDeleteTemplateMutation } from '@/app/services/TemplateApi';
import Modal from '@/components/Modal';
import { EditTemplateForm } from '@/components/TemplateForms';
import { Row } from '@tanstack/react-table';
import { Edit3, ScanEye, Trash2 } from 'lucide-react';
import React from 'react';

interface ActionsColumnProps {
row: Row<any>,
};

const ActionsColumn = ({ row }: ActionsColumnProps) => {
const templateId = row.original.id;

const [ deleteTemplate, { isLoading: isDeleting, error: deletionError } ] = useDeleteTemplateMutation();

const deleteTemplateHandler = async (id: string) => {
if (deletionError) {
return <div>Error deleting the list</div>
}

await deleteTemplate(id);
}


return (
<div className='flex space-x-4 text-primary items-center'>
<button className='transition-all duration-300 ease-in-out hover:scale-105'><ScanEye size={20} /></button>
{/* <button className='transition-all duration-300 ease-in-out hover:scale-105'><Edit3 size={16} /></button> */}
<Modal
triggerButton={<Edit3
size={20}
strokeWidth={1.5}
className='text-lime-400 transition-all duration-300 ease-in-out hover:scale-105 hover:text-lime-500'
/>}
dialogBody={<EditTemplateForm templateId={templateId}/>}
dialogTitle={"Edit Template"}
dialogDescription={"Edit your template"}
/>
<button
className='transition-all duration-300 ease-in-out hover:scale-105 text-red-400 hover:text-red-500'
onClick={() => {
deleteTemplateHandler(templateId);
}}
>
<Trash2 size={20} strokeWidth={1.5} />
</button>
</div>
)
}

export default ActionsColumn
13 changes: 2 additions & 11 deletions frontend/app/dashboard/templates/page.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -3,21 +3,12 @@
import React from 'react'

import Modal from '@/components/Modal';
import { Plus } from "lucide-react";
import { AddTemplateForm } from '@/components/TemplateForms';
import { useGetTemplatesQuery } from '@/app/services/TemplateApi';
import DataTable from '@/components/DataTable';
import columns from './columns';
import { Button } from '@/components/ui/button';
import AddButton from '@/components/common/AddButton';

const addButton = (
<Button variant={"default"}>
<>
<Plus size={24} />
<span className='ml-1'>New</span>
</>
</Button>
);

const page = () => {
const { data: templates, error, isLoading } = useGetTemplatesQuery();
Expand All @@ -39,7 +30,7 @@ const page = () => {
<span>({templates?.length})</span>
</h1>
<Modal
triggerButton={addButton}
triggerButton={<AddButton />}
dialogBody={<AddTemplateForm />}
dialogTitle={"New template"}
dialogDescription={"Add a new template"}
Expand Down
21 changes: 16 additions & 5 deletions frontend/app/services/ListApi.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ import {
UpdateListRequestDTO,
UpdateListResponseDTO
} from '@/lib/type';
import environments from "@/config/environments";

type List = z.infer<typeof ListDTO>;
type CreateListRequest = z.infer<typeof CreateListRequestDTO>;
Expand All @@ -17,16 +18,24 @@ type UpdateListResponse = z.infer<typeof UpdateListResponseDTO>;
// List API slice...
export const listApi = createApi({
reducerPath: "listApi",
baseQuery: fetchBaseQuery({ baseUrl: "http://localhost:8000/api/list"}),
baseQuery: fetchBaseQuery({ baseUrl: environments.LIST_API_BASE_URL }),
tagTypes: ['List'],
endpoints: (builder) => ({
// Query to fetch all lists...
getLists: builder.query<List[], string>({query: (namespaceId) => `/namespaces/${namespaceId}/list`}),
getLists: builder.query<List[], string>({
query: (namespaceId) => `/namespaces/${namespaceId}/list`,
providesTags: (result) =>
result
? result.map((list) => ({ type: 'List', id: list.id }))
: [{ type: 'List' }]
}),
createList: builder.mutation<CreateListResponse, CreateListRequest>({
query: (newList) => ({
url: "",
method: "POST",
body: newList,
})
}),
invalidatesTags: ['List']
}),
updateList: builder.mutation<UpdateListResponse, {
listId: string,
Expand All @@ -37,7 +46,8 @@ export const listApi = createApi({
url: `/namespaces/${namespaceId}/list/${listId}`,
method: "PATCH",
body: updatedList
})
}),
invalidatesTags: ['List']
}),
deleteList: builder.mutation<void, {
listId: string,
Expand All @@ -46,7 +56,8 @@ export const listApi = createApi({
query: ({listId, namespaceId}) => ({
url: `/namespaces/${namespaceId}/list/${listId}`,
method: "DELETE",
})
}),
invalidatesTags: ['List']
})
})
});
Expand Down
Loading

0 comments on commit 7f9585b

Please sign in to comment.