diff --git a/src/components/Error.tsx b/src/components/Error.jsx
similarity index 85%
rename from src/components/Error.tsx
rename to src/components/Error.jsx
index 60d1256..b3c02db 100644
--- a/src/components/Error.tsx
+++ b/src/components/Error.jsx
@@ -34,7 +34,12 @@ const Alert = ({ variant = 'info', message, Icon }) => {
         'animate-slideDown'
       )}
     >
-      <div className={cn('flex items-center gap-2 p-3 rounded-lg border shadow-lg min-w-[280px] max-w-md', styles.container)}>
+      <div
+        className={cn(
+          'flex items-center gap-2 p-3 rounded-lg border shadow-lg min-w-[280px] max-w-md',
+          styles.container
+        )}
+      >
         {Icon && <Icon className={cn('h-5 w-5', styles.icon)} />}
         <p className={cn('text-sm', styles.text)}>{message}</p>
       </div>
diff --git a/src/pages/Branches.jsx b/src/pages/Branches.jsx
index 2d5d04f..dad70d8 100644
--- a/src/pages/Branches.jsx
+++ b/src/pages/Branches.jsx
@@ -9,9 +9,20 @@ const Branches = () => {
   const [branches, setBranches] = useState(null);
   const [alert, setAlert] = useState(null);
   return (
-    <div className="p-4 max-w-7xl mx-auto">
-      <Header Icon={Store} title={"Filial Ro'yxati"} text={"Filiallarni boshqarish va ro'yxatni yuritish tizimi"} />
-      {alert && alert.type === 'success' ? <Alert Icon={Check} variant="success" message={alert.message} /> : alert && alert.type === 'warning' && <Alert Icon={AlertCircle} variant="warning" message={alert.message} />}
+    <div className="p-4 max-w-full mx-auto">
+      <Header
+        Icon={Store}
+        title={"Filial Ro'yxati"}
+        text={"Filiallarni boshqarish va ro'yxatni yuritish tizimi"}
+      />
+      {alert && alert.type === 'success' ? (
+        <Alert Icon={Check} variant="success" message={alert.message} />
+      ) : (
+        alert &&
+        alert.type === 'warning' && (
+          <Alert Icon={AlertCircle} variant="warning" message={alert.message} />
+        )
+      )}
       {/* Forma */}
       <CreateBranches branches={branches} setAlert={setAlert} setBranches={setBranches} />
       {/* Jadval */}
diff --git a/src/pages/Clients.jsx b/src/pages/Clients.jsx
index a69febc..81b3569 100644
--- a/src/pages/Clients.jsx
+++ b/src/pages/Clients.jsx
@@ -12,11 +12,27 @@ const Clients = () => {
 
   return (
     <div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 p-4 md:p-6 lg:p-8">
-      <div className="max-w-6xl mx-auto">
-        <Header Icon={Users} title={"Mijozlar Ro'yxati"} text={"Mijozlarni boshqarish va ro'yxatni yuritish tizimi"} />
-        {alert && alert.type === 'success' ? <Alert Icon={Check} variant="success" message={alert.message} /> : alert && alert.type === 'warning' && <Alert Icon={AlertCircle} variant="warning" message={alert.message} />}
+      <div className="max-w-full mx-auto">
+        <Header
+          Icon={Users}
+          title={"Mijozlar Ro'yxati"}
+          text={"Mijozlarni boshqarish va ro'yxatni yuritish tizimi"}
+        />
+        {alert && alert.type === 'success' ? (
+          <Alert Icon={Check} variant="success" message={alert.message} />
+        ) : (
+          alert &&
+          alert.type === 'warning' && (
+            <Alert Icon={AlertCircle} variant="warning" message={alert.message} />
+          )
+        )}
         <CreateClient clients={clients} setAlert={setAlert} cargoId={cargoId} />
-        <ClientList alert={alert} setAlert={setAlert} setClients={setClients} setCargoId={setCargoId} />
+        <ClientList
+          alert={alert}
+          setAlert={setAlert}
+          setClients={setClients}
+          setCargoId={setCargoId}
+        />
       </div>
     </div>
   );
diff --git a/src/pages/Currency.jsx b/src/pages/Currency.jsx
index ab9879e..cb95018 100644
--- a/src/pages/Currency.jsx
+++ b/src/pages/Currency.jsx
@@ -11,12 +11,19 @@ const Currency = () => {
 
   return (
     <div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 p-4 md:p-6 lg:p-8">
-      <div className="max-w-7xl mx-auto">
+      <div className="max-w-full mx-auto">
         {/* Sarlavha */}
         <Header Icon={PlusCircle} title={'Valyutalar'} text={'Valyutalarni boshqarish tizimi'} />
 
         {/* Xatolik */}
-        {alert && alert.type === 'success' ? <Alert Icon={Check} variant="success" message={alert.message} /> : alert && alert.type === 'warning' && <Alert Icon={AlertCircle} variant="warning" message={alert.message} />}
+        {alert && alert.type === 'success' ? (
+          <Alert Icon={Check} variant="success" message={alert.message} />
+        ) : (
+          alert &&
+          alert.type === 'warning' && (
+            <Alert Icon={AlertCircle} variant="warning" message={alert.message} />
+          )
+        )}
 
         {/* Forma */}
         <CreateCurrency setAlert={setAlert} editingCurrency={editingCurrency} />
diff --git a/src/pages/Employees.jsx b/src/pages/Employees.jsx
index d85451e..a80ed94 100644
--- a/src/pages/Employees.jsx
+++ b/src/pages/Employees.jsx
@@ -12,16 +12,32 @@ const Employees = () => {
 
   return (
     <div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 p-4 md:p-6 lg:p-8">
-      <div className="max-w-7xl mx-auto">
+      <div className="max-w-full mx-auto">
         {/* Sarlavha */}
-        <Header Icon={Users} title={"Xodimlar Ro'yxati"} text={"Xodimlarni boshqarish va ro'yxatni yuritish tizimi"} />
+        <Header
+          Icon={Users}
+          title={"Xodimlar Ro'yxati"}
+          text={"Xodimlarni boshqarish va ro'yxatni yuritish tizimi"}
+        />
 
         {/* Xatolik */}
-        {alert && alert.type === 'success' ? <Alert Icon={Check} variant="success" message={alert.message} /> : alert && alert.type === 'warning' && <Alert Icon={AlertCircle} variant="warning" message={alert.message} />}
+        {alert && alert.type === 'success' ? (
+          <Alert Icon={Check} variant="success" message={alert.message} />
+        ) : (
+          alert &&
+          alert.type === 'warning' && (
+            <Alert Icon={AlertCircle} variant="warning" message={alert.message} />
+          )
+        )}
 
         <CreateEmployee clients={clients} setAlert={setAlert} cargoId={cargoId} />
         {/* Jadval */}
-        <EmployesList alert={alert} setAlert={setAlert} setClients={setClients} setCargoId={setCargoId} />
+        <EmployesList
+          alert={alert}
+          setAlert={setAlert}
+          setClients={setClients}
+          setCargoId={setCargoId}
+        />
       </div>
     </div>
   );
diff --git a/src/pages/Payments.jsx b/src/pages/Payments.jsx
index 4ada2eb..a61dce8 100644
--- a/src/pages/Payments.jsx
+++ b/src/pages/Payments.jsx
@@ -9,9 +9,20 @@ const Payments = () => {
 
   return (
     <div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 p-4 md:p-6 lg:p-8">
-      <div className="max-w-7xl mx-auto">
-        <Header Icon={Banknote} title={"To'lovlar tarixi"} text={"To'lovlarni boshqarish va ko‘rish tizimi"} />
-        {alert && alert.type === 'success' ? <Alert Icon={Check} variant="success" message={alert.message} /> : alert && alert.type === 'warning' && <Alert Icon={AlertCircle} variant="warning" message={alert.message} />}
+      <div className="max-w-full mx-auto">
+        <Header
+          Icon={Banknote}
+          title={"To'lovlar tarixi"}
+          text={"To'lovlarni boshqarish va ko‘rish tizimi"}
+        />
+        {alert && alert.type === 'success' ? (
+          <Alert Icon={Check} variant="success" message={alert.message} />
+        ) : (
+          alert &&
+          alert.type === 'warning' && (
+            <Alert Icon={AlertCircle} variant="warning" message={alert.message} />
+          )
+        )}
         <PaymentsList setAlert={setAlert} />
       </div>
     </div>
diff --git a/src/pages/Reference.jsx b/src/pages/Reference.jsx
index 024ec78..ebc2183 100644
--- a/src/pages/Reference.jsx
+++ b/src/pages/Reference.jsx
@@ -10,9 +10,20 @@ const Reference = () => {
   const [idHouses, setIdHouses] = useState(null);
   return (
     <div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 p-4 md:p-6 lg:p-8">
-      <div className="max-w-6xl mx-auto">
-        <Header Icon={DollarSign} title={"Cargo narxlari Ro'yxati"} text={"Cargo narxlarini boshqarish va ro'yxatni yuritish tizimi"} />
-        {alert && alert.type === 'success' ? <Alert Icon={Check} variant="success" message={alert.message} /> : alert && alert.type === 'warning' && <Alert Icon={AlertCircle} variant="warning" message={alert.message} />}
+      <div className="max-w-full mx-auto">
+        <Header
+          Icon={DollarSign}
+          title={"Cargo narxlari Ro'yxati"}
+          text={"Cargo narxlarini boshqarish va ro'yxatni yuritish tizimi"}
+        />
+        {alert && alert.type === 'success' ? (
+          <Alert Icon={Check} variant="success" message={alert.message} />
+        ) : (
+          alert &&
+          alert.type === 'warning' && (
+            <Alert Icon={AlertCircle} variant="warning" message={alert.message} />
+          )
+        )}
         <CreateReference setAlert={setAlert} idHouses={idHouses} setIdHouses={setIdHouses} />
         <ReferenceList setAlert={setAlert} setIdHouses={setIdHouses} />
       </div>
diff --git a/src/pages/Warhouses.jsx b/src/pages/Warhouses.jsx
index 9c7800f..ee447cb 100644
--- a/src/pages/Warhouses.jsx
+++ b/src/pages/Warhouses.jsx
@@ -10,9 +10,20 @@ const Warhouses = () => {
   const [idHouses, setIdHouses] = useState(null);
   return (
     <div className="min-h-screen bg-gradient-to-br from-slate-50 to-slate-100 p-4 md:p-6 lg:p-8">
-      <div className="max-w-6xl mx-auto">
-        <Header Icon={Warehouse} title={"Omborlar Ro'yxati"} text={"Omborlarni boshqarish va ro'yxatni yuritish tizimi"} />
-        {alert && alert.type === 'success' ? <Alert Icon={Check} variant="success" message={alert.message} /> : alert && alert.type === 'warning' && <Alert Icon={AlertCircle} variant="warning" message={alert.message} />}
+      <div className="max-w-full mx-auto">
+        <Header
+          Icon={Warehouse}
+          title={"Omborlar Ro'yxati"}
+          text={"Omborlarni boshqarish va ro'yxatni yuritish tizimi"}
+        />
+        {alert && alert.type === 'success' ? (
+          <Alert Icon={Check} variant="success" message={alert.message} />
+        ) : (
+          alert &&
+          alert.type === 'warning' && (
+            <Alert Icon={AlertCircle} variant="warning" message={alert.message} />
+          )
+        )}
         <CreateWarhouses setAlert={setAlert} idHouses={idHouses} setIdHouses={setIdHouses} />
         <WarhousesList setAlert={setAlert} setIdHouses={setIdHouses} />
       </div>