Hot fixed and format code

hotel-management/src/components/AppLayout/index.tsx

@@ -10,8 +10,8 @@ import { Main, StyledAppLayout } from './styled';
 const AppLayout = () => {
   return (
     <StyledAppLayout>
-      <Header accountName='Admin'/>
-      <Sidebar heading='Hotel Management'/>
+      <Header accountName="Admin" />
+      <Sidebar heading="Hotel Management" />
       <Main>
         <Outlet />
       </Main>

hotel-management/src/components/Header/index.tsx

@@ -5,10 +5,10 @@ import HeaderMenu from '../HeaderMenu';
 import { StyledHeader } from './styled';
 
 interface IHeader {
-  accountName: string
+  accountName: string;
 }
 
-const Header = ({accountName}: IHeader) => {
+const Header = ({ accountName }: IHeader) => {
   return (
     <StyledHeader>
       <p>Hi, {accountName}!</p>

hotel-management/src/components/Menus/index.tsx

@@ -33,9 +33,7 @@ const Toggle = ({ id }: { id: string }): React.JSX.Element => {
   const handleClick = (e: React.MouseEvent<HTMLButtonElement, MouseEvent>) => {
     e.stopPropagation();
 
-    openId === '' || openId !== id 
-      ? open!(id) 
-      : close!();
+    openId === '' || openId !== id ? open!(id) : close!();
   };
 
   return (

hotel-management/src/components/Sidebar/index.tsx

@@ -8,7 +8,7 @@ interface ISidebar {
   heading: string;
 }
 
-const Sidebar = ({heading}: ISidebar) => {
+const Sidebar = ({ heading }: ISidebar) => {
   return (
     <StyledSidebar>
       <Heading>{heading}</Heading>

hotel-management/src/components/Table/index.tsx

@@ -6,7 +6,7 @@ import { StyledBody, StyledHeader, StyledRow, StyledTable } from './styled';
 // Contexts
 import TableContext from '../../contexts/TableContext';
 
-interface ITable {
+export interface ITable {
   columns?: string;
   children: React.ReactNode;
 }

hotel-management/src/components/Table/styled.ts

@@ -1,7 +1,5 @@
 import styled from 'styled-components';
-
-// Interfaces
-import { ITable } from '../../globals/interfaces';
+import { ITable } from '.';
 
 const StyledTable = styled.div`
   border: 1px solid var(--border-color);

hotel-management/src/components/Toast/index.tsx

@@ -1,17 +1,29 @@
-import { DefaultToastOptions, ToastOptions, ToastPosition, Toaster } from 'react-hot-toast';
+import {
+  DefaultToastOptions,
+  ToastOptions,
+  ToastPosition,
+  Toaster,
+} from 'react-hot-toast';
 import { CSSProperties } from 'styled-components';
 
 interface IToast {
-  position: ToastPosition;
-  gutter: number;
-  containerStyle: CSSProperties;
-  toastOptions: DefaultToastOptions;
-  success: ToastOptions;
-  error: ToastOptions;
-  style: CSSProperties | undefined;
+  position?: ToastPosition;
+  gutter?: number;
+  containerStyle?: CSSProperties;
+  toastOptions?: DefaultToastOptions;
+  success?: ToastOptions;
+  error?: ToastOptions;
+  style?: CSSProperties | undefined;
 }
 
-const Toast = ({position, gutter, containerStyle, success, error, style}: IToast) => {
+const Toast = ({
+  position,
+  gutter,
+  containerStyle,
+  success,
+  error,
+  style,
+}: IToast) => {
   return (
     <Toaster
       position={position}
@@ -20,27 +32,27 @@ const Toast = ({position, gutter, containerStyle, success, error, style}: IToast
       toastOptions={{
         success,
         error,
-        style
+        style,
       }}
     />
   );
 };
 
 Toast.defaultProps = {
-  position: "top-center",
+  position: 'top-center',
   gutter: 12,
   containerStyle: { margin: '8px', zIndex: 1 },
   success: {
     duration: 3000,
   },
-  error:{
+  error: {
     duration: 5000,
   },
   style: {
     fontSize: '16px',
     maxWidth: '500px',
     padding: '16px 24px',
-  }
-}
+  },
+};
 
 export default Toast;