feat: 商品を論理削除する機能を実装 (#53)

Co-authored-by: Kattyan <[email protected]>

Author: r4ai

app/components/organisms/kitchen/OrderCard.tsx

@@ -6,6 +6,7 @@ import PropTypes from "prop-types"
 type OrderItem = {
   productName: string
   quantity: number
+  deleted: boolean
 }
 
 type Props = {
@@ -35,7 +36,8 @@ export const OrderCard: FC<Props> = memo((props) => {
         {orderItems.map((item, index) => (
           <Box key={index}>
             <Text>
-              {item.productName}--数量：{item.quantity}
+              {item.productName}
+              {item.deleted && " (削除済み)"} -- 数量：{item.quantity}
             </Text>
           </Box>
         ))}
@@ -90,6 +92,7 @@ OrderCard.propTypes = {
       productName: PropTypes.string.isRequired,
       quantity: PropTypes.number.isRequired,
       memo: PropTypes.string,
+      deleted: PropTypes.bool.isRequired,
     }).isRequired,
   ).isRequired,
   status: PropTypes.string.isRequired,

app/crud/crud_products.ts

@@ -16,8 +16,12 @@ export async function createProduct(data: Omit<TypeProduct, "product_id">) {
 }
 
 //productの読み込み
-export async function readProduct() {
-  return await prisma.products.findMany()
+export async function readProduct({ includeDeleted = false } = {}) {
+  return await prisma.products.findMany({
+    where: {
+      deleted_at: includeDeleted ? undefined : null,
+    },
+  })
 }
 
 //商品の変更
@@ -27,7 +31,7 @@ export async function updateProduct(
 ) {
   return await prisma.products.update({
     where: {
-      product_id: product_id,
+      product_id,
     },
     data: {
       ...data,
@@ -57,6 +61,9 @@ export async function existProduct(name: string) {
       product_name: {
         equals: name,
       },
+      deleted_at: {
+        equals: null,
+      },
     },
   })
 }
@@ -67,21 +74,16 @@ export async function deleteAllProducts() {
 }
 
 //Productの削除
-// export async function deleteProduct(product_id: number) {
-//   console.log("Deleting product with ID:", product_id);
-//   return await prisma.products.delete({
-//     where: {
-//       product_id: product_id,
-//     },
-//   });
-// }
 export async function deleteProduct(product_id: number) {
   console.log("Deleting product with ID:", product_id)
 
   try {
-    const result = await prisma.products.delete({
+    const result = await prisma.products.update({
       where: {
-        product_id: product_id,
+        product_id,
+      },
+      data: {
+        deleted_at: new Date(),
       },
     })
     console.log("Product deleted successfully:", result)

app/routes/kitchen.tsx

@@ -69,6 +69,7 @@ export default function Kitchen() {
             return {
               productName: product?.product_name || "",
               quantity: detail.quantity,
+              deleted: product?.deleted_at != null,
             }
           })
 
@@ -124,7 +125,7 @@ export default function Kitchen() {
 export const loader = async () => {
   const response_orders = await readOrder()
   const response_details = await readDetail()
-  const response_products = await readProduct()
+  const response_products = await readProduct({ includeDeleted: true })
   return json({
     orders: response_orders,
     details: response_details,

app/routes/order_table.tsx

@@ -57,9 +57,6 @@ export default function OrderTable() {
               const filteredProducts = products.filter((product) =>
                 productIds.includes(product.product_id),
               )
-              const productNames = filteredProducts.map(
-                (product) => product.product_name,
-              )
               const quantities = filteredDetails.map(
                 (detail) => detail.quantity,
               )
@@ -92,11 +89,15 @@ export default function OrderTable() {
                   <Td>{createTime}</Td>
                   <Td>{order.table_number}</Td>
                   <Td>
-                    {productNames.map((name, index) => (
-                      <div key={index}>
-                        {name}--数量：{quantities[index]}
-                      </div>
-                    ))}
+                    {filteredProducts.map(
+                      ({ product_name, deleted_at }, index) => (
+                        <div key={index}>
+                          {product_name}
+                          {deleted_at != null && " (削除済み)"} -- 数量：
+                          {quantities[index]}
+                        </div>
+                      ),
+                    )}
                   </Td>
                   <Td>{totalPrice}円</Td>
                   <Td>{order.status}</Td>
@@ -113,7 +114,7 @@ export default function OrderTable() {
 export const loader = async () => {
   const response_orders = await readOrder()
   const response_details = await readDetail()
-  const response_products = await readProduct()
+  const response_products = await readProduct({ includeDeleted: true })
   return json({
     orders: response_orders,
     details: response_details,

app/type/typeproduct.ts

@@ -4,4 +4,5 @@ export type TypeProduct = {
   price: number
   stock: number
   image?: string
+  deleted_at?: string | null
 }

prisma/migrations/20241119145305_add_deleted_at_in_products/migration.sql

@@ -0,0 +1,14 @@
+/*
+  Warnings:
+
+  - A unique constraint covering the columns `[product_name,deleted_at]` on the table `Products` will be added. If there are existing duplicate values, this will fail.
+
+*/
+-- DropIndex
+DROP INDEX "Products_product_name_key";
+
+-- AlterTable
+ALTER TABLE "Products" ADD COLUMN "deleted_at" DATETIME;
+
+-- CreateIndex
+CREATE UNIQUE INDEX "Products_product_name_deleted_at_key" ON "Products"("product_name", "deleted_at");

prisma/schema.prisma

@@ -33,9 +33,12 @@ model Order_details {
 
 model Products {
   product_id   Int             @id @default(autoincrement())
-  product_name String          @unique
+  product_name String
   price        Int
   stock        Int
   image        String
+  deleted_at   DateTime?
   orderDetails Order_details[]
+
+  @@unique([product_name, deleted_at])
 }