Index: frontend/src/Components/HotelEdit/HotelEditForm.js
===================================================================
--- frontend/src/Components/HotelEdit/HotelEditForm.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
+++ frontend/src/Components/HotelEdit/HotelEditForm.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
@@ -0,0 +1,101 @@
+import React from "react";
+import { Form, Button, Container } from "react-bootstrap";
+import { GiConfirmed } from "react-icons/gi";
+import useFormData from "../Hooks/useFormData";
+
+const HotelEditForm = (props) => {
+  console.log(props.hotel);
+
+  const { formData, onFormChange, onCheckBoxChange, setFormData } = useFormData(
+    {...props.hotel}
+  );
+
+  return (
+    <>
+      <Container
+        className="rounded-5 m-5 my-auto mx-auto py-2 px-5"
+        style={{ backgroundColor: "#ffffff" }}
+      >
+        <Form>
+          <Form.Group className="mb-3" controlId="hotelName">
+            <Form.Label>Име на сместувањето</Form.Label>
+            <Form.Control
+              type="text"
+              placeholder="Внесете го името на сместувањето"
+              name="hotelName"
+              value={formData.hotelName}
+              onChange={onFormChange}
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3" controlId="hotelDescription">
+            <Form.Label>Опис</Form.Label>
+            <Form.Control
+              as="textarea"
+              placeholder="Внесете опис на сместувањето"
+              name="hotelDescripiton"
+              value={formData.hotelDescripiton}
+              onChange={onFormChange}
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3" controlId="hotelAddress">
+            <Form.Label>Локација</Form.Label>
+            <Form.Control
+              type="text"
+              placeholder="Внесете ја адресата на сместувањето"
+              name="hotelLocation"
+              value={formData.hotelLocation}
+              onChange={onFormChange}
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3" controlId="hotelFilters">
+            <Form.Label>Филтри</Form.Label>
+            <Form.Check
+              type="checkbox"
+              label="Паркинг"
+              name="parking"
+              checked={formData.parking}
+              onChange={onCheckBoxChange}
+            />
+            <Form.Check
+              type="checkbox"
+              label="Pet friendly"
+              name="petFriendly"
+              checked={formData.petFriendly}
+              onChange={onCheckBoxChange}
+            />
+            <Form.Check
+              type="checkbox"
+              label="Интернет"
+              name="internetAvailable"
+              checked={formData.internetAvailable}
+              onChange={onCheckBoxChange}
+            />
+          </Form.Group>
+
+          <Form.Group className="mb-3" controlId="hotelPhone">
+            <Form.Label>Контакт телефон</Form.Label>
+            <Form.Control type="text" placeholder="Внесете контакт телефон" />
+          </Form.Group>
+
+          <Form.Group className="my-1 justify-content-center">
+            <Button
+              type="submit"
+              style={{ backgroundColor: "#159895" }}
+              size="md"
+            >
+              <span className="ikona my-1">
+                <GiConfirmed />
+              </span>
+              <span className="ikona mx-3">Зачувај промени</span>
+            </Button>
+          </Form.Group>
+        </Form>
+      </Container>
+    </>
+  );
+};
+
+export default HotelEditForm;
Index: frontend/src/Components/HotelEdit/HotelEditTab.js
===================================================================
--- frontend/src/Components/HotelEdit/HotelEditTab.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
+++ frontend/src/Components/HotelEdit/HotelEditTab.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
@@ -0,0 +1,120 @@
+import React from "react";
+import {Container, Col, Row, Image, Nav, Tab} from "react-bootstrap";
+import {useState} from "react";
+import {FaTaxi, FaHotel} from "react-icons/fa";
+import {MdOutlineStickyNote2} from "react-icons/md";
+import AddNew from "../Resources/AddNew";
+import {BiData} from "react-icons/bi"
+import RoomListing from "./RoomListing";
+import HotelEditForm from "./HotelEditForm";
+import AddHotelForm from "../Forms/AddHotelForm";
+import EditModal from "../Resources/EditModal";
+import AddAvailability from "../Resources/AddAvailability";
+import useGet from "../Hooks/useGet";
+import ReservationListing from "./ReservationListing";
+
+function HotelEditTab(props) {
+    const [activeTab, setActiveTab] = useState("/hotel");
+    const [modalData, setModalData] = useState("");
+    const [show, setShow] = useState(false);
+
+    console.log(props)
+
+    const {
+        data,
+        isLoading,
+        setData,
+        getData,
+        setChanged
+    } = useGet(`/hotel/${props.displayRoom.hotelId}/reservations/active`)
+
+    !isLoading && console.log(data)
+
+    const handleClose = () => setShow(false);
+    const handleShow = () => {
+        //e.preventDefault();
+        setShow(true);
+
+    };
+
+    const showModal = (modalData) => {
+        setModalData(modalData);
+        handleShow();
+    }
+    console.log(props.displayRoom)
+
+    const handleSelect = (eventKey) => {
+        setActiveTab(eventKey);
+    };
+
+    return (
+        <Container className="rounded-5">
+            <Tab.Container
+                activeKey={activeTab}
+                onSelect={handleSelect}
+                className="bg-dark rounded-5"
+            >
+                <Nav
+                    fill
+                    variant="tabs"
+                    className="bg-body rounded-top-5"
+                    activeKey="/hotel"
+                    id="tab_item"
+                >
+                    <Nav.Item className="tab_item rounded-5">
+                        <Nav.Link eventKey="/hotel" className="text-left rounded-5">
+              <span className="ikona">
+                <FaHotel
+                    color="#159895"
+                    style={{lineHeight: "100em"}}
+                    size={"1.5em"}
+                    className="mx-3"
+                />
+              </span>
+                            <span className="ikona">Соби</span>
+                        </Nav.Link>
+                    </Nav.Item>
+                    <Nav.Item className="tab_item">
+                        <Nav.Link eventKey="/restaurant">
+              <span className="ikona">
+                <MdOutlineStickyNote2 color="#159895" size={"1.5em"} className="mx-3"/>
+              </span>
+                            <span className="ikona">Резервации</span>
+                        </Nav.Link>
+                    </Nav.Item>
+                    <Nav.Item className="tab_item rounded-5">
+                        <Nav.Link eventKey="/transport" className="text-left rounded-5">
+              <span className="ikona">
+                <BiData color="#159895" size={"1.5em"} className="mx-3"/>
+              </span>
+                            <span className="ikona">Општи податоци</span>
+                        </Nav.Link>
+                    </Nav.Item>
+                </Nav>
+
+                <Tab.Content className="py-5 px-3 border rounded-bottom-5 bg-light">
+                    <Tab.Pane eventKey="/hotel">
+                        {props.displayRoom.hotelRooms.map((room) => {
+                            return <RoomListing key={room.hotelRoomId} data={room} showModal={showModal}/>
+                        })}
+                        <EditModal show={show} handleClose={handleClose} type="room" room={modalData}></EditModal>
+                        <AddNew Id={props.displayRoom.hotelId} refresh={props.refresh} type="room"/>
+                    </Tab.Pane>
+                    <Tab.Pane eventKey="/restaurant">
+                        {!isLoading && data.map((res) => {
+                            return (
+                                <ReservationListing data={res}/>
+                            )
+                        })}
+                        {/*<AddNew type="restaurant"/>*/}
+                    </Tab.Pane>
+                    <Tab.Pane eventKey="/transport">
+                        <AddHotelForm refresh={props.refresh} hotel={props.displayRoom}/>
+                    </Tab.Pane>
+                </Tab.Content>
+            </Tab.Container>
+        </Container>
+    );
+}
+
+export default HotelEditTab;
Index: frontend/src/Components/HotelEdit/ReservationListing.js
===================================================================
--- frontend/src/Components/HotelEdit/ReservationListing.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
+++ frontend/src/Components/HotelEdit/ReservationListing.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
@@ -0,0 +1,30 @@
+import {Col, Container, Row} from "react-bootstrap";
+import React from "react";
+
+const ReservationListing = (props) => {
+    return(
+        <>
+            <Container className="py-3 px-1 my-4"
+                       style={{
+                           border: "4px solid #159895",
+                           borderRadius: "1em",
+                           boxShadow: "0 3px 5px #159895",
+                           maxWidth: "90%",
+                       }}>
+                <Row>
+                    <Col md={8} className="d-flex flex-column justify-content-start ps-5">
+                        <h3 style={{fontWeight: "bold"}} className={'text-start'}>Резервација за:</h3>
+                        <h4 className={'text-start'}>{props.data.hotelRoom.hotelRoomName}</h4>
+                        <h4 className={'text-start'}>{props.data.user.name + ' ' + props.data.user.surname}</h4>
+                        <h5 className={'text-start'}>{props.data.dateFrom + ' - ' + props.data.dateTo}</h5>
+                    </Col>
+                    <Col md={4} className="d-flex flex-column justify-content-center align-content-center">
+                        <h3>Вкупна цена: <br></br>{props.data.hotelRoom.price}$</h3>
+                    </Col>
+                </Row>
+            </Container>
+        </>
+    )
+}
+
+export default ReservationListing;
Index: frontend/src/Components/HotelEdit/RoomListing.js
===================================================================
--- frontend/src/Components/HotelEdit/RoomListing.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
+++ frontend/src/Components/HotelEdit/RoomListing.js	(revision e6c2521bc7455763be50cf2e37427887b6efb4b9)
@@ -0,0 +1,55 @@
+import React from "react";
+import {useState} from "react";
+import {Col, Container, Row, Image, Modal, Button} from "react-bootstrap";
+import LoginForm from "../Login/LoginForm";
+import ChangePasswordForm from "../Forms/ChangePasswordForm";
+import {AiOutlinePlusCircle} from "react-icons/ai"
+import AddAvailability from "../Resources/AddAvailability";
+import AddImages from "../Resources/AddImages";
+
+
+const RoomListing = (props) => {
+
+    const type = props.type == "hotel" ? "сместувањето" : props.type == "restaurant" ? "ресторанот" : "превозот";
+    return (
+        <>
+            <Container className="py-3 px-1 my-4"
+                       style={{
+                           border: "4px solid #159895",
+                           borderRadius: "1em",
+                           boxShadow: "0 3px 5px #159895",
+                           maxWidth: "90%",
+                       }}>
+                <Row>
+                    <Col className="d-flex justify-content-center">
+                        <Image onClick={(e) => {
+                            e.preventDefault();
+                            props.showModal(props.data);
+                            console.log("kliknav")
+                        }}
+                            src="https://img.freepik.com/free-photo/luxury-classic-modern-bedroom-suite-hotel_105762-1787.jpg?w=200"
+                            style={{
+                                height: "8em",
+                                borderRadius: "1em",
+                                boxShadow: "0 4px 20px lightblue",
+                                maxWidth: "100%",
+                            }}
+                        ></Image>
+                    </Col>
+                    <Col className="d-flex flex-column justify-content-center" style={{textAlign: "left"}}>
+                        <h2>{props.data.hotelRoomName}</h2>
+                        <h2>Цена по ноќ: {props.data.price}</h2>
+                    </Col>
+                    <Col className="d-flex flex-column justify-content-center align-content-center">
+                        <AddImages type="room" Id={props.data.hotelRoomId} />
+                    </Col>
+
+                    <Col className="d-flex flex-column justify-content-center align-content-center">
+                        <AddAvailability type="room" hotelRoomId={props.data.hotelRoomId} />
+                    </Col>
+                </Row>
+            </Container>
+    </>)
+}
+
+export default RoomListing;
