Lint files

src/components/PageComponents/Connect/BLE.tsx

@@ -35,8 +35,8 @@ export const BLE = (): JSX.Element => {
   };
 
   return (
-    <div className="flex flex-col p-4 gap-2 w-full">
-      <div className="flex gap-2 flex-col h-48 overflow-y-auto">
+    <div className="flex w-full flex-col gap-2 p-4">
+      <div className="flex h-48 flex-col gap-2 overflow-y-auto">
         {bleDevices.map((device, index) => (
           <Button
             key={index}

src/components/PageComponents/Connect/HTTP.tsx

@@ -48,8 +48,8 @@ export const HTTP = (): JSX.Element => {
 
   return (
     // eslint-disable-next-line @typescript-eslint/no-misused-promises
-    <form className="w-full p-4 gap-2 flex flex-col" onSubmit={onSubmit}>
-      <div className="h-48 flex flex-col gap-2">
+    <form className="flex w-full flex-col gap-2 p-4" onSubmit={onSubmit}>
+      <div className="flex h-48 flex-col gap-2">
         <Input
           label="IP Address/Hostname"
           prefix={TLSEnabled ? "https://" : "http://"}

src/components/PageComponents/Connect/Serial.tsx

@@ -46,8 +46,8 @@ export const Serial = (): JSX.Element => {
   };
 
   return (
-    <div className="flex flex-col p-4 gap-2 w-full">
-      <div className="flex gap-2 flex-col h-48 overflow-y-auto">
+    <div className="flex w-full flex-col gap-2 p-4">
+      <div className="flex h-48 flex-col gap-2 overflow-y-auto">
         {serialPorts.map((port, index) => (
           <Button
             key={index}

src/components/PageComponents/Messages/ChannelChat.tsx

@@ -31,8 +31,8 @@ export const ChannelChat = ({ channel }: ChannelChatProps): JSX.Element => {
   };
 
   return (
-    <div className="flex flex-col flex-grow">
-      <div className="flex flex-col flex-grow">
+    <div className="flex flex-grow flex-col">
+      <div className="flex flex-grow flex-col">
         {channel.messages.map((message, index) => (
           <Message
             key={index}

src/components/PageComponents/Messages/Message.tsx

@@ -29,17 +29,17 @@ export const Message = ({
   };
 
   return lastMsgSameUser ? (
-    <div className="flex ml-4">
+    <div className="ml-4 flex">
       {message.ack ? (
-        <CheckCircleIcon className="my-auto text-slate-200 h-4" />
+        <CheckCircleIcon className="my-auto h-4 text-slate-200" />
       ) : (
-        <EllipsisHorizontalCircleIcon className="my-auto text-slate-200 h-4" />
+        <EllipsisHorizontalCircleIcon className="my-auto h-4 text-slate-200" />
       )}
       {"waypointID" in message ? (
         <WaypointMessage waypointID={message.waypointID} />
       ) : (
         <span
-          className={`ml-4 pl-2 border-l-2 border-l-slate-200 ${
+          className={`ml-4 border-l-2 border-l-slate-200 pl-2 ${
             message.ack ? "text-black" : "text-slate-500"
           }`}
         >
@@ -48,9 +48,9 @@ export const Message = ({
       )}
     </div>
   ) : (
-    <div className="mx-4 gap-2 mt-2">
+    <div className="mx-4 mt-2 gap-2">
       <div className="flex gap-2">
-        <div className="cursor-pointer w-6" onClick={openPeer}>
+        <div className="w-6 cursor-pointer" onClick={openPeer}>
           <Hashicon value={(sender?.num ?? 0).toString()} size={32} />
         </div>
         <span
@@ -68,15 +68,15 @@ export const Message = ({
       </div>
       <div className="flex">
         {message.ack ? (
-          <CheckCircleIcon className="my-auto text-slate-200 h-4" />
+          <CheckCircleIcon className="my-auto h-4 text-slate-200" />
         ) : (
-          <EllipsisHorizontalCircleIcon className="my-auto text-slate-200 h-4" />
+          <EllipsisHorizontalCircleIcon className="my-auto h-4 text-slate-200" />
         )}
         {"waypointID" in message ? (
           <WaypointMessage waypointID={message.waypointID} />
         ) : (
           <span
-            className={`ml-4 pl-2 border-l-2 border-l-slate-200 ${
+            className={`ml-4 border-l-2 border-l-slate-200 pl-2 ${
               message.ack ? "text-black" : "text-slate-500"
             }`}
           >

src/components/PageComponents/Messages/NewLocationMessage.tsx

@@ -17,7 +17,7 @@ export const NewLocationMessage = (): JSX.Element => {
   const { connection } = useDevice();
 
   return (
-    <div className="w-96 m-4">
+    <div className="m-4 w-96">
       <form
         onSubmit={(e): void => {
           e.preventDefault();

src/components/PageComponents/Messages/WaypointMessage.tsx

@@ -15,13 +15,13 @@ export const WaypointMessage = ({
   const waypoint = waypoints.find((wp) => wp.id === waypointID);
 
   return (
-    <div className="ml-4 pl-2 border-l-slate-200 border-l-2">
-      <div className="gap-2 flex rounded-md p-2 shadow-md shadow-orange-300">
+    <div className="ml-4 border-l-2 border-l-slate-200 pl-2">
+      <div className="flex gap-2 rounded-md p-2 shadow-md shadow-orange-300">
         <MapPinIcon className="m-auto w-6 text-slate-600" />
         <div>
           <div className="flex gap-2">
             <div className="font-bold">{waypoint?.name}</div>
-            <span className="text-sm font-mono text-slate-500">
+            <span className="font-mono text-sm text-slate-500">
               {toMGRS(waypoint?.latitudeI, waypoint?.longitudeI)}
             </span>
           </div>