diff --git a/components/accounts/AccountDetails.tsx b/components/accounts/AccountDetails.tsx index 4fea2b462..14d81cfbc 100644 --- a/components/accounts/AccountDetails.tsx +++ b/components/accounts/AccountDetails.tsx @@ -51,59 +51,54 @@ const AccountDetails: FC = ({
- {accounts && - accounts.filter(({ controller }) => controller?.id === account.id) - .length > 0 && ( - - - -
- + + +
+ + + + {accounts && ( + + + - - - - - - - + + + )} - - - + + + - - - + + + - - Test - + + WORK IN PROGRESS + - - - - - )} + + + + ); }; diff --git a/components/accounts/AccountsList.tsx b/components/accounts/AccountsList.tsx index 909cfa4d4..77341579f 100644 --- a/components/accounts/AccountsList.tsx +++ b/components/accounts/AccountsList.tsx @@ -59,13 +59,13 @@ const getSortedAccounts = ({ }: GetSortedAccountsProps) => accounts .filter(({ controller, responsibilities }) => { - if (controllerId && controller?.id === controllerId) return true; + if (controllerId && controller && controller.id === controllerId) + return true; if (controller) return false; - const currentResponsibility = - responsibilities.filter( - ({ startDate, endDate }) => - startDate <= new Date() && (!endDate || endDate >= new Date()) - ).length > 0; + const currentResponsibility = responsibilities.some( + ({ startDate, endDate }) => + startDate <= new Date() && (!endDate || endDate >= new Date()) + ); return ( (showCurrentOnly && currentResponsibility) || (showInvalidOnly && !currentResponsibility) @@ -112,29 +112,11 @@ const AccountsList: FC = ({ [accounts, controllerId, showCurrentOnly, showInvalidOnly] ); - const updateOrderNumbers = - (newIndex: number) => - (list: Account[]): Account[] => { - const current = list[newIndex]; - if (newIndex === 0) return [{ ...current, order: list[1].order + 1000 }]; - if (newIndex === list.length - 1) - return [{ ...current, order: list[newIndex - 1].order - 1000 }]; - - const orderPrev = list[newIndex - 1].order; - const orderNext = list[newIndex + 1].order; - const orderBetween = - orderPrev > orderNext + 1 - ? Math.round((orderPrev + orderNext) / 2) - : undefined; - if (orderBetween) return [{ ...current, order: orderBetween }]; - - return list - .filter((_, index) => index <= newIndex) - .map((account, idx) => ({ - ...account, - order: orderNext + 1000 * (newIndex - idx + 1), - })); - }; + const updateOrderNumbers = (list: Account[]): Account[] => + list.map((account, idx) => ({ + ...account, + order: (list.length - idx) * 10, + })); const moveItem = (items: Account[], oldIndex: number) => (newIndex: number) => arrayMove(items, oldIndex, newIndex); @@ -145,11 +127,7 @@ const AccountsList: FC = ({ const oldIndex = items.findIndex((item) => item.id === active.id); const newIndex = items.findIndex((item) => item.id === over.id); - flow( - moveItem(items, oldIndex), - updateOrderNumbers(newIndex), - updateOrder - )(newIndex); + flow(moveItem(items, oldIndex), updateOrderNumbers, updateOrder)(newIndex); }; return items.length === 0 ? ( diff --git a/components/accounts/ResponsibilityRecord.tsx b/components/accounts/ResponsibilityRecord.tsx index 367a945aa..3c65b0429 100644 --- a/components/accounts/ResponsibilityRecord.tsx +++ b/components/accounts/ResponsibilityRecord.tsx @@ -1,5 +1,6 @@ import { format } from "date-fns"; import { FC } from "react"; +import ResponsibilitiesDialog from "./responsibilities-dialog"; export type Responsibility = { id: string; @@ -12,15 +13,21 @@ type ResponsibilityRecordProps = { }; const ResponsibilityRecord: FC = ({ - responsibility: { startDate, endDate }, + responsibility: { id, startDate, endDate }, }) => { return ( -
+
Since{" "} {[startDate, ...(endDate ? [endDate] : [])] .map((date) => format(date, "PPP")) .join(" to ")} . + { + console.log(r); + }} + />
); }; diff --git a/components/accounts/responsibilities-dialog.tsx b/components/accounts/responsibilities-dialog.tsx index 1d431f4ae..0540ccae5 100644 --- a/components/accounts/responsibilities-dialog.tsx +++ b/components/accounts/responsibilities-dialog.tsx @@ -11,7 +11,7 @@ import { import { toLocaleDateString } from "@/helpers/functional"; import { cn } from "@/lib/utils"; import { zodResolver } from "@hookform/resolvers/zod"; -import { CalendarIcon } from "lucide-react"; +import { CalendarIcon, Edit } from "lucide-react"; import { FC, useState } from "react"; import { useForm } from "react-hook-form"; import { z } from "zod"; @@ -21,7 +21,6 @@ import { Dialog, DialogClose, DialogContent, - DialogDescription, DialogFooter, DialogHeader, DialogTitle, @@ -44,22 +43,39 @@ const FormSchema = z path: ["endDate"], }); -type ResponsibilitiesDialogProps = { +type CreateResponsibility = { account: Account; addResponsibility: (newResp: Responsibility) => void; + updateAccount?: never; + updateResponsibility?: never; }; +type UpdateResponsibility = { + account?: never; + addResponsibility?: never; + updateAccount: Responsibility; + updateResponsibility: (newResp: Responsibility) => void; +}; + +type ResponsibilitiesDialogProps = CreateResponsibility | UpdateResponsibility; + const ResponsibilitiesDialog: FC = ({ account, addResponsibility, + updateAccount, + updateResponsibility, }) => { const [open, setOpen] = useState(false); const { toast } = useToast(); const form = useForm>({ resolver: zodResolver(FormSchema), + defaultValues: !updateAccount + ? undefined + : { startDate: updateAccount.startDate, endDate: updateAccount.endDate }, }); - const onSubmit = ({ startDate, endDate }: z.infer) => { + const onAddSubmit = ({ startDate, endDate }: z.infer) => { + if (!account) return; toast({ title: "Responsibility created", description: `Responsibility created for account ${account.name} from ${[ @@ -70,11 +86,30 @@ const ResponsibilitiesDialog: FC = ({ .join(" to ")}.`, }); setOpen(false); - addResponsibility({ - id: account.id, - startDate, - endDate, + addResponsibility({ id: account.id, startDate, endDate }); + }; + + const onUpdateSubmit = ({ + startDate, + endDate, + }: z.infer) => { + if (!updateAccount) return; + toast({ + title: "Responsibility updated", + description: `Responsibility updated for the account from ${[ + startDate, + ...(endDate ? [endDate] : []), + ] + .map(toLocaleDateString) + .join(" to ")}.`, }); + setOpen(false); + updateResponsibility({ id: updateAccount.id, startDate, endDate }); + }; + + const onSubmit = (data: z.infer) => { + if (addResponsibility) return onAddSubmit(data); + return onUpdateSubmit(data); }; return ( @@ -82,28 +117,34 @@ const ResponsibilitiesDialog: FC = ({
- + {addResponsibility ? ( + + ) : ( + + )} - Responsibilities {account.name} - - Set the date range for your responsibility for the account{" "} - {account.name}. - + + {updateAccount + ? "Update Responsibility" + : `Responsibilities ${account.name}`} + -
- -
- Existing responsibilities: -
-
- -
-
-
+ {account && ( +
+ +
+ Existing responsibilities: +
+
+ +
+
+
+ )}