Write unit test for Rooms, Users page components

hotel-management/src/constants/config.ts

@@ -1,6 +1,6 @@
 const DEFAULT_SORT_BY = 'id';
 const DEFAULT_ORDER_BY = 'asc';
 const supabaseUrl = 'https://pjqujsjzzdrlrgqbxepe.supabase.co'
-const supabaseKey = import.meta.env.VITE_SUPABASE_KEY
+const supabaseKey = process.env.VITE_SUPABASE_KEY
 
 export { DEFAULT_SORT_BY, DEFAULT_ORDER_BY, supabaseKey, supabaseUrl };

hotel-management/src/pages/Room/__tests__/RoomForm.test.tsx

@@ -0,0 +1,20 @@
+import RoomForm from '../RoomForm';
+import { BrowserRouter } from 'react-router-dom';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import renderer from 'react-test-renderer';
+
+describe('RoomForm', () => {
+  const queryClient = new QueryClient();
+
+  const wrapper = renderer.create(
+    <QueryClientProvider client={queryClient}>
+      <BrowserRouter>
+        <RoomForm />
+      </BrowserRouter>
+    </QueryClientProvider>
+  );
+
+  test('Should render correctly', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+});

hotel-management/src/pages/Room/__tests__/RoomRow.test.tsx

@@ -0,0 +1,26 @@
+import renderer from 'react-test-renderer';
+import RoomRow from '../RoomRow';
+import { IRoom } from '@type/rooms';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+
+// Components
+
+describe('RoomRow', () => {
+  const tempRoom: IRoom = {
+    id: 1,
+    name: 'Temp Room',
+    price: 250,
+    status: true,
+  };
+  const queryClient = new QueryClient();
+
+  const wrapper = renderer.create(
+    <QueryClientProvider client={queryClient}>
+      <RoomRow room={tempRoom} key={tempRoom.id} />
+    </QueryClientProvider>
+  );
+
+  test('Should render correctly', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+});

hotel-management/src/pages/Room/__tests__/RoomTable.test.tsx

@@ -0,0 +1,20 @@
+import renderer from 'react-test-renderer';
+import RoomTable from '../RoomTable';
+import { BrowserRouter } from 'react-router-dom';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+
+describe('RoomTable', () => {
+  const queryClient = new QueryClient();
+
+  const wrapper = renderer.create(
+    <BrowserRouter>
+      <QueryClientProvider client={queryClient}>
+        <RoomTable />
+      </QueryClientProvider>
+    </BrowserRouter>
+  );
+
+  test('Should render correctly', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+});

hotel-management/src/pages/Room/__tests__/index.test.tsx

@@ -0,0 +1,20 @@
+import renderer from 'react-test-renderer';
+import Room from '..';
+import { BrowserRouter } from 'react-router-dom';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+
+describe('Room', () => {
+  const queryClient = new QueryClient();
+
+  const wrapper = renderer.create(
+    <QueryClientProvider client={queryClient}>
+      <BrowserRouter>
+        <Room />
+      </BrowserRouter>
+    </QueryClientProvider>
+  );
+
+  test('Should render correctly', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+});

hotel-management/src/pages/Room/index.tsx

@@ -1,5 +1,5 @@
 // Components
-import RoomTable from './RomTable';
+import RoomTable from './RoomTable';
 import RoomForm from './RoomForm';
 import Modal from '@component/Modal';
 

hotel-management/src/pages/User/__tests__/UserForm.test.tsx

@@ -0,0 +1,20 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { BrowserRouter } from 'react-router-dom';
+import renderer from 'react-test-renderer';
+import UserForm from '../UserForm';
+
+describe('UserForm', () => {
+  const queryClient = new QueryClient();
+
+  const wrapper = renderer.create(
+    <QueryClientProvider client={queryClient}>
+      <BrowserRouter>
+        <UserForm />
+      </BrowserRouter>
+    </QueryClientProvider>
+  );
+
+  test('Should render correctly', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+});

hotel-management/src/pages/User/__tests__/UserRow.test.tsx

@@ -0,0 +1,23 @@
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+import { IUser } from '@type/users';
+import renderer from 'react-test-renderer';
+import UserRow from '../UserRow';
+
+describe('UserRow', () => {
+  const tempUser: IUser = {
+    id: 1,
+    name: 'Temp Room',
+    phone: '0324421232',
+    isBooked: false,
+  };
+  const queryClient = new QueryClient();
+  const wrapper = renderer.create(
+    <QueryClientProvider client={queryClient}>
+      <UserRow user={tempUser} />
+    </QueryClientProvider>
+  );
+
+  test('Should render correctly', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+});

hotel-management/src/pages/User/__tests__/index.test.tsx

@@ -0,0 +1,20 @@
+import renderer from 'react-test-renderer';
+import User from '..';
+import { BrowserRouter } from 'react-router-dom';
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
+
+describe('User', () => {
+  const queryClient = new QueryClient();
+
+  const wrapper = renderer.create(
+    <QueryClientProvider client={queryClient}>
+      <BrowserRouter>
+        <User />
+      </BrowserRouter>
+    </QueryClientProvider>
+  );
+
+  test('Should render correctly', () => {
+    expect(wrapper).toMatchSnapshot();
+  });
+});