View assets detail and download operation (#198)

* Fixed not displaying default user profile picture

* Added buttons to close viewer and micro-interaction for navigating assets left, right

* Add additional buttons to the control bar

* Display EXIF info

* Added map to detail info

* Handle user input keyboard

* Fixed incorrect file name when downloading multiple files

* Implemented download panel

server/src/api-v1/asset/asset.controller.ts

@@ -123,7 +123,7 @@ export class AssetController {
 
   @Get('/')
   async getAllAssets(@GetAuthUser() authUser: AuthUserDto) {
-    return await this.assetService.getAllAssetsNoPagination(authUser);
+    return await this.assetService.getAllAssets(authUser);
   }
 
   @Get('/:deviceId')

server/src/api-v1/asset/asset.service.ts

@@ -61,13 +61,17 @@ export class AssetService {
     return res;
   }
 
-  public async getAllAssetsNoPagination(authUser: AuthUserDto) {
+  public async getAllAssets(authUser: AuthUserDto) {
     try {
-      return await this.assetRepository
-        .createQueryBuilder('a')
-        .where('a."userId" = :userId', { userId: authUser.id })
-        .orderBy('a."createdAt"::date', 'DESC')
-        .getMany();
+      return await this.assetRepository.find({
+        where: {
+          userId: authUser.id
+        },
+        relations: ['exifInfo'],
+        order: {
+          createdAt: 'DESC'
+        }
+      })
     } catch (e) {
       Logger.error(e, 'getAllAssets');
     }
@@ -100,8 +104,18 @@ export class AssetService {
     const asset = await this.findOne(query.did, query.aid);
 
     if (query.isThumb === 'false' || !query.isThumb) {
+      const { size } = await fileInfo(asset.originalPath);
+      res.set({
+        'Content-Type': asset.mimeType,
+        'Content-Length': size,
+      });
       file = createReadStream(asset.originalPath);
     } else {
+      const { size } = await fileInfo(asset.resizePath);
+      res.set({
+        'Content-Type': 'image/jpeg',
+        'Content-Length': size,
+      });
       file = createReadStream(asset.resizePath);
     }
 

server/src/api-v1/user/user.service.ts

@@ -147,15 +147,16 @@ export class UserService {
   async getUserProfileImage(userId: string, res: Res) {
     try {
       const user = await this.userRepository.findOne({ id: userId })
+
       if (!user.profileImagePath) {
-        console.log("empty return")
-        throw new BadRequestException('User does not have a profile image');
+        // throw new BadRequestException('User does not have a profile image');
+        res.status(404).send('User does not have a profile image');
+        return;
       }
 
       res.set({
         'Content-Type': 'image/jpeg',
       });
-
       const fileStream = createReadStream(user.profileImagePath)
       return new StreamableFile(fileStream);
     } catch (e) {