library: various fixes on metadata editor and bookshelf (#1663)

* i18n: update translations

* library: various fixes on metadata editor and bookshelf

* chore: enable parallel web builds checking

apps/readest-app/src/components/BookCover.tsx

@@ -48,10 +48,7 @@ const BookCover: React.FC<BookCoverProps> = ({
   return (
     <div
       ref={coverRef}
-      className={clsx(
-        'book-cover-container no-context-menu relative flex h-full w-full',
-        className,
-      )}
+      className={clsx('book-cover-container relative flex h-full w-full', className)}
     >
       {coverFit === 'crop' ? (
         <Image

apps/readest-app/src/components/metadata/BookDetailEdit.tsx

@@ -114,7 +114,7 @@ const BookDetailEdit: React.FC<BookDetailEditProps> = ({
       field: 'published',
       label: _('Publication Date'),
       value: metadata.published || '',
-      placeholder: 'YYYY or YYYY-MM-DD',
+      placeholder: _('YYYY or YYYY-MM-DD'),
     },
     {
       field: 'language',
@@ -178,9 +178,12 @@ const BookDetailEdit: React.FC<BookDetailEditProps> = ({
     let files;
     if (isTauriAppPlatform()) {
       files = (await selectImageFileTauri()) as string[];
-      if (files.length > 0) {
+      if (appService && files.length > 0) {
         metadata.coverImageFile = files[0]!;
-        metadata.coverImageUrl = appService?.fs.getURL(files[0]!);
+        const tempName = 'cover-temp.png';
+        const cachePrefix = appService.fs.getPrefix('Cache');
+        await appService.fs.copyFile(files[0]!, tempName, 'Cache');
+        metadata.coverImageUrl = await appService.fs.getURL(`${cachePrefix}/${tempName}`);
         setNewCoverImageUrl(metadata.coverImageUrl!);
       }
     } else {
@@ -196,7 +199,10 @@ const BookDetailEdit: React.FC<BookDetailEditProps> = ({
     <div className='bg-base-100 relative w-full rounded-lg'>
       <div className='mb-6 flex items-start gap-4'>
         <div className='flex w-[30%] max-w-32 flex-col gap-2'>
-          <div className='aspect-[28/41] h-full shadow-md'>
+          <div
+            className='aspect-[28/41] h-full shadow-md'
+            onClick={!isCoverLocked ? handleSelectLocalImage : undefined}
+          >
             <BookCover
               mode='list'
               book={{
@@ -222,7 +228,12 @@ const BookDetailEdit: React.FC<BookDetailEditProps> = ({
               )}
               title={_('Change cover image')}
             >
-              <MdEdit className='h-5 w-5 sm:h-4 sm:w-4' />
+              <MdEdit
+                className={clsx(
+                  'h-5 w-5 sm:h-4 sm:w-4',
+                  isCoverLocked ? 'fill-base-content' : 'fill-gray-600',
+                )}
+              />
               <span className='hidden sm:inline'>{_('Replace')}</span>
             </button>
 

apps/readest-app/src/components/metadata/BookDetailView.tsx

@@ -100,7 +100,7 @@ const BookDetailView: React.FC<BookDetailViewProps> = ({
           <div className='overflow-hidden'>
             <span className='font-bold'>{_('Published')}</span>
             <p className='text-neutral-content text-sm'>
-              {formatDate(metadata.published) || _('Unknown')}
+              {formatDate(metadata.published, true) || _('Unknown')}
             </p>
           </div>
           <div className='overflow-hidden'>