From 63d888354100ac436629f81509a9685abe2564f4 Mon Sep 17 00:00:00 2001
From: itsmegood <ishersingh16@gmail.com>
Date: Fri, 9 Feb 2024 21:30:50 +0530
Subject: [PATCH] create new customer accounts

---
 app/components/ui/input.tsx                   |   2 +-
 app/routes/_auth+/login.tsx                   |   1 +
 app/routes/c.$companyId+/_layout_company.tsx  |   4 +-
 .../{accounts.tsx => customers.tsx}           |  12 +-
 app/routes/c.$companyId+/purchases.tsx        |   4 +-
 app/routes/c.$companyId+/sales.tsx            |   4 +-
 .../$customerId_.edit.tsx                     |  58 +++
 .../__customer-account-editor.tsx             | 267 ++++++++++++++
 .../index.tsx                                 |  14 +-
 app/routes/c.$companyId.customers+/new.tsx    |  16 +
 app/routes/c.$companyId.purchases+/index.tsx  |  13 +-
 .../new.tsx                                   |  13 +-
 app/routes/studio+/c.new.tsx                  |   2 +-
 app/routes/studio+/index.tsx                  |   2 +-
 .../$username_+/notes.$noteId_.edit.tsx       |   2 +-
 app/styles/tailwind.css                       |   5 +
 app/utils/permissions.server.ts               |  63 +++-
 app/utils/user.ts                             |   9 +-
 package-lock.json                             | 330 +++++++++---------
 package.json                                  |  22 +-
 prisma/schema.prisma                          |  79 +++--
 prisma/seed.ts                                |  10 +-
 22 files changed, 689 insertions(+), 243 deletions(-)
 rename app/routes/c.$companyId+/{accounts.tsx => customers.tsx} (70%)
 create mode 100644 app/routes/c.$companyId.customers+/$customerId_.edit.tsx
 create mode 100644 app/routes/c.$companyId.customers+/__customer-account-editor.tsx
 rename app/routes/{c.$companyId.accounts+ => c.$companyId.customers+}/index.tsx (73%)
 create mode 100644 app/routes/c.$companyId.customers+/new.tsx
 rename app/routes/{c.$companyId.accounts+ => c.$companyId.purchases+}/new.tsx (82%)

diff --git a/app/components/ui/input.tsx b/app/components/ui/input.tsx
index 18801dc..255252f 100644
--- a/app/components/ui/input.tsx
+++ b/app/components/ui/input.tsx
@@ -11,7 +11,7 @@ const Input = React.forwardRef<HTMLInputElement, InputProps>(
 			<input
 				type={type}
 				className={cn(
-					'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid]:border-input-invalid',
+					'flex h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-1 disabled:cursor-not-allowed disabled:opacity-50 aria-[invalid]:border-input-invalid',
 					className,
 				)}
 				ref={ref}
diff --git a/app/routes/_auth+/login.tsx b/app/routes/_auth+/login.tsx
index 5086cff..a800f39 100644
--- a/app/routes/_auth+/login.tsx
+++ b/app/routes/_auth+/login.tsx
@@ -204,6 +204,7 @@ export async function action({ request }: ActionFunctionArgs) {
 	await requireAnonymous(request)
 	const formData = await request.formData()
 	checkHoneypot(formData)
+
 	const submission = await parseWithZod(formData, {
 		schema: intent =>
 			LoginFormSchema.transform(async (data, ctx) => {
diff --git a/app/routes/c.$companyId+/_layout_company.tsx b/app/routes/c.$companyId+/_layout_company.tsx
index 208ccdd..085715c 100644
--- a/app/routes/c.$companyId+/_layout_company.tsx
+++ b/app/routes/c.$companyId+/_layout_company.tsx
@@ -11,8 +11,8 @@ const companyRoutes = [
 		end: true,
 	},
 	{
-		title: 'Accounts',
-		href: 'accounts',
+		title: 'Customers',
+		href: 'customers',
 	},
 	{
 		title: 'Sales',
diff --git a/app/routes/c.$companyId+/accounts.tsx b/app/routes/c.$companyId+/customers.tsx
similarity index 70%
rename from app/routes/c.$companyId+/accounts.tsx
rename to app/routes/c.$companyId+/customers.tsx
index bb3c18d..f495278 100644
--- a/app/routes/c.$companyId+/accounts.tsx
+++ b/app/routes/c.$companyId+/customers.tsx
@@ -15,8 +15,8 @@ const salesRoutes = [
 		href: 'customers',
 	},
 	{
-		title: 'Quotes',
-		href: 'quotes',
+		title: 'New Account',
+		href: 'new',
 	},
 	{
 		title: 'Payments',
@@ -24,17 +24,17 @@ const salesRoutes = [
 	},
 ]
 
-export default function AccountsLayout() {
+export default function CustomerAccountsLayout() {
 	return (
 		<>
-			<h1 className="text-h3 md:text-h2">Accounts</h1>
+			<h1 className="text-h3 md:text-h2">Customer Accounts</h1>
 
-			<nav className="grid max-w-lg grid-flow-col gap-6 overflow-y-auto py-2 [scrollbar-width:none]">
+			<nav className="grid max-w-lg grid-flow-col gap-6 overflow-y-auto text-nowrap py-2 font-semibold [scrollbar-width:none]">
 				{salesRoutes.map(route => (
 					<NavLink
 						key={route.title}
 						className={({ isActive }) =>
-							`font-semibold hover:underline ${isActive ? 'underline' : 'text-foreground/50'}`
+							`hover:underline ${isActive ? 'underline' : 'text-foreground/50'}`
 						}
 						to={route.href}
 						end={route.end}
diff --git a/app/routes/c.$companyId+/purchases.tsx b/app/routes/c.$companyId+/purchases.tsx
index 595f348..77ee325 100644
--- a/app/routes/c.$companyId+/purchases.tsx
+++ b/app/routes/c.$companyId+/purchases.tsx
@@ -29,12 +29,12 @@ export default function PurchasesLayout() {
 		<>
 			<h1 className="text-h3 md:text-h2">Purchases</h1>
 
-			<nav className="grid max-w-lg grid-flow-col gap-6 overflow-y-auto py-2 [scrollbar-width:none]">
+			<nav className="grid max-w-lg grid-flow-col gap-6 overflow-y-auto text-nowrap py-2 font-semibold  [scrollbar-width:none]">
 				{salesRoutes.map(route => (
 					<NavLink
 						key={route.title}
 						className={({ isActive }) =>
-							`font-semibold hover:underline ${isActive ? 'underline' : 'text-foreground/50'}`
+							`hover:underline ${isActive ? 'underline' : 'text-foreground/50'}`
 						}
 						to={route.href}
 						end={route.end}
diff --git a/app/routes/c.$companyId+/sales.tsx b/app/routes/c.$companyId+/sales.tsx
index 5438a01..b2d2174 100644
--- a/app/routes/c.$companyId+/sales.tsx
+++ b/app/routes/c.$companyId+/sales.tsx
@@ -29,12 +29,12 @@ export default function SalesLayout() {
 		<>
 			<h1 className="text-h3 md:text-h2">Sales</h1>
 
-			<nav className="grid max-w-lg grid-flow-col gap-6 overflow-y-auto py-2 [scrollbar-width:none]">
+			<nav className="grid max-w-lg grid-flow-col gap-6 overflow-y-auto text-nowrap py-2 font-semibold [scrollbar-width:none]">
 				{salesRoutes.map(route => (
 					<NavLink
 						key={route.title}
 						className={({ isActive }) =>
-							`font-semibold hover:underline ${isActive ? 'underline' : 'text-foreground/50'}`
+							`hover:underline ${isActive ? 'underline' : 'text-foreground/50'}`
 						}
 						to={route.href}
 						end={route.end}
diff --git a/app/routes/c.$companyId.customers+/$customerId_.edit.tsx b/app/routes/c.$companyId.customers+/$customerId_.edit.tsx
new file mode 100644
index 0000000..63968cc
--- /dev/null
+++ b/app/routes/c.$companyId.customers+/$customerId_.edit.tsx
@@ -0,0 +1,58 @@
+import { invariantResponse } from '@epic-web/invariant'
+import { json, type LoaderFunctionArgs } from '@remix-run/node'
+import { useLoaderData } from '@remix-run/react'
+import { GeneralErrorBoundary } from '#app/components/error-boundary.tsx'
+import { prisma } from '#app/utils/db.server.ts'
+import { requireCompanyUserWithRBAC } from '#app/utils/permissions.server.ts'
+import { CustomerAccountEditor, action } from './__customer-account-editor.tsx'
+
+export { action }
+
+export async function loader({ params, request }: LoaderFunctionArgs) {
+	await requireCompanyUserWithRBAC({
+		request,
+		companyId: params.companyId!,
+		permission: 'create:company-account',
+	})
+
+	const customerAccount = await prisma.customerAccount.findFirst({
+		where: {
+			id: params.customerId!,
+			companyId: params.companyId,
+		},
+		select: {
+			id: true,
+			name: true,
+			uniqueId: true,
+			email: true,
+			phone: true,
+			address: true,
+			country: true,
+			city: true,
+			state: true,
+			zip: true,
+		},
+	})
+
+	invariantResponse(customerAccount, 'Not found', { status: 404 })
+
+	return json({ customerAccount: customerAccount })
+}
+
+export default function CompanyAccountsEdit() {
+	const data = useLoaderData<typeof loader>()
+
+	return <CustomerAccountEditor customerAccount={data.customerAccount} />
+}
+
+export function ErrorBoundary() {
+	return (
+		<GeneralErrorBoundary
+			statusHandlers={{
+				404: ({ params }) => (
+					<p>No account with the id "{params.customerId}" exists</p>
+				),
+			}}
+		/>
+	)
+}
diff --git a/app/routes/c.$companyId.customers+/__customer-account-editor.tsx b/app/routes/c.$companyId.customers+/__customer-account-editor.tsx
new file mode 100644
index 0000000..20f2a99
--- /dev/null
+++ b/app/routes/c.$companyId.customers+/__customer-account-editor.tsx
@@ -0,0 +1,267 @@
+import { getFormProps, getInputProps, useForm } from '@conform-to/react'
+import { getZodConstraint, parseWithZod } from '@conform-to/zod'
+import { type CustomerAccount } from '@prisma/client'
+import {
+	json,
+	type ActionFunctionArgs,
+	type SerializeFrom,
+} from '@remix-run/node'
+import { Form, redirect, useActionData } from '@remix-run/react'
+import { z } from 'zod'
+import { Field } from '#app/components/forms'
+import { StatusButton } from '#app/components/ui/status-button'
+import { prisma } from '#app/utils/db.server'
+import { useIsPending } from '#app/utils/misc'
+import { requireCompanyUserWithRBAC } from '#app/utils/permissions.server'
+
+// TODO: Make a better component to handle country, state, and city inputs
+// ? Maybe a select component with api data
+
+const CompanyAccountsNewSchema = z.object({
+	id: z.string().optional(),
+	name: z.string().min(3).max(40),
+	uniqueId: z.string().min(4).max(24).optional(),
+	email: z.string().email().optional(),
+	phone: z.string().min(7).max(15).optional(),
+	address: z.string().min(4).max(40).optional(),
+	country: z.string().min(4).max(24).optional(),
+	city: z.string().min(4).max(24).optional(),
+	state: z.string().min(4).max(24).optional(),
+	zip: z.string().min(4).max(12).optional(),
+	// description: z.string().min(4).max(80).optional(),
+})
+
+export async function action({ request, params }: ActionFunctionArgs) {
+	const user = await requireCompanyUserWithRBAC({
+		request,
+		companyId: params.companyId!,
+		permission: 'create:company-account',
+		select: {
+			userCompanies: {
+				select: {
+					id: true,
+				},
+			},
+		},
+	})
+
+	const formData = await request.formData()
+
+	const submission = await parseWithZod(formData, {
+		schema: CompanyAccountsNewSchema.superRefine(async (data, ctx) => {
+			const checkName = await prisma.company.findFirst({
+				where: {
+					customers: {
+						some: {
+							name: data.name,
+						},
+					},
+				},
+			})
+
+			if (checkName) {
+				ctx.addIssue({
+					path: ['name'],
+					code: z.ZodIssueCode.custom,
+					message: 'Name already exists',
+				})
+			}
+		}),
+		async: true,
+	})
+
+	if (submission.status !== 'success') {
+		return json(
+			{ result: submission.reply() },
+			{ status: submission.status === 'error' ? 400 : 200 },
+		)
+	}
+
+	const {
+		id: customerAccountId,
+		name,
+		uniqueId,
+		email,
+		phone,
+		address,
+		city,
+		state,
+		country,
+		zip,
+	} = submission.value
+
+	await prisma.customerAccount.upsert({
+		where: {
+			id: customerAccountId ?? '__new_customer__',
+		},
+		create: {
+			name,
+			uniqueId,
+			email,
+			phone,
+			address,
+			city,
+			state,
+			country,
+			zip,
+			companyId: params.companyId!,
+			createdById: user.userCompanies[0].id,
+		},
+		update: {
+			name,
+			uniqueId,
+			email,
+			phone,
+			address,
+			city,
+			state,
+			country,
+			zip,
+		},
+	})
+
+	return redirect(`/c/${params.companyId}/customers`)
+}
+
+export function CustomerAccountEditor({
+	customerAccount,
+}: {
+	customerAccount?: SerializeFrom<
+		Pick<
+			CustomerAccount,
+			| 'id'
+			| 'name'
+			| 'uniqueId'
+			| 'email'
+			| 'phone'
+			| 'address'
+			| 'country'
+			| 'state'
+			| 'city'
+			| 'zip'
+		>
+	>
+}) {
+	const actionData = useActionData<typeof action>()
+	const isPending = useIsPending()
+
+	const [form, fields] = useForm({
+		id: 'company-accounts-new-form',
+		constraint: getZodConstraint(CompanyAccountsNewSchema),
+		lastResult: actionData?.result,
+		onValidate({ formData }) {
+			return parseWithZod(formData, { schema: CompanyAccountsNewSchema })
+		},
+		defaultValue: {
+			...customerAccount,
+		},
+		shouldRevalidate: 'onBlur',
+	})
+
+	return (
+		<>
+			<div className="flex items-center">
+				<p className="text-lg font-bold">Customer Account Editor</p>
+				<div className="ml-2 cursor-pointer">
+					<svg
+						xmlns="http://www.w3.org/2000/svg"
+						viewBox="0 0 24 24"
+						width={16}
+						height={16}
+					>
+						<path
+							className="heroicon-ui"
+							d="M12 22a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm0-9a1 1 0 0 1 1 1v4a1 1 0 0 1-2 0v-4a1 1 0 0 1 1-1zm0-4a1 1 0 1 1 0 2 1 1 0 0 1 0-2z"
+							fill="currentColor"
+						/>
+					</svg>
+				</div>
+			</div>
+
+			<Form method="POST" {...getFormProps(form)}>
+				<button type="submit" className="hidden" />
+				{customerAccount ? (
+					<input type="hidden" name="id" value={customerAccount.id} />
+				) : null}
+
+				<div className="grid gap-x-6 sm:grid-cols-6">
+					<div className="sm:col-span-3">
+						<Field
+							labelProps={{ children: 'Full Name *' }}
+							inputProps={{
+								...getInputProps(fields.name, { type: 'text' }),
+								autoFocus: true,
+							}}
+							errors={fields.name.errors}
+						/>
+					</div>
+
+					<div className="sm:col-span-3">
+						<Field
+							labelProps={{ children: 'Unique ID' }}
+							inputProps={getInputProps(fields.uniqueId, { type: 'text' })}
+							errors={fields.uniqueId.errors}
+						/>
+					</div>
+
+					<div className="sm:col-span-4">
+						<Field
+							labelProps={{ children: 'Email' }}
+							inputProps={getInputProps(fields.email, { type: 'email' })}
+							errors={fields.email.errors}
+						/>
+					</div>
+
+					<div className="sm:col-span-3">
+						<Field
+							labelProps={{ children: 'Phone' }}
+							inputProps={getInputProps(fields.phone, { type: 'tel' })}
+							errors={fields.phone.errors}
+						/>
+					</div>
+
+					<div className="col-span-full">
+						<Field
+							labelProps={{ children: 'Address' }}
+							inputProps={getInputProps(fields.address, { type: 'text' })}
+							errors={fields.address.errors}
+						/>
+					</div>
+
+					<div className="sm:col-span-2 sm:col-start-1">
+						<Field
+							labelProps={{ children: 'City' }}
+							inputProps={getInputProps(fields.city, { type: 'text' })}
+							errors={fields.city.errors}
+						/>
+					</div>
+
+					<div className="sm:col-span-2">
+						<Field
+							labelProps={{ children: 'State' }}
+							inputProps={getInputProps(fields.state, { type: 'text' })}
+							errors={fields.state.errors}
+						/>
+					</div>
+
+					<div className="sm:col-span-2">
+						<Field
+							labelProps={{ children: 'Country' }}
+							inputProps={getInputProps(fields.country, { type: 'text' })}
+							errors={fields.country.errors}
+						/>
+					</div>
+					<StatusButton
+						form={form.id}
+						type="submit"
+						disabled={isPending}
+						status={isPending ? 'pending' : 'idle'}
+						className="sticky bottom-4 sm:col-span-2"
+					>
+						Submit
+					</StatusButton>
+				</div>
+			</Form>
+		</>
+	)
+}
diff --git a/app/routes/c.$companyId.accounts+/index.tsx b/app/routes/c.$companyId.customers+/index.tsx
similarity index 73%
rename from app/routes/c.$companyId.accounts+/index.tsx
rename to app/routes/c.$companyId.customers+/index.tsx
index 9dbdab6..aec1696 100644
--- a/app/routes/c.$companyId.accounts+/index.tsx
+++ b/app/routes/c.$companyId.customers+/index.tsx
@@ -1,6 +1,6 @@
 import { invariantResponse } from '@epic-web/invariant'
 import { type LoaderFunctionArgs, json } from '@remix-run/node'
-import { useLoaderData } from '@remix-run/react'
+import { Link, useLoaderData } from '@remix-run/react'
 import { requireUserId } from '#app/utils/auth.server'
 import { PLATFORM_STATUS } from '#app/utils/constants/platform-status'
 import { prisma } from '#app/utils/db.server'
@@ -19,7 +19,7 @@ export async function loader({ request, params }: LoaderFunctionArgs) {
 			platformStatusKey: PLATFORM_STATUS.ACTIVE.KEY,
 		},
 		select: {
-			accounts: {
+			customers: {
 				select: {
 					id: true,
 					name: true,
@@ -33,13 +33,19 @@ export async function loader({ request, params }: LoaderFunctionArgs) {
 	return json({ company })
 }
 
-export default function CompanyAccountsOverview() {
+export default function CompanyCustomerAccountsOverview() {
 	const data = useLoaderData<typeof loader>()
 
 	return (
 		<div>
 			<h1>Overview Route</h1>
-			{/* <div>{data.company.PurchaseBill.map()}</div> */}
+			<div className="flex gap-10">
+				{data.company.customers.map(customer => (
+					<Link to={`${customer.id}/edit`} key={customer.id}>
+						{customer.name}
+					</Link>
+				))}
+			</div>
 		</div>
 	)
 }
diff --git a/app/routes/c.$companyId.customers+/new.tsx b/app/routes/c.$companyId.customers+/new.tsx
new file mode 100644
index 0000000..0050776
--- /dev/null
+++ b/app/routes/c.$companyId.customers+/new.tsx
@@ -0,0 +1,16 @@
+import { type LoaderFunctionArgs } from '@remix-run/node'
+import { requireCompanyUserWithRBAC } from '#app/utils/permissions.server'
+import { CustomerAccountEditor, action } from './__customer-account-editor'
+
+export async function loader({ request, params }: LoaderFunctionArgs) {
+	await requireCompanyUserWithRBAC({
+		request,
+		companyId: params.companyId!,
+		permission: 'create:company-account',
+	})
+
+	return null
+}
+
+export { action }
+export default CustomerAccountEditor
diff --git a/app/routes/c.$companyId.purchases+/index.tsx b/app/routes/c.$companyId.purchases+/index.tsx
index c4de7c1..8d9fe60 100644
--- a/app/routes/c.$companyId.purchases+/index.tsx
+++ b/app/routes/c.$companyId.purchases+/index.tsx
@@ -22,12 +22,12 @@ export async function loader({ request, params }: LoaderFunctionArgs) {
 			PurchaseBill: {
 				select: {
 					id: true,
-					issuedBy: {
+					paidToAccount: {
 						select: {
 							name: true,
 						},
 					},
-					issuedById: true,
+					paidToAccountId: true,
 					totalAmount: true,
 				},
 			},
@@ -44,8 +44,13 @@ export default function CompanyPurchasesOverview() {
 
 	return (
 		<div>
-			<h1>Overview Route</h1>
-			{/* <div>{data.company.PurchaseBill.map()}</div> */}
+			<ul>
+				{data.company.PurchaseBill.map(bill => (
+					<li key={bill.id} className="flex w-full">
+						<div>{bill.paidToAccount.name}</div>
+					</li>
+				))}
+			</ul>
 		</div>
 	)
 }
diff --git a/app/routes/c.$companyId.accounts+/new.tsx b/app/routes/c.$companyId.purchases+/new.tsx
similarity index 82%
rename from app/routes/c.$companyId.accounts+/new.tsx
rename to app/routes/c.$companyId.purchases+/new.tsx
index 9dbdab6..e70f6c1 100644
--- a/app/routes/c.$companyId.accounts+/new.tsx
+++ b/app/routes/c.$companyId.purchases+/new.tsx
@@ -19,10 +19,16 @@ export async function loader({ request, params }: LoaderFunctionArgs) {
 			platformStatusKey: PLATFORM_STATUS.ACTIVE.KEY,
 		},
 		select: {
-			accounts: {
+			PurchaseBill: {
 				select: {
 					id: true,
-					name: true,
+					paidToAccount: {
+						select: {
+							name: true,
+						},
+					},
+					paidToAccountId: true,
+					totalAmount: true,
 				},
 			},
 		},
@@ -33,13 +39,12 @@ export async function loader({ request, params }: LoaderFunctionArgs) {
 	return json({ company })
 }
 
-export default function CompanyAccountsOverview() {
+export default function CompanyPurchasesNew() {
 	const data = useLoaderData<typeof loader>()
 
 	return (
 		<div>
 			<h1>Overview Route</h1>
-			{/* <div>{data.company.PurchaseBill.map()}</div> */}
 		</div>
 	)
 }
diff --git a/app/routes/studio+/c.new.tsx b/app/routes/studio+/c.new.tsx
index bf05031..76da49b 100644
--- a/app/routes/studio+/c.new.tsx
+++ b/app/routes/studio+/c.new.tsx
@@ -8,9 +8,9 @@ import { Form, json, useActionData } from '@remix-run/react'
 import { z } from 'zod'
 import { Field } from '#app/components/forms'
 import { requireUserId } from '#app/utils/auth.server'
+import { PLATFORM_STATUS } from '#app/utils/constants/platform-status'
 import { prisma } from '#app/utils/db.server'
 import { redirectWithToast } from '#app/utils/toast.server'
-import { PLATFORM_STATUS } from '#app/utils/constants/platform-status'
 
 export async function loader({ request }: LoaderFunctionArgs) {
 	await requireUserId(request)
diff --git a/app/routes/studio+/index.tsx b/app/routes/studio+/index.tsx
index 616cd96..3f87bce 100644
--- a/app/routes/studio+/index.tsx
+++ b/app/routes/studio+/index.tsx
@@ -23,7 +23,7 @@ export async function loader({ request }: LoaderFunctionArgs) {
 							name: true,
 						},
 					},
-					Role: {
+					roles: {
 						select: {
 							name: true,
 							permissions: true,
diff --git a/app/routes/users+/$username_+/notes.$noteId_.edit.tsx b/app/routes/users+/$username_+/notes.$noteId_.edit.tsx
index ef16acc..6ef57ae 100644
--- a/app/routes/users+/$username_+/notes.$noteId_.edit.tsx
+++ b/app/routes/users+/$username_+/notes.$noteId_.edit.tsx
@@ -42,7 +42,7 @@ export function ErrorBoundary() {
 		<GeneralErrorBoundary
 			statusHandlers={{
 				404: ({ params }) => (
-					<p>No note with the id "{params.noteId}" exists</p>
+					<p>No note with the id == 0 g "{params.noteId}" exists</p>
 				),
 			}}
 		/>
diff --git a/app/styles/tailwind.css b/app/styles/tailwind.css
index e2ea39c..5c37c9e 100644
--- a/app/styles/tailwind.css
+++ b/app/styles/tailwind.css
@@ -57,3 +57,8 @@
 		--ring: 142.4 71.8% 29.2%;
 	}
 }
+
+html {
+	scrollbar-gutter: stable;
+	scrollbar-width: thin;
+}
diff --git a/app/utils/permissions.server.ts b/app/utils/permissions.server.ts
index d96fa91..81ef884 100644
--- a/app/utils/permissions.server.ts
+++ b/app/utils/permissions.server.ts
@@ -1,5 +1,7 @@
-import { json } from '@remix-run/node'
+import { type Prisma } from '@prisma/client'
+import { json, redirect } from '@remix-run/node'
 import { requireUserId } from './auth.server.ts'
+import { PLATFORM_STATUS } from './constants/platform-status.ts'
 import { prisma } from './db.server.ts'
 import { type PermissionString, parsePermissionString } from './user.ts'
 
@@ -58,3 +60,62 @@ export async function requireUserWithRole(request: Request, name: string) {
 	}
 	return user.id
 }
+
+// TODO: Refactor this maybe?
+
+export async function requireCompanyUserWithRBAC({
+	request,
+	companyId,
+	permission,
+	// role,
+	select,
+}: {
+	request: Request
+	companyId: string
+	permission: PermissionString
+	// role?: string
+	select?: Prisma.UserSelect
+}) {
+	const userId = await requireUserId(request)
+	const permissionData = parsePermissionString(permission)
+
+	const user = await prisma.user.findFirst({
+		select: select ?? { id: true },
+		where: {
+			id: userId,
+			userCompanies: {
+				some: {
+					companyId,
+					company: {
+						platformStatusKey: PLATFORM_STATUS.ACTIVE.KEY,
+					},
+					OR: [
+						{
+							roles: {
+								some: {
+									// name: role,
+									permissions: {
+										some: {
+											...permissionData,
+											access: permissionData.access
+												? { in: permissionData.access }
+												: undefined,
+										},
+									},
+								},
+							},
+						},
+						{
+							isOwner: true,
+						},
+					],
+				},
+			},
+		},
+	})
+	if (!user) {
+		throw redirect('/')
+	}
+
+	return user
+}
diff --git a/app/utils/user.ts b/app/utils/user.ts
index 7592480..6106a80 100644
--- a/app/utils/user.ts
+++ b/app/utils/user.ts
@@ -25,7 +25,14 @@ export function useUser() {
 }
 
 type Action = 'create' | 'read' | 'update' | 'delete'
-type Entity = 'user' | 'note' | 'company'
+type Entity =
+	| 'user'
+	| 'note'
+	| 'company'
+	| 'company-sale'
+	| 'company-purchase'
+	| 'company-account'
+	| 'company-report'
 type Access = 'own' | 'any' | 'own,any' | 'any,own'
 export type PermissionString =
 	| `${Action}:${Entity}`
diff --git a/package-lock.json b/package-lock.json
index 464e158..039be69 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -6,8 +6,8 @@
     "": {
       "name": "bookbreeze-5848",
       "dependencies": {
-        "@conform-to/react": "^1.0.0",
-        "@conform-to/zod": "^1.0.0",
+        "@conform-to/react": "^1.0.1",
+        "@conform-to/zod": "^1.0.1",
         "@epic-web/cachified": "^4.0.0",
         "@epic-web/client-hints": "^1.2.2",
         "@epic-web/invariant": "^1.0.0",
@@ -29,8 +29,8 @@
         "@remix-run/node": "^2.6.0",
         "@remix-run/react": "^2.6.0",
         "@remix-run/server-runtime": "^2.6.0",
-        "@sentry/profiling-node": "^1.3.5",
-        "@sentry/remix": "^7.99.0",
+        "@sentry/profiling-node": "^7.100.1",
+        "@sentry/remix": "^7.100.1",
         "address": "^2.0.1",
         "autoprefixer": "^10.4.17",
         "bcryptjs": "^2.4.3",
@@ -75,7 +75,7 @@
         "zod": "^3.22.4"
       },
       "devDependencies": {
-        "@faker-js/faker": "^8.4.0",
+        "@faker-js/faker": "^8.4.1",
         "@playwright/test": "^1.41.2",
         "@remix-run/dev": "^2.6.0",
         "@remix-run/eslint-config": "^2.6.0",
@@ -95,22 +95,22 @@
         "@types/fs-extra": "^11.0.4",
         "@types/glob": "^8.1.0",
         "@types/morgan": "^1.9.9",
-        "@types/node": "^20.11.16",
+        "@types/node": "^20.11.17",
         "@types/qrcode": "^1.5.5",
-        "@types/react": "^18.2.54",
-        "@types/react-dom": "^18.2.18",
+        "@types/react": "^18.2.55",
+        "@types/react-dom": "^18.2.19",
         "@types/set-cookie-parser": "^2.4.7",
         "@types/source-map-support": "^0.5.10",
         "@vitejs/plugin-react": "^4.2.1",
         "@vitest/coverage-v8": "^1.2.2",
-        "chokidar": "^3.5.3",
+        "chokidar": "^3.6.0",
         "enforce-unique": "^1.2.0",
         "esbuild": "^0.20.0",
         "eslint": "^8.56.0",
         "eslint-config-prettier": "^9.1.0",
         "fs-extra": "^11.2.0",
         "jsdom": "^24.0.0",
-        "msw": "2.1.6",
+        "msw": "2.1.7",
         "node-html-parser": "^6.1.12",
         "npm-run-all": "^4.1.5",
         "prettier": "^3.2.5",
@@ -121,7 +121,7 @@
         "rimraf": "^5.0.5",
         "tsx": "^4.7.0",
         "typescript": "^5.3.3",
-        "vite": "^5.0.12",
+        "vite": "^5.1.1",
         "vitest": "^1.2.2"
       },
       "engines": {
@@ -980,27 +980,27 @@
       }
     },
     "node_modules/@conform-to/dom": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@conform-to/dom/-/dom-1.0.0.tgz",
-      "integrity": "sha512-KG0Ee2G9BcFLdqtpcexdht48QNM2F9ddAyJFSHNG4V3e2QOmVEAM7M6R/iWWykpTVQljWmKd2J7U4ep/7/XRrA=="
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@conform-to/dom/-/dom-1.0.1.tgz",
+      "integrity": "sha512-Ut1nqLfH84WbvPcZzoxDo6oFE3PxOUjWK2atxD+Z+F0Xwaw1hYQp5n8V3RLCR1iqfAnMIj3Wt6rjH2tOfBGLJg=="
     },
     "node_modules/@conform-to/react": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@conform-to/react/-/react-1.0.0.tgz",
-      "integrity": "sha512-TlMMmNDhYJhKJP9EOyV2RbUEqjwR68GTO1KaO3LOI4WeVLx7aZ78k73qIuFMRjjZgsWOL4edD1CZtkKBRztmqw==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@conform-to/react/-/react-1.0.1.tgz",
+      "integrity": "sha512-QIIoU/KWRfDiFjM7LdSbVKjRDrigR/bKQBwSjkJAU4u1+dT0sszFPZ2x4kMNMNyqsWbYI/jJ8nws4+2hFzZCSQ==",
       "dependencies": {
-        "@conform-to/dom": "1.0.0"
+        "@conform-to/dom": "1.0.1"
       },
       "peerDependencies": {
         "react": ">=18"
       }
     },
     "node_modules/@conform-to/zod": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/@conform-to/zod/-/zod-1.0.0.tgz",
-      "integrity": "sha512-oWOfqEpCRZpOY7mxJe73oluy6Fvjbw8tYhXfDqZqFb0ePf+bFkF7g1Wzfkgz76LvWJHb0PNykn+o5f423aqb+w==",
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/@conform-to/zod/-/zod-1.0.1.tgz",
+      "integrity": "sha512-oCvXlyAj63MIJfRY4YFYdsiQgy7pTAKP5WrthTiaZqpoiyMIW8+EN8qv+UiIcTcIivrgtJECY336PsHgdkwhUQ==",
       "dependencies": {
-        "@conform-to/dom": "1.0.0"
+        "@conform-to/dom": "1.0.1"
       },
       "peerDependencies": {
         "zod": "^3.21.0"
@@ -1527,9 +1527,9 @@
       }
     },
     "node_modules/@faker-js/faker": {
-      "version": "8.4.0",
-      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-8.4.0.tgz",
-      "integrity": "sha512-htW87352wzUCdX1jyUQocUcmAaFqcR/w082EC8iP/gtkF0K+aKcBp0hR5Arb7dzR8tQ1TrhE9DNa5EbJELm84w==",
+      "version": "8.4.1",
+      "resolved": "https://registry.npmjs.org/@faker-js/faker/-/faker-8.4.1.tgz",
+      "integrity": "sha512-XQ3cU+Q8Uqmrbf2e0cIC/QN43sTBSC8KF12u29Mb47tWrt2hAgBXSgpZMj4Ao8Uk0iJcU99QsOCaIL8934obCg==",
       "dev": true,
       "funding": [
         {
@@ -1781,9 +1781,9 @@
       }
     },
     "node_modules/@mswjs/interceptors": {
-      "version": "0.25.15",
-      "resolved": "https://registry.npmjs.org/@mswjs/interceptors/-/interceptors-0.25.15.tgz",
-      "integrity": "sha512-s4jdyxmq1eeftfDXJ7MUiK/jlvYaU8Sr75+42hHCVBrYez0k51RHbMitKIKdmsF92Q6gwhp8Sm1MmvdA9llpcg==",
+      "version": "0.25.16",
+      "resolved": "https://registry.npmjs.org/@mswjs/interceptors/-/interceptors-0.25.16.tgz",
+      "integrity": "sha512-8QC8JyKztvoGAdPgyZy49c9vSHHAZjHagwl4RY9E8carULk8ym3iTaiawrT1YoLF/qb449h48f71XDPgkUSOUg==",
       "dev": true,
       "dependencies": {
         "@open-draft/deferred-promise": "^2.2.0",
@@ -4180,66 +4180,66 @@
       }
     },
     "node_modules/@sentry-internal/feedback": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry-internal/feedback/-/feedback-7.99.0.tgz",
-      "integrity": "sha512-exIO1o+bE0MW4z30FxC0cYzJ4ZHSMlDPMHCBDPzU+MWGQc/fb8s58QUrx5Dnm6HTh9G3H+YlroCxIo9u0GSwGQ==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/feedback/-/feedback-7.100.1.tgz",
+      "integrity": "sha512-yqcRVnjf+qS+tC4NxOKLJOaSJ+csHmh/dHUzvCTkf5rLsplwXYRnny2r0tqGTQ4tuXMxwgSMKPYwicg81P+xuw==",
       "dependencies": {
-        "@sentry/core": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0"
+        "@sentry/core": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1"
       },
       "engines": {
         "node": ">=12"
       }
     },
     "node_modules/@sentry-internal/replay-canvas": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry-internal/replay-canvas/-/replay-canvas-7.99.0.tgz",
-      "integrity": "sha512-PoIkfusToDq0snfl2M6HJx/1KJYtXxYhQplrn11kYadO04SdG0XGXf4h7wBTMEQ7LDEAtQyvsOu4nEQtTO3YjQ==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/replay-canvas/-/replay-canvas-7.100.1.tgz",
+      "integrity": "sha512-TnqxqJGhbFhhYRhTG2WLFer+lVieV7mNGeIxFBiw1L4kuj8KGl+C0sknssKyZSRVJFSahhHIosHJGRMkkD//7g==",
       "dependencies": {
-        "@sentry/core": "7.99.0",
-        "@sentry/replay": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0"
+        "@sentry/core": "7.100.1",
+        "@sentry/replay": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1"
       },
       "engines": {
         "node": ">=12"
       }
     },
     "node_modules/@sentry-internal/tracing": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry-internal/tracing/-/tracing-7.99.0.tgz",
-      "integrity": "sha512-z3JQhHjoM1KdM20qrHwRClKJrNLr2CcKtCluq7xevLtXHJWNAQQbafnWD+Aoj85EWXBzKt9yJMv2ltcXJ+at+w==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry-internal/tracing/-/tracing-7.100.1.tgz",
+      "integrity": "sha512-+u9RRf5eL3StiyiRyAHZmdkAR7GTSGx4Mt4Lmi5NEtCcWlTGZ1QgW2r8ZbhouVmTiJkjhQgYCyej3cojtazeJg==",
       "dependencies": {
-        "@sentry/core": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0"
+        "@sentry/core": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1"
       },
       "engines": {
         "node": ">=8"
       }
     },
     "node_modules/@sentry/browser": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-7.99.0.tgz",
-      "integrity": "sha512-bgfoUv3wkwwLgN5YUOe0ibB3y268ZCnamZh6nLFqnY/UBKC1+FXWFdvzVON/XKUm62LF8wlpCybOf08ebNj2yg==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/browser/-/browser-7.100.1.tgz",
+      "integrity": "sha512-IxHQ08ixf0bmaWpe4yt1J4UUsOpg02fxax9z3tOQYXw5MSzz5pDXn8M8DFUVJB3wWuyXhHXTub9yD3VIP9fnoA==",
       "dependencies": {
-        "@sentry-internal/feedback": "7.99.0",
-        "@sentry-internal/replay-canvas": "7.99.0",
-        "@sentry-internal/tracing": "7.99.0",
-        "@sentry/core": "7.99.0",
-        "@sentry/replay": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0"
+        "@sentry-internal/feedback": "7.100.1",
+        "@sentry-internal/replay-canvas": "7.100.1",
+        "@sentry-internal/tracing": "7.100.1",
+        "@sentry/core": "7.100.1",
+        "@sentry/replay": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1"
       },
       "engines": {
         "node": ">=8"
       }
     },
     "node_modules/@sentry/cli": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli/-/cli-2.25.2.tgz",
-      "integrity": "sha512-lgt1QPaCfs/QZNXwyw3gvuBR2/CLwFSdU/oT7Bpxwizz8XVXhlKS98zJF1UVCy7SecsDSoOI0Z+B+X658cpquQ==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli/-/cli-2.28.0.tgz",
+      "integrity": "sha512-0vdMTeN3Ip1wI9T7F6GupuaOocIrfyHpAN3iUztsO7PY2j7e/+m69DRkU99aPTlmUgQikZjtVaHkTsEMLt3lgA==",
       "hasInstallScript": true,
       "dependencies": {
         "https-proxy-agent": "^5.0.0",
@@ -4255,19 +4255,19 @@
         "node": ">= 10"
       },
       "optionalDependencies": {
-        "@sentry/cli-darwin": "2.25.2",
-        "@sentry/cli-linux-arm": "2.25.2",
-        "@sentry/cli-linux-arm64": "2.25.2",
-        "@sentry/cli-linux-i686": "2.25.2",
-        "@sentry/cli-linux-x64": "2.25.2",
-        "@sentry/cli-win32-i686": "2.25.2",
-        "@sentry/cli-win32-x64": "2.25.2"
+        "@sentry/cli-darwin": "2.28.0",
+        "@sentry/cli-linux-arm": "2.28.0",
+        "@sentry/cli-linux-arm64": "2.28.0",
+        "@sentry/cli-linux-i686": "2.28.0",
+        "@sentry/cli-linux-x64": "2.28.0",
+        "@sentry/cli-win32-i686": "2.28.0",
+        "@sentry/cli-win32-x64": "2.28.0"
       }
     },
     "node_modules/@sentry/cli-darwin": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli-darwin/-/cli-darwin-2.25.2.tgz",
-      "integrity": "sha512-o1d5NnVUrc1dxDm56k7Co8tSTcOuxbApdxweVXXsiq20HblZCyIi7WxxRkAg4RfKx594sKGiw9uCVvECi+9UpA==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-darwin/-/cli-darwin-2.28.0.tgz",
+      "integrity": "sha512-GgpayUQcGjT55Dc7oojjbqIYIUaBAr4za7D9yU5foMTJ6QjMTovmtE1bVj4bVKzK+0aIiZvZ2dg2g6jF0iGqfg==",
       "optional": true,
       "os": [
         "darwin"
@@ -4277,9 +4277,9 @@
       }
     },
     "node_modules/@sentry/cli-linux-arm": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-arm/-/cli-linux-arm-2.25.2.tgz",
-      "integrity": "sha512-n398jd87Ymejt5k/6RjCEjXAvntOWuqhBDANxzhgr5/9FzbODJ844g1mOpcxiIlduzKSzWlPbTEKQulMp2Mt4w==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-arm/-/cli-linux-arm-2.28.0.tgz",
+      "integrity": "sha512-hjCRyZBNri+gNoMO22g2qevKcUOnDGhTjmyq14q2rXT0KHb4LjyMpebSgE63YTLDj/qxq4MSq8kcjD/jDzSpLw==",
       "cpu": [
         "arm"
       ],
@@ -4293,9 +4293,9 @@
       }
     },
     "node_modules/@sentry/cli-linux-arm64": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-arm64/-/cli-linux-arm64-2.25.2.tgz",
-      "integrity": "sha512-lm5jaigV6xu9Gwo0wNk+bX6yVkl5k3gNXcSXcKCISFo+Teb7Zhf9IyXANPm4VY2DdiZAjPJt8gS1bu+Mn7irtQ==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-arm64/-/cli-linux-arm64-2.28.0.tgz",
+      "integrity": "sha512-QZtl4dyVMrsWEuRCN8h3RMQSjekM6LmdAWiEIxCgVMvTueau31EQz1jokGpaYotAsWK2GyzFALiCA3QwMCTtnA==",
       "cpu": [
         "arm64"
       ],
@@ -4309,9 +4309,9 @@
       }
     },
     "node_modules/@sentry/cli-linux-i686": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-i686/-/cli-linux-i686-2.25.2.tgz",
-      "integrity": "sha512-/YYx2gfqO5mkxyBgFcnDbZzkZ2+2xNarwrqWcqq3Qw0XlO9DWAQB2G+twV1RW/UfSU6fFIWErn94efh2EWmyzQ==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-i686/-/cli-linux-i686-2.28.0.tgz",
+      "integrity": "sha512-fgT0G6b1OCBHtrIClNrFfO8w5pVw7yIqtVsq4Bf+FJOwkD2buaPx1Qt66aGP+3+AexXO5pXfagN4+ykSsKqKZA==",
       "cpu": [
         "x86",
         "ia32"
@@ -4326,9 +4326,9 @@
       }
     },
     "node_modules/@sentry/cli-linux-x64": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-x64/-/cli-linux-x64-2.25.2.tgz",
-      "integrity": "sha512-rRafqy84R5mYA4JEfNsUeN10af5euJnK7fgqYM0mJIaplHC2YEXT9aUYWoryWPZiYqmdNUhsA6lX7iynSW9pZw==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-linux-x64/-/cli-linux-x64-2.28.0.tgz",
+      "integrity": "sha512-mrqbxpo6dF8iC4nz0+TS8ymIeNKy6gngcmlRVfOBuVEP9+Ry8HAeIzuKwbt4QAA6lwKCbPsEwK5ZLsrJEJIC6A==",
       "cpu": [
         "x64"
       ],
@@ -4342,9 +4342,9 @@
       }
     },
     "node_modules/@sentry/cli-win32-i686": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli-win32-i686/-/cli-win32-i686-2.25.2.tgz",
-      "integrity": "sha512-plT/gi41F+67g9AwrEm4avRXnjCtHCcnRnJ6zPu/iINGap8mvYQJSU/qM0oGwV6hRGg3JJN66XIvJPIuIs8P8w==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-win32-i686/-/cli-win32-i686-2.28.0.tgz",
+      "integrity": "sha512-yzji557eqz4XW7z8k0LF4LiIwFAqxPlpVnoeN8ntk8hi/ehXm9AdvPqA+bw7cRK5iu4/Tqr4OJeGPbcI5iKpgQ==",
       "cpu": [
         "x86",
         "ia32"
@@ -4358,9 +4358,9 @@
       }
     },
     "node_modules/@sentry/cli-win32-x64": {
-      "version": "2.25.2",
-      "resolved": "https://registry.npmjs.org/@sentry/cli-win32-x64/-/cli-win32-x64-2.25.2.tgz",
-      "integrity": "sha512-Mb6mAyPi9gIfpzF5MTk0JXgFP9nxka3Fb7JYn6AY4RW++sOjapkTrcXL2Gp3ZfQkWj5rFTgln4+eNmZPsD2gzA==",
+      "version": "2.28.0",
+      "resolved": "https://registry.npmjs.org/@sentry/cli-win32-x64/-/cli-win32-x64-2.28.0.tgz",
+      "integrity": "sha512-5frag3uV+niuMVYQ3ME5Nwlv5uftV88xDUyaCe1UD9jfM8WqJPgvQYUNPgBQKynxwLAUp5zXII+47Vnn8mriOA==",
       "cpu": [
         "x64"
       ],
@@ -4387,59 +4387,56 @@
       }
     },
     "node_modules/@sentry/core": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.99.0.tgz",
-      "integrity": "sha512-vOAtzcAXEUtS/oW7wi3wMkZ3hsb5Ch96gKyrrj/mXdOp2zrcwdNV6N9/pawq2E9P/7Pw8AXw4CeDZztZrjQLuA==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/core/-/core-7.100.1.tgz",
+      "integrity": "sha512-f+ItUge/o9AjlveQq0ZUbQauKlPH1FIJbC1TRaYLJ4KNfOdrsh8yZ29RmWv0cFJ/e+FGTr603gWpRPObF5rM8Q==",
       "dependencies": {
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0"
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1"
       },
       "engines": {
         "node": ">=8"
       }
     },
     "node_modules/@sentry/node": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/node/-/node-7.99.0.tgz",
-      "integrity": "sha512-34wYtLddnPcQ8qvKq62AfxowaMFw+GMUZGv7fIs9FxeBqqqn6Ckl0gFCTADudIIBQ3rSbmN7sHJIXdyiQv+pcw==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/node/-/node-7.100.1.tgz",
+      "integrity": "sha512-jB6tBLr7BpgdE2SlYZu343vvpa5jMFnqyFlprr+jdDu/ayNF4idB0qFwQe8p4C6LI6M/MNDRLVOgPBiCjjZSpw==",
       "dependencies": {
-        "@sentry-internal/tracing": "7.99.0",
-        "@sentry/core": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0"
+        "@sentry-internal/tracing": "7.100.1",
+        "@sentry/core": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1"
       },
       "engines": {
         "node": ">=8"
       }
     },
     "node_modules/@sentry/profiling-node": {
-      "version": "1.3.5",
-      "resolved": "https://registry.npmjs.org/@sentry/profiling-node/-/profiling-node-1.3.5.tgz",
-      "integrity": "sha512-n2bfEbtLW3WuIMQGyxKJKzBNZOb1JYfMeJQ2WQn/42F++69m+u7T0S3EDGRN0Y//fbt5+r0any+4r3kChRXZkQ==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/profiling-node/-/profiling-node-7.100.1.tgz",
+      "integrity": "sha512-Q/B7SntzB/qt0Y/MZK8dBy8PIf6nCT/kdnn+wrTIFicxozqsF3hq5vmKvGyVUWobb3FrNjc2dSuDXTijN1xmkQ==",
       "hasInstallScript": true,
       "dependencies": {
         "detect-libc": "^2.0.2",
         "node-abi": "^3.52.0"
       },
       "bin": {
-        "sentry-prune-profiler-binaries": "scripts/prune-profiler-binaries.mjs"
+        "sentry-prune-profiler-binaries": "scripts/prune-profiler-binaries.js"
       },
       "engines": {
         "node": ">=8.0.0"
-      },
-      "peerDependencies": {
-        "@sentry/node": "^7.44.1"
       }
     },
     "node_modules/@sentry/react": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-7.99.0.tgz",
-      "integrity": "sha512-RtHwgzMHJhzJfSQpVG0SDPQYMTGDX3Q37/YWI59S4ALMbSW4/F6n/eQAvGVYZKbh2UCSqgFuRWaXOYkSZT17wA==",
-      "dependencies": {
-        "@sentry/browser": "7.99.0",
-        "@sentry/core": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/react/-/react-7.100.1.tgz",
+      "integrity": "sha512-EdrBtrXVLK2LSx4Rvz/nQP7HZUZQmr+t3GHV8436RAhF6vs5mntACVMBoQJRWiUvtZ1iRo3rIsIdah7DLiFPgQ==",
+      "dependencies": {
+        "@sentry/browser": "7.100.1",
+        "@sentry/core": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1",
         "hoist-non-react-statics": "^3.3.2"
       },
       "engines": {
@@ -4450,16 +4447,16 @@
       }
     },
     "node_modules/@sentry/remix": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/remix/-/remix-7.99.0.tgz",
-      "integrity": "sha512-at3FtMacLyvzGB6Z0ljwGGGPGV2NU2L5Jqpv83eVXHtVZHGfbTw6vxSYj+T3t53hw4T6454SSkfY8HrUxBH6MQ==",
-      "dependencies": {
-        "@sentry/cli": "^2.23.0",
-        "@sentry/core": "7.99.0",
-        "@sentry/node": "7.99.0",
-        "@sentry/react": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/remix/-/remix-7.100.1.tgz",
+      "integrity": "sha512-xpX8rP59sVk/faZct7gLo3ixxeiL6A/kP4zY+AXGCk5S/TriyIiQLOix9G25rHbrSOcrKFG+Gj2wYfXQAEysKA==",
+      "dependencies": {
+        "@sentry/cli": "^2.28.0",
+        "@sentry/core": "7.100.1",
+        "@sentry/node": "7.100.1",
+        "@sentry/react": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1",
         "glob": "^10.3.4",
         "yargs": "^17.6.0"
       },
@@ -4476,33 +4473,33 @@
       }
     },
     "node_modules/@sentry/replay": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/replay/-/replay-7.99.0.tgz",
-      "integrity": "sha512-gyN/I2WpQrLAZDT+rScB/0jnFL2knEVBo8U8/OVt8gNP20Pq8T/rDZKO/TG0cBfvULDUbJj2P4CJryn2p/O2rA==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/replay/-/replay-7.100.1.tgz",
+      "integrity": "sha512-B1NFjzGEFaqejxBRdUyEzH8ChXc2kfiqlA/W/Lg0aoWIl2/7nuMk+l4ld9gW5F5bIAXDTVd5vYltb1lWEbpr7w==",
       "dependencies": {
-        "@sentry-internal/tracing": "7.99.0",
-        "@sentry/core": "7.99.0",
-        "@sentry/types": "7.99.0",
-        "@sentry/utils": "7.99.0"
+        "@sentry-internal/tracing": "7.100.1",
+        "@sentry/core": "7.100.1",
+        "@sentry/types": "7.100.1",
+        "@sentry/utils": "7.100.1"
       },
       "engines": {
         "node": ">=12"
       }
     },
     "node_modules/@sentry/types": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.99.0.tgz",
-      "integrity": "sha512-94qwOw4w40sAs5mCmzcGyj8ZUu/KhnWnuMZARRq96k+SjRW/tHFAOlIdnFSrt3BLPvSOK7R3bVAskZQ0N4FTmA==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/types/-/types-7.100.1.tgz",
+      "integrity": "sha512-fLM+LedHuKzOd8IhXBqaQuym+AA519MGjeczBa5kGakes/BbAsUMwsNfjsKQedp7Kh44RgYF99jwoRPK2oDrXw==",
       "engines": {
         "node": ">=8"
       }
     },
     "node_modules/@sentry/utils": {
-      "version": "7.99.0",
-      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.99.0.tgz",
-      "integrity": "sha512-cYZy5WNTkWs5GgggGnjfGqC44CWir0pAv4GVVSx0fsup4D4pMKBJPrtub15f9uC+QkUf3vVkqwpBqeFxtmJQTQ==",
+      "version": "7.100.1",
+      "resolved": "https://registry.npmjs.org/@sentry/utils/-/utils-7.100.1.tgz",
+      "integrity": "sha512-Ve6dXr1o6xiBe3VCoJgiutmBKrugryI65EZAbYto5XI+t+PjiLLf9wXtEMF24ZrwImo4Lv3E9Uqza+fWkEbw6A==",
       "dependencies": {
-        "@sentry/types": "7.99.0"
+        "@sentry/types": "7.100.1"
       },
       "engines": {
         "node": ">=8"
@@ -5614,9 +5611,9 @@
       "dev": true
     },
     "node_modules/@types/node": {
-      "version": "20.11.16",
-      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.11.16.tgz",
-      "integrity": "sha512-gKb0enTmRCzXSSUJDq6/sPcqrfCv2mkkG6Jt/clpn5eiCbKTY+SgZUxo+p8ZKMof5dCp9vHQUAB7wOUTod22wQ==",
+      "version": "20.11.17",
+      "resolved": "https://registry.npmjs.org/@types/node/-/node-20.11.17.tgz",
+      "integrity": "sha512-QmgQZGWu1Yw9TDyAP9ZzpFJKynYNeOvwMJmaxABfieQoVoiVOS6MN1WSpqpRcbeA5+RW82kraAVxCCJg+780Qw==",
       "dev": true,
       "dependencies": {
         "undici-types": "~5.26.4"
@@ -5650,9 +5647,9 @@
       "dev": true
     },
     "node_modules/@types/react": {
-      "version": "18.2.54",
-      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.54.tgz",
-      "integrity": "sha512-039k+vrVJymDoe2y+HLk3O3oI3sa+C8KNjuDKofqrIJK26ramnqLNj9VJTaxAzFGMvpW/79HrrAJapHzpQ9fGQ==",
+      "version": "18.2.55",
+      "resolved": "https://registry.npmjs.org/@types/react/-/react-18.2.55.tgz",
+      "integrity": "sha512-Y2Tz5P4yz23brwm2d7jNon39qoAtMMmalOQv6+fEFt1mT+FcM3D841wDpoUvFXhaYenuROCy3FZYqdTjM7qVyA==",
       "dev": true,
       "dependencies": {
         "@types/prop-types": "*",
@@ -5661,9 +5658,9 @@
       }
     },
     "node_modules/@types/react-dom": {
-      "version": "18.2.18",
-      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.18.tgz",
-      "integrity": "sha512-TJxDm6OfAX2KJWJdMEVTwWke5Sc/E/RlnPGvGfS0W7+6ocy2xhDVQVh/KvC2Uf7kACs+gDytdusDSdWfWkaNzw==",
+      "version": "18.2.19",
+      "resolved": "https://registry.npmjs.org/@types/react-dom/-/react-dom-18.2.19.tgz",
+      "integrity": "sha512-aZvQL6uUbIJpjZk4U8JZGbau9KDeAwMfmhyWorxgBkqDIEf6ROjRozcmPIicqsUwPUjbkDfHKgGee1Lq65APcA==",
       "dev": true,
       "dependencies": {
         "@types/react": "*"
@@ -8003,15 +8000,9 @@
       }
     },
     "node_modules/chokidar": {
-      "version": "3.5.3",
-      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.5.3.tgz",
-      "integrity": "sha512-Dr3sfKRP6oTcjf2JmUmFJfeVMvXBdegxB0iVQ5eb2V10uFJUCAS8OByZdVAyVb8xXNz3GjjTgj9kLWsZTqE6kw==",
-      "funding": [
-        {
-          "type": "individual",
-          "url": "https://paulmillr.com/funding/"
-        }
-      ],
+      "version": "3.6.0",
+      "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz",
+      "integrity": "sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==",
       "dependencies": {
         "anymatch": "~3.1.2",
         "braces": "~3.0.2",
@@ -8024,6 +8015,9 @@
       "engines": {
         "node": ">= 8.10.0"
       },
+      "funding": {
+        "url": "https://paulmillr.com/funding/"
+      },
       "optionalDependencies": {
         "fsevents": "~2.3.2"
       }
@@ -13962,16 +13956,16 @@
       "integrity": "sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w=="
     },
     "node_modules/msw": {
-      "version": "2.1.6",
-      "resolved": "https://registry.npmjs.org/msw/-/msw-2.1.6.tgz",
-      "integrity": "sha512-62NX1pdMa1C17U/6+SQjQFxwHx0bcWHzZoDN2mK97FvEttTkX9CyJqx3OcYYBpNykDx+segweaO4yxapjifj4g==",
+      "version": "2.1.7",
+      "resolved": "https://registry.npmjs.org/msw/-/msw-2.1.7.tgz",
+      "integrity": "sha512-yTIYqEMqDSrdbVMrfmqP6rTKQsnIbglTvVmAHDWwNegyXPXRcV+RjsaFEqubRS266gwWCDLm9YdOkWSKLdDvJQ==",
       "dev": true,
       "hasInstallScript": true,
       "dependencies": {
         "@bundled-es-modules/cookie": "^2.0.0",
         "@bundled-es-modules/statuses": "^1.0.1",
         "@mswjs/cookies": "^1.1.0",
-        "@mswjs/interceptors": "^0.25.15",
+        "@mswjs/interceptors": "^0.25.16",
         "@open-draft/until": "^2.1.0",
         "@types/cookie": "^0.6.0",
         "@types/statuses": "^2.0.4",
@@ -15197,9 +15191,9 @@
       }
     },
     "node_modules/postcss": {
-      "version": "8.4.33",
-      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.33.tgz",
-      "integrity": "sha512-Kkpbhhdjw2qQs2O2DGX+8m5OVqEcbB9HRBvuYM9pgrjEFUg30A9LmXNlTAUj4S9kgtGyrMbTzVjH7E+s5Re2yg==",
+      "version": "8.4.35",
+      "resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.35.tgz",
+      "integrity": "sha512-u5U8qYpBCpN13BsiEB0CbR1Hhh4Gc0zLFuedrHJKMctHCHAGrMdG0PRM/KErzAL3CU6/eckEtmHNB3x6e3c0vA==",
       "funding": [
         {
           "type": "opencollective",
@@ -19162,13 +19156,13 @@
       }
     },
     "node_modules/vite": {
-      "version": "5.0.12",
-      "resolved": "https://registry.npmjs.org/vite/-/vite-5.0.12.tgz",
-      "integrity": "sha512-4hsnEkG3q0N4Tzf1+t6NdN9dg/L3BM+q8SWgbSPnJvrgH2kgdyzfVJwbR1ic69/4uMJJ/3dqDZZE5/WwqW8U1w==",
+      "version": "5.1.1",
+      "resolved": "https://registry.npmjs.org/vite/-/vite-5.1.1.tgz",
+      "integrity": "sha512-wclpAgY3F1tR7t9LL5CcHC41YPkQIpKUGeIuT8MdNwNZr6OqOTLs7JX5vIHAtzqLWXts0T+GDrh9pN2arneKqg==",
       "dev": true,
       "dependencies": {
         "esbuild": "^0.19.3",
-        "postcss": "^8.4.32",
+        "postcss": "^8.4.35",
         "rollup": "^4.2.0"
       },
       "bin": {
diff --git a/package.json b/package.json
index 16895ce..f603ff5 100644
--- a/package.json
+++ b/package.json
@@ -38,8 +38,8 @@
     "/server-build"
   ],
   "dependencies": {
-    "@conform-to/react": "^1.0.0",
-    "@conform-to/zod": "^1.0.0",
+    "@conform-to/react": "^1.0.1",
+    "@conform-to/zod": "^1.0.1",
     "@epic-web/cachified": "^4.0.0",
     "@epic-web/client-hints": "^1.2.2",
     "@epic-web/invariant": "^1.0.0",
@@ -61,8 +61,8 @@
     "@remix-run/node": "^2.6.0",
     "@remix-run/react": "^2.6.0",
     "@remix-run/server-runtime": "^2.6.0",
-    "@sentry/profiling-node": "^1.3.5",
-    "@sentry/remix": "^7.99.0",
+    "@sentry/profiling-node": "^7.100.1",
+    "@sentry/remix": "^7.100.1",
     "address": "^2.0.1",
     "autoprefixer": "^10.4.17",
     "bcryptjs": "^2.4.3",
@@ -107,7 +107,7 @@
     "zod": "^3.22.4"
   },
   "devDependencies": {
-    "@faker-js/faker": "^8.4.0",
+    "@faker-js/faker": "^8.4.1",
     "@playwright/test": "^1.41.2",
     "@remix-run/dev": "^2.6.0",
     "@remix-run/eslint-config": "^2.6.0",
@@ -127,22 +127,22 @@
     "@types/fs-extra": "^11.0.4",
     "@types/glob": "^8.1.0",
     "@types/morgan": "^1.9.9",
-    "@types/node": "^20.11.16",
+    "@types/node": "^20.11.17",
     "@types/qrcode": "^1.5.5",
-    "@types/react": "^18.2.54",
-    "@types/react-dom": "^18.2.18",
+    "@types/react": "^18.2.55",
+    "@types/react-dom": "^18.2.19",
     "@types/set-cookie-parser": "^2.4.7",
     "@types/source-map-support": "^0.5.10",
     "@vitejs/plugin-react": "^4.2.1",
     "@vitest/coverage-v8": "^1.2.2",
-    "chokidar": "^3.5.3",
+    "chokidar": "^3.6.0",
     "enforce-unique": "^1.2.0",
     "esbuild": "^0.20.0",
     "eslint": "^8.56.0",
     "eslint-config-prettier": "^9.1.0",
     "fs-extra": "^11.2.0",
     "jsdom": "^24.0.0",
-    "msw": "2.1.6",
+    "msw": "2.1.7",
     "node-html-parser": "^6.1.12",
     "npm-run-all": "^4.1.5",
     "prettier": "^3.2.5",
@@ -153,7 +153,7 @@
     "rimraf": "^5.0.5",
     "tsx": "^4.7.0",
     "typescript": "^5.3.3",
-    "vite": "^5.0.12",
+    "vite": "^5.1.1",
     "vitest": "^1.2.2"
   },
   "engines": {
diff --git a/prisma/schema.prisma b/prisma/schema.prisma
index 8f48da4..c9f600b 100644
--- a/prisma/schema.prisma
+++ b/prisma/schema.prisma
@@ -215,17 +215,17 @@ model Company {
   platformStatus    PlatformStatus @relation(fields: [platformStatusKey], references: [key])
   platformStatusKey String
 
-  users        UserCompany[] // Users associated with the company.
-  accounts     Account[] // Financial accounts belonging to the company.
-  saleInvoices SaleInvoice[] // Invoices generated by the company.
-  transactions Transaction[] // Financial transactions recorded for the company.
-  PurchaseBill PurchaseBill[] // Bills received by the company.
+  users         UserCompany[] // Users associated with the company.
+  customers     CustomerAccount[] // Financial accounts belonging to the company.
+  saleInvoices  SaleInvoice[] // Invoices generated by the company.
+  transactions  Transaction[] // Financial transactions recorded for the company.
+  purchaseBills PurchaseBill[] // Bills received by the company.
 }
 
 // UserCompany is a join table that allows users to be associated with multiple companies.
 // It serves as a many-to-many relationship between User and Company models.
 model UserCompany {
-  id      Int     @id @default(autoincrement())
+  id      String  @id @default(cuid())
   isOwner Boolean @default(false)
 
   user      User    @relation(fields: [userId], references: [id])
@@ -233,27 +233,40 @@ model UserCompany {
   company   Company @relation(fields: [companyId], references: [id])
   companyId String
 
-  Role Role[]
+  roles Role[]
+
+  transactions     Transaction[]
+  saleInvoices     SaleInvoice[]
+  purchaseBills    PurchaseBill[]
+  customerAccounts CustomerAccount[]
 
-  transactions Transaction[]
-  saleInvoices SaleInvoice[]
-  // purchaseBills PurchaseBill[]
-  // PurchaseBill PurchaseBill[]
+  @@unique([userId, companyId])
 }
 
-// Account model represents financial ledgers which are used to record transactions
+// model represents financial ledgers which are used to record transactions
 // and keep track of the financial status of various aspects of the company such as assets, liabilities, revenue, etc.
-model Account {
-  id      Int    @id @default(autoincrement())
-  name    String // Name of the financial ledger/account.
-  balance Float // Current balance of the account.
-  type    String // Type of the account, e.g., revenue, expense.
+model CustomerAccount {
+  id          String  @id @default(cuid())
+  name        String // Name of the financial ledger/account.
+  uniqueId    String?
+  email       String?
+  balance     Float? // Current balance of the account.
+  // type    String // Type of the account, e.g., revenue, expense.
+  phone       String?
+  country     String?
+  city        String?
+  state       String?
+  zip         String?
+  address     String?
+  description String?
 
   createdAt DateTime @default(now())
   updatedAt DateTime @updatedAt
 
-  company   Company @relation(fields: [companyId], references: [id])
-  companyId String
+  company     Company     @relation(fields: [companyId], references: [id])
+  companyId   String
+  createdBy   UserCompany @relation(fields: [createdById], references: [id], onDelete: Cascade, onUpdate: Cascade)
+  createdById String
 
   transactions Transaction[] // Transactions associated with this account.
   PurchaseBill PurchaseBill[] // Bills associated with this account.
@@ -274,18 +287,18 @@ model Transaction {
 
   company              Company           @relation(fields: [companyId], references: [id])
   companyId            String
-  account              Account           @relation(fields: [accountId], references: [id])
-  accountId            Int
+  customer             CustomerAccount   @relation(fields: [customerAccountId], references: [id])
+  customerAccountId    String
   transactionStatus    TransactionStatus @relation(fields: [transactionStatusKey], references: [key])
   transactionStatusKey String
   issuedBy             UserCompany?      @relation(fields: [issuedById], references: [id])
-  issuedById           Int?
+  issuedById           String?
 }
 
 // Invoice model represents bills to be sent to clients or received from suppliers,
 // which can include one or more payable items, and their total has an impact on the company's finances.
 model SaleInvoice {
-  id          Int      @id @default(autoincrement())
+  id          String   @id @default(cuid())
   dateIssued  DateTime @default(now())
   dueDate     DateTime // The date by which the invoice should be paid.
   totalAmount Float // Total monetary value to be paid / received for the invoice.
@@ -295,12 +308,12 @@ model SaleInvoice {
 
   company              Company           @relation(fields: [companyId], references: [id])
   companyId            String
-  issuedTo             Account           @relation(fields: [issuedToId], references: [id])
-  issuedToId           Int
+  issuedTo             CustomerAccount   @relation(fields: [issuedToId], references: [id])
+  issuedToId           String
   transactionStatus    TransactionStatus @relation(fields: [transactionStatusKey], references: [key])
   transactionStatusKey String
   issuedBy             UserCompany?      @relation(fields: [issuedById], references: [id])
-  issuedById           Int?
+  issuedById           String?
 
   items InvoiceItem[] // Line items detailing individual charges on the invoice.
 }
@@ -310,7 +323,7 @@ model SaleInvoice {
 model InvoiceItem {
   id          Int         @id @default(autoincrement())
   invoice     SaleInvoice @relation(fields: [invoiceId], references: [id])
-  invoiceId   Int
+  invoiceId   String
   description String? // Details of what the item or service is.
   quantity    Int // Quantity of the item or service provided.
   price       Float // Price per unit of the item or service.
@@ -322,8 +335,6 @@ model InvoiceItem {
 // PurchaseBill model for purchase transactions from vendors
 model PurchaseBill {
   id          String   @id @default(cuid())
-  companyId   String
-  company     Company  @relation(fields: [companyId], references: [id])
   dateIssued  DateTime @default(now())
   dueDate     DateTime // Due date for payment.
   totalAmount Float // Total amount of the bill.
@@ -332,14 +343,16 @@ model PurchaseBill {
   createdAt DateTime @default(now())
   updatedAt DateTime @updatedAt
 
-  issuedBy   Account @relation(fields: [issuedById], references: [id]) // Account to which the bill is issued.
-  issuedById Int
+  company         Company         @relation(fields: [companyId], references: [id])
+  companyId       String
+  paidToAccount   CustomerAccount @relation(fields: [paidToAccountId], references: [id]) // Account to which the bill is issued.
+  paidToAccountId String
+  createdBy       UserCompany?    @relation(fields: [createdById], references: [id])
+  createdById     String?
 
   // Optional: Relate to a user who manages the bill
   transactionStatus    TransactionStatus @relation(fields: [transactionStatusKey], references: [key])
   transactionStatusKey String
-  // issuedBy             UserCompany?      @relation(fields: [issuedById], references: [id])
-  // issuedById           Int?
 
   purchaseBillItems PurchaseBillItem[] // Individual items on the bill.
 }
diff --git a/prisma/seed.ts b/prisma/seed.ts
index 7aaba4c..34131f3 100644
--- a/prisma/seed.ts
+++ b/prisma/seed.ts
@@ -24,7 +24,15 @@ async function seed() {
 	console.time('🔑 Created permissions...')
 
 	// ! Maybe add transactions, sales, purchase, etc. entities
-	const entities = ['user', 'note', 'company']
+	const entities = [
+		'user',
+		'note',
+		'company',
+		'company-sale',
+		'company-purchase',
+		'company-account',
+		'company-report',
+	]
 	const actions = ['create', 'read', 'update', 'delete']
 	const accesses = ['own', 'any'] as const
 	for (const entity of entities) {