refactor: upload section design fix

src/app/(modules)/upload/[videoId]/page.tsx

@@ -3,7 +3,7 @@
 import { useState, useEffect, useCallback } from 'react';
 import { useRouter, useParams } from 'next/navigation';
 import { Card, CardContent, CardHeader, CardTitle } from '@/components/ui/card';
-import { Loader2, TrendingUp } from 'lucide-react';
+import { Loader2, TrendingUp, ArrowUp, ArrowDown } from 'lucide-react';
 import { PageHeader } from '@/components/page-header';
 import { PoweredBy } from '@/components/powered-by';
 import { sessionService, videoService } from '@/services/api';
@@ -151,8 +151,18 @@ export default function VideoProcessingPage() {
                       <span className="text-[10px] font-bold uppercase tracking-widest text-muted-foreground mb-1.5">
                         Chainage
                       </span>
-                      <span className="text-sm font-semibold text-muted-foreground leading-tight">
+                      <span className="text-sm font-semibold text-muted-foreground leading-tight flex items-center gap-1.5">
                         {session.chainageName}
+                        {session.chainageDirection && (
+                          <span className="inline-flex items-center gap-1 px-1 py-0.5 rounded bg-muted text-[10px] font-bold uppercase border">
+                            {session.chainageDirection === 'UP' ? (
+                              <ArrowUp className="h-2.5 w-2.5" />
+                            ) : (
+                              <ArrowDown className="h-2.5 w-2.5" />
+                            )}
+                            {session.chainageDirection}
+                          </span>
+                        )}
                       </span>
                     </div>
                   </div>