bugsfixed and design changes for generation 13'' screen

src/components/Sidebar.tsx

@@ -121,12 +121,12 @@ export default function Sidebar({
     entities,
     "view_statistics"
   );
+
   const entitiesAllowPaymentRecord = useAllowedEntities(
     user,
     entities,
     "view_payment_record"
   );
-
   const entitiesAllowGeneration = useAllowedEntitiesSomePermissions(
     user,
     entities,
@@ -148,7 +148,7 @@ export default function Sidebar({
         viewTickets: true,
         viewClassrooms: true,
         viewSettings: true,
-        viewPaymentRecord: true,
+        viewPaymentRecords: true,
         viewGeneration: true,
         viewApprovalWorkflows: true,
       };
@@ -160,7 +160,7 @@ export default function Sidebar({
       viewTickets: false,
       viewClassrooms: false,
       viewSettings: false,
-      viewPaymentRecord: false,
+      viewPaymentRecords: false,
       viewGeneration: false,
       viewApprovalWorkflows: false,
     };
@@ -235,7 +235,7 @@ export default function Sidebar({
       ) &&
       entitiesAllowPaymentRecord.length > 0
     ) {
-      sidebarPermissions["viewPaymentRecord"] = true;
+      sidebarPermissions["viewPaymentRecords"] = true;
     }
     return sidebarPermissions;
   }, [
@@ -378,7 +378,6 @@ export default function Sidebar({
             isMinimized={isMinimized}
           />
         )}
-
       </div>
       <div className="-xl:flex flex-col gap-3 xl:hidden">
         <Nav
@@ -427,6 +426,16 @@ export default function Sidebar({
             isMinimized
           />
         )}
+        {sidebarPermissions["viewPaymentRecords"] && (
+          <Nav
+            disabled={disableNavigation}
+            Icon={BsCurrencyDollar}
+            label="Payment Record"
+            path={path}
+            keyPath="/payment-record"
+            isMinimized
+          />
+        )}
         {sidebarPermissions["viewSettings"] && (
           <Nav
             disabled={disableNavigation}
@@ -459,7 +468,7 @@ export default function Sidebar({
         )}
       </div>
 
-      <div className="2xl:fixed bottom-12 flex flex-col gap-0 -2xl:mt-8">
+      <div className="2xl:fixed bottom-12 flex flex-col gap-0 -2xl:mt-8 ">
         <div
           role="button"
           tabIndex={1}
@@ -483,7 +492,7 @@ export default function Sidebar({
           tabIndex={1}
           onClick={focusMode ? () => {} : logout}
           className={clsx(
-            "hover:text-mti-rose flex cursor-pointer items-center gap-4 rounded-full p-4 text-black transition duration-300 ease-in-out",
+            "hover:text-mti-rose flex cursor-pointer items-center gap-4 rounded-full p-4 text-black transition duration-300 ease-in-out -xl:px-4",
             isMinimized ? "w-fit" : "w-full min-w-[250px] px-8"
           )}
         >