add file viewer functionality across various components

- Implemented a shared file viewer modal using `useFileViewer` hook to allow inline viewing of documents (images, PDFs, videos, etc.) across the application.
- Updated `ContractClearanceReviewSection`, `ContractRequestDetailPage`, `ContractViewPage`, and booking-related components to utilize the new file viewer for document previews.
- Added "Approve all" button in `ContractClearanceReviewSection` to bulk approve documents.
- Enhanced document action buttons to include view and download options based on file type.
- Introduced `isViewable` utility to determine if a file can be previewed inline.
- Created `FileViewer` component to handle rendering of various file types and added appropriate fallback for unsupported formats.

apps/edr-freight-api/src/modules/contracts/dto/sign-contract.dto.ts

@@ -6,10 +6,16 @@ export class SignContractDto {
   @IsIn(['CUSTOMER', 'STAFF', 'DIRECTOR', 'CEO'])
   role!: 'CUSTOMER' | 'STAFF' | 'DIRECTOR' | 'CEO';
 
-  @ApiProperty({ description: 'PNG signature image as base64 (with or without data URL prefix)' })
+  @ApiPropertyOptional({
+    description:
+      'PNG signature image as base64 (with or without data URL prefix). ' +
+      'Optional: when omitted, the signer\'s reusable saved signature from their ' +
+      'profile is used instead.',
+  })
+  @IsOptional()
   @IsString()
   @MinLength(20)
-  signatureImageBase64!: string;
+  signatureImageBase64?: string;
 
   @ApiProperty()
   @IsString()