fix(web): new album title fix (#5467)

* new album title fix

* Naming

---------

Co-authored-by: Alex Tran <alex.tran1502@gmail.com>

server/src/domain/album/dto/album-create.dto.ts

@@ -1,9 +1,8 @@
 import { ApiProperty } from '@nestjs/swagger';
-import { IsNotEmpty, IsString } from 'class-validator';
+import { IsString } from 'class-validator';
 import { Optional, ValidateUUID } from '../../domain.util';
 
 export class CreateAlbumDto {
-  @IsNotEmpty()
   @IsString()
   @ApiProperty()
   albumName!: string;

web/src/lib/components/shared-components/album-selection-modal.svelte

@@ -41,9 +41,9 @@
 
   const handleNew = () => {
     if (shared) {
-      dispatch('newAlbum', { albumName: search.length > 0 ? search : 'Untitled' });
+      dispatch('newAlbum', { albumName: search.length > 0 ? search : '' });
     } else {
-      dispatch('newSharedAlbum', { albumName: search.length > 0 ? search : 'Untitled' });
+      dispatch('newSharedAlbum', { albumName: search.length > 0 ? search : '' });
     }
   };
 </script>

web/src/routes/(user)/albums/+page.svelte

@@ -207,7 +207,7 @@
   const removeAlbumsIfEmpty = async () => {
     try {
       for (const album of $albums) {
-        if (album.assetCount == 0 && album.albumName == 'Untitled') {
+        if (album.assetCount == 0 && album.albumName == '') {
           await deleteAlbum(album);
         }
       }

web/src/routes/(user)/albums/[albumId]/+page.svelte

@@ -95,7 +95,7 @@
   let titleInput: HTMLInputElement;
   let isEditingDescription = false;
   let isCreatingSharedAlbum = false;
-  let currentAlbumName = '';
+  let currentAlbumName = album.albumName;
   let contextMenuPosition: { x: number; y: number } = { x: 0, y: 0 };
   let isShowActivity = false;
   let isLiked: ActivityResponseDto | null = null;
@@ -578,6 +578,7 @@
                 disabled={!isOwned}
                 bind:this={titleInput}
                 title="Edit Title"
+                placeholder="Add a title"
               />
 
               <!-- ALBUM SUMMARY -->

web/src/routes/(user)/albums/__tests__/albums.bloc.spec.ts

@@ -30,7 +30,7 @@ describe('Albums BLoC', () => {
   });
 
   it('loads albums from the server', async () => {
-    // TODO: this method currently deletes albums with no assets and albumName === 'Untitled' which might not be the best approach
+    // TODO: this method currently deletes albums with no assets and albumName === '' which might not be the best approach
     const loadedAlbums = [..._albums, albumFactory.build({ id: 'new_loaded_uuid' })];
 
     apiMock.albumApi.getAllAlbums.mockResolvedValueOnce({
@@ -63,9 +63,8 @@ describe('Albums BLoC', () => {
   });
 
   it('creates a new album', async () => {
-    // TODO: we probably shouldn't hardcode the album name "untitled" here and let the user input the album name before creating it
     const payload: CreateAlbumDto = {
-      albumName: 'Untitled',
+      albumName: '',
     };
 
     const returnedAlbum = albumFactory.build();

web/src/routes/(user)/albums/albums.bloc.ts

@@ -16,9 +16,9 @@ export const useAlbums = (props: AlbumsProps) => {
       const { data } = await api.albumApi.getAllAlbums();
       albums.set(data);
 
-      // Delete album that has no photos and is named 'Untitled'
+      // Delete album that has no photos and is named ''
       for (const album of data) {
-        if (album.albumName === 'Untitled' && album.assetCount === 0) {
+        if (album.albumName === '' && album.assetCount === 0) {
           setTimeout(async () => {
             await deleteAlbum(album);
           }, 500);
@@ -36,7 +36,7 @@ export const useAlbums = (props: AlbumsProps) => {
     try {
       const { data: newAlbum } = await api.albumApi.createAlbum({
         createAlbumDto: {
-          albumName: 'Untitled',
+          albumName: '',
         },
       });
 

web/src/routes/(user)/sharing/+page.svelte

@@ -23,7 +23,7 @@
     try {
       const { data: newAlbum } = await api.albumApi.createAlbum({
         createAlbumDto: {
-          albumName: 'Untitled',
+          albumName: '',
         },
       });