From 38e076c65bf65e6c366f2c150437e490e111b7ac Mon Sep 17 00:00:00 2001
From: Votre Nom <juliencharbonnel20@gmail.com>
Date: Wed, 27 Mar 2024 15:34:55 +0100
Subject: [PATCH] =?UTF-8?q?=E2=9C=85=20Ajout=20des=20rooms=20et=20des=20it?=
 =?UTF-8?q?ems?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/form/formCreateItem.jsx | 78 ++++++++++++++++++++++++++
 src/components/form/formCreateRoom.jsx | 38 +++++++++++++
 src/pages/home.jsx                     |  4 ++
 3 files changed, 120 insertions(+)
 create mode 100644 src/components/form/formCreateItem.jsx
 create mode 100644 src/components/form/formCreateRoom.jsx

diff --git a/src/components/form/formCreateItem.jsx b/src/components/form/formCreateItem.jsx
new file mode 100644
index 0000000..c9bd3f6
--- /dev/null
+++ b/src/components/form/formCreateItem.jsx
@@ -0,0 +1,78 @@
+import React, { useState, useEffect } from "react";
+import { Form, Input, InputNumber, Button, Select } from "antd";
+import axios from "axios";
+
+const { TextArea } = Input;
+const { Option } = Select;
+
+export const FormCreateItem = () => {
+  const [form] = Form.useForm();
+  const [rooms, setRooms] = useState([]);
+
+  useEffect(() => {
+    const fetchRooms = async () => {
+      try {
+        const response = await axios.get(
+          `${import.meta.env.VITE_API_URL}/room`,
+        );
+        setRooms(response.data);
+      } catch (error) {
+        console.error(error);
+      }
+    };
+
+    fetchRooms();
+  }, []);
+
+  const onFinish = async (values) => {
+    try {
+      const response = await axios.post(
+        `${import.meta.env.VITE_API_URL}/item`,
+        values,
+      );
+      console.log(response.data);
+    } catch (error) {
+      console.error(error);
+    }
+  };
+
+  return (
+    <Form form={form} onFinish={onFinish}>
+      <h1>Create Item</h1>
+      <Form.Item label="Brand" name="brand">
+        <Input />
+      </Form.Item>
+      <Form.Item label="Model" name="model">
+        <Input />
+      </Form.Item>
+      <Form.Item label="Room" name="room">
+        <Select placeholder="Select a room">
+          {rooms.map((room) => (
+            <Option key={room._id} value={room._id}>
+              {room.name}
+            </Option>
+          ))}
+        </Select>
+      </Form.Item>
+      <Form.Item label="Price" name="price">
+        <InputNumber />
+      </Form.Item>
+      <Form.Item label="Purchase Date" name="purchaseDate">
+        <Input />
+      </Form.Item>
+      <Form.Item label="Description" name="description">
+        <TextArea rows={4} />
+      </Form.Item>
+      <Form.Item label="Link" name="link">
+        <Input />
+      </Form.Item>
+      <Form.Item>
+        <Button type="primary" htmlType="submit">
+          Submit
+        </Button>
+      </Form.Item>
+    </Form>
+  );
+};
+
+export default FormCreateItem;
diff --git a/src/components/form/formCreateRoom.jsx b/src/components/form/formCreateRoom.jsx
new file mode 100644
index 0000000..a9b6c19
--- /dev/null
+++ b/src/components/form/formCreateRoom.jsx
@@ -0,0 +1,38 @@
+import React from "react";
+import { Form, Input, Button } from "antd";
+import axios from "axios";
+
+export const FormCreateRoom = () => {
+  const [form] = Form.useForm();
+
+  const onFinish = async (values) => {
+    try {
+      const response = await axios.post(
+        `${import.meta.env.VITE_API_URL}/room`,
+        values,
+      );
+      console.log(response.data);
+    } catch (error) {
+      console.error(error);
+    }
+  };
+
+  return (
+    <Form form={form} onFinish={onFinish}>
+      <Form.Item
+        label="Room Name"
+        name="name"
+        rules={[{ required: true, message: "Please input the room name!" }]}
+      >
+        <Input />
+      </Form.Item>
+      <Form.Item>
+        <Button type="primary" htmlType="submit">
+          Submit
+        </Button>
+      </Form.Item>
+    </Form>
+  );
+};
+
+export default FormCreateRoom;
diff --git a/src/pages/home.jsx b/src/pages/home.jsx
index 70d55a6..7277e04 100644
--- a/src/pages/home.jsx
+++ b/src/pages/home.jsx
@@ -3,6 +3,8 @@ import React from "react";
 import { useAuth } from "../hooks";
 import { ItemBox } from "../components/item/item";
 import { DatePicker } from "antd";
+import { FormCreateItem } from "../components/form/formCreateItem";
+import { FormCreateRoom } from "../components/form/formCreateRoom";
 
 export const Home = () => {
   const { user } = useAuth();
@@ -10,6 +12,8 @@ export const Home = () => {
   return (
     <div>
       <h1>Home page</h1>
+      <FormCreateRoom></FormCreateRoom>
+      <FormCreateItem></FormCreateItem>
       {user && <h2>Hello {user.user.username}</h2>}
       <DatePicker></DatePicker>
       <ItemBox