Reversed items direction #16

src/app/applications/page.tsx

@@ -48,7 +48,7 @@ export default function ApplicationsPage() {
         </RegisterAppDialog>
       </div>
       <div className="grid gap-4 sm:grid-cols-2 lg:grid-cols-3">
-        {apps.map((app) => (
+        {apps.toReversed().map((app) => (
           <Card key={app.id}>
             <CardHeader>
               <CardTitle>{app.name}</CardTitle>

src/app/deployments/page.tsx

@@ -74,7 +74,7 @@ export default function DeploymentsPage() {
         </DeployAppDialog>
       </div>
 
-      <div className="divide-y divide-border flex flex-col gap-5">
+      <div className="divide-y divide-border flex flex-col-reverse gap-5">
         {deployments.map((dep) => {
           return (
             <Card key={`${dep.image}-${dep.container ?? "latest"}`}>

src/app/overview/page.tsx

@@ -192,7 +192,7 @@ export default function OverviewPage() {
         </CardHeader>
         <CardContent className="overflow-x-auto">
           <div className="grid grid-cols-1 md:grid-cols-3 gap-4 min-w-75">
-            {nodes.map((node, i) => (
+            {nodes.toReversed().map((node, i) => (
               <div key={i} className="border border-border p-4 bg-secondary/30">
                 <div className="flex flex-col sm:flex-row sm:items-center sm:justify-between mb-3 gap-2">
                   <div className="flex items-center gap-2">