1.4.5

ReStartQ · Jan 25, 2024 · beeef6c · beeef6c
1 parent b2c8027
commit beeef6c
Show file tree

Hide file tree

Showing 16 changed files with 152 additions and 96 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,13 @@
 # Changes
 
+## 1.4.5
+
+- For currently airing anime, you can now see how many episodes have aired in grid view.
+- Users can now see the notes they write for each media on their list by hovering the comment icon. Added tooltips for notes and on list icons for grid and compact view.
+- Added margin for on list and note icons for a better look.
+- Changed icon for notes from notepad to a comment icon.
+- Removed colons from labels on the main list media cards.
+
 ## 1.4.4
 
 - Changed color of scrollbar back to blue.

diff --git a/README.md b/README.md
@@ -49,7 +49,7 @@ You can download the app [here](https://github.com/ReStartQ/AniCour/releases). C
 
 1. Download the setup file from the latest release and install it on your computer.
 2. The setup file is labeled as AniCour-Setup-x.x.x.exe, where x denotes a number for the version.
-   <br/> **Ex: AniCour-Setup-1.4.4.exe**
+   <br/> **Ex: AniCour-Setup-1.4.5.exe**
 3. When you run the exe file, Windows will give a message like below because there is no code signing certificate, click on "More info" <p align="center"><a href="#"><img src="https://github.com/ReStartQ/anicour/blob/main/images/help/AniCourNoCodeSigningInitial.png" alt="Hello" /></a></p>
 4. A new option will appear, "Run anyway". Click on it. <p align="center"><a href="#"><img src="https://github.com/ReStartQ/anicour/blob/main/images/help/AniCourNoCodeSigning.png" alt="Hello" /></a></p>
 5. The installer menu will open up to allow you to install it on your computer. <p align="center"><a href="#"><img src="https://github.com/ReStartQ/anicour/blob/main/images/help/AniCourInstallationMenu2.png" alt="Hello" /></a></p>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -124,7 +124,7 @@
     "is-online": "^10.0.0",
     "jotai": "^2.4.2",
     "lodash": "^4.17.21",
-    "material-react-table": "^2.6.1",
+    "material-react-table": "^2.7.0",
     "moment": "^2.29.4",
     "mui-nested-menu": "^3.2.2",
     "react": "^18.2.0",

diff --git a/release/app/package-lock.json b/release/app/package-lock.json
diff --git a/release/app/package.json b/release/app/package.json
@@ -1,6 +1,6 @@
 {
   "name": "anicour",
-  "version": "1.4.4",
+  "version": "1.4.5",
   "description": "Anime, Manga, and Light Novel Tracker Desktop Application for Windows. A fast and interactive way for AniList users to track and manage their anime/manga lists. ",
   "license": "GPL-3.0",
   "author": {

diff --git a/src/renderer/components/app/etc/ProgressStepper.tsx b/src/renderer/components/app/etc/ProgressStepper.tsx
@@ -1,6 +1,7 @@
 import AddIcon from '@mui/icons-material/Add';
 import RemoveIcon from '@mui/icons-material/Remove';
-import { IconButton, Typography } from '@mui/material';
+import { IconButton, Tooltip, Typography } from '@mui/material';
+import InfoIcon from '@mui/icons-material/Info';
 import { useTheme } from '@mui/material/styles';
 import { Box } from '@mui/system';
 import { useEffect, useState } from 'react';
@@ -40,9 +41,31 @@ export default function ProgressStepper({
       flexDirection="column"
       sx={{ gridColumn: '1/2' /* userSelect: 'none' */ }}
     >
-      <Typography fontSize={12} fontWeight="bold">
-        {props.type === 'ANIME' ? 'Episodes:' : 'Chapters:'}
-      </Typography>
+      {props.nextAiringEpisode !== null ? (
+        <Box display="flex" flexDirection="row">
+          <Typography fontSize={12} fontWeight="bold">
+            {props.type === 'ANIME' ? 'Episodes' : 'Chapters'}
+          </Typography>
+          <Tooltip
+            title={
+              props.nextAiringEpisode.episode === 0
+                ? `${props.nextAiringEpisode.episode} episodes aired`
+                : `${props.nextAiringEpisode.episode - 1} episodes aired`
+            }
+            arrow
+            placement="top"
+          >
+            <IconButton size="small" sx={{ padding: 0, ml: 0.5 }}>
+              <InfoIcon sx={{ fontSize: '14px' }} />
+            </IconButton>
+          </Tooltip>
+        </Box>
+      ) : (
+        <Typography fontSize={12} fontWeight="bold">
+          {props.type === 'ANIME' ? 'Episodes' : 'Chapters'}
+        </Typography>
+      )}
+
       <Box
         display="flex"
         flexDirection="row"

diff --git a/src/renderer/components/app/etc/ProgressVolumesStepper.tsx b/src/renderer/components/app/etc/ProgressVolumesStepper.tsx
@@ -36,7 +36,7 @@ export default function ProgressVolumesStepper({
     <>
       <Box display="flex" flexDirection="column" sx={{ gridColumn: '2/3' }}>
         <Typography fontSize={12} fontWeight="bold">
-          Volumes:{' '}
+          Volumes{' '}
         </Typography>
         <Box display="flex" flexDirection="row">
           <IconButton

diff --git a/src/renderer/components/app/etc/ScoreSelect.tsx b/src/renderer/components/app/etc/ScoreSelect.tsx
@@ -26,7 +26,7 @@ export default function ScoreSelect({
   return (
     <Box display="flex" flexDirection="column" sx={{ gridColumn: '1/2' }}>
       <Typography fontSize={12} fontWeight="bold">
-        Score:{' '}
+        Score{' '}
       </Typography>
       <NativeSelect
         value={advancedInput.score}

diff --git a/src/renderer/components/app/etc/SvgIcons.tsx b/src/renderer/components/app/etc/SvgIcons.tsx
@@ -1,10 +1,14 @@
 import { SvgIcon } from '@mui/material';
 import PlaylistAddCheckIcon from '@mui/icons-material/PlaylistAddCheck';
+import PlaylistAddCheckCircleIcon from '@mui/icons-material/PlaylistAddCheckCircle';
+import MessageIcon from '@mui/icons-material/Message';
+import CommentIcon from '@mui/icons-material/Comment';
 import CheckCircleIcon from '@mui/icons-material/CheckCircle';
 
 export function MediaIcons({ type }: any) {
   console.log(type);
   if (type === 0) {
+    /*
     return (
       <SvgIcon fontSize="small">
         <svg
@@ -135,10 +139,13 @@ export function MediaIcons({ type }: any) {
         </svg>
       </SvgIcon>
     );
+    */
+    return <CommentIcon />;
   }
 
   if (type === 0.5) {
     // for list table view
+    /*
     return (
       <SvgIcon fontSize="inherit" sx={{ mr: '5px', mt: '1px' }}>
         <svg
@@ -269,6 +276,8 @@ export function MediaIcons({ type }: any) {
         </svg>
       </SvgIcon>
     );
+    */
+    return <CommentIcon fontSize="inherit" sx={{ mr: '5px', mt: '1px' }} />;
   }
 
   return (
@@ -479,7 +488,12 @@ export function OnListIcon({ type }: any) {
     return <PlaylistAddCheckIcon fontSize="small" />;
   }
   if (type === 0.5) {
-    return <CheckCircleIcon sx={{ mr: '5px', mt: '1px' }} fontSize="inherit" />;
+    return (
+      <PlaylistAddCheckCircleIcon
+        sx={{ mr: '5px', mt: '1px' }}
+        fontSize="inherit"
+      />
+    );
   }
   return <SvgIcon />;
 }
diff --git a/src/renderer/components/app/main/MediaCard.tsx b/src/renderer/components/app/main/MediaCard.tsx
@@ -283,20 +283,23 @@ export default function MediaCard({ props }: any) {
           }}
         />
         {props.mediaListEntry.notes !== null ? (
-          <Box
-            sx={{
-              position: 'absolute',
-              top: 0,
-              left: 0,
-              bgcolor: 'rgba(0, 0, 0, 0.69)',
-              color: 'white',
-              borderBottomRightRadius: '3px',
-              height: '24px',
-              width: '24px',
-            }}
-          >
-            <MediaIcons type={0} />
-          </Box>
+          <Tooltip title={props.mediaListEntry.notes} arrow>
+            <Box
+              sx={{
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                margin: '5px',
+                bgcolor: 'rgba(0, 0, 0, 0.69)',
+                color: 'white',
+                borderRadius: '3px',
+                height: '25px',
+                width: '25px',
+              }}
+            >
+              <MediaIcons type={0} />
+            </Box>
+          </Tooltip>
         ) : null}
       </CardActionArea>
       <CardContent
@@ -358,7 +361,7 @@ export default function MediaCard({ props }: any) {
         {props.type === 'ANIME' ? (
           <Box sx={{ gridColumn: '2/3', gridRow: '2/3' }}>
             <Typography fontSize={12} fontWeight="bold">
-              Studio:{'  '}
+              Studio{'  '}
             </Typography>
             <Typography fontSize={12} noWrap>
               {props.mainStudioIndex !== -1
@@ -377,15 +380,15 @@ export default function MediaCard({ props }: any) {
         )}
         <Box>
           <Typography fontSize={12} fontWeight="bold">
-            Type:{' '}
+            Type{' '}
           </Typography>
           <Typography fontSize={12} noWrap>
             {props.format !== null ? formatType(props.format) : '?'}
           </Typography>
         </Box>
         <Box>
           <Typography fontSize={12} fontWeight="bold">
-            Status:{' '}
+            Status{' '}
           </Typography>
           <Typography fontSize={12} noWrap>
             {props.status !== null ? formatStatus(props.status) : '?'}
@@ -394,7 +397,7 @@ export default function MediaCard({ props }: any) {
         {props.type === 'ANIME' ? (
           <Box>
             <Typography fontSize={12} fontWeight="bold">
-              Season:{' '}
+              Season{' '}
             </Typography>
             <Typography fontSize={12} noWrap>
               {props.season !== null && props.seasonYear !== null
@@ -405,7 +408,7 @@ export default function MediaCard({ props }: any) {
         ) : (
           <Box>
             <Typography fontSize={12} fontWeight="bold">
-              Released:{' '}
+              Released{' '}
             </Typography>
             <Typography fontSize={12} noWrap>
               {formatReleaseDateNumbers(

diff --git a/src/renderer/components/app/main/MediaCardCompact.tsx b/src/renderer/components/app/main/MediaCardCompact.tsx
@@ -68,20 +68,23 @@ export default function MediaCardCompact({ props }: any) {
           }}
         />
         {props.mediaListEntry.notes !== null ? (
-          <Box
-            sx={{
-              position: 'absolute',
-              top: 0,
-              left: 0,
-              bgcolor: 'rgba(0, 0, 0, 0.69)',
-              color: 'white',
-              borderBottomRightRadius: '3px',
-              height: '24px',
-              width: '24px',
-            }}
-          >
-            <MediaIcons type={0} />
-          </Box>
+          <Tooltip title={props.mediaListEntry.notes} arrow>
+            <Box
+              sx={{
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                margin: '5px',
+                bgcolor: 'rgba(0, 0, 0, 0.69)',
+                color: 'white',
+                borderRadius: '3px',
+                height: '25px',
+                width: '25px',
+              }}
+            >
+              <MediaIcons type={0} />
+            </Box>
+          </Tooltip>
         ) : null}
         <Box
           sx={{

diff --git a/src/renderer/components/app/search/SearchMediaCard.tsx b/src/renderer/components/app/search/SearchMediaCard.tsx
@@ -106,17 +106,19 @@ export default function SearchMediaCard({ props }: any) {
           }}
         />
         {props.mediaListEntry !== null ? (
-          <Box
-            sx={{
-              position: 'absolute',
-              top: 0,
-              left: 0,
-              bgcolor: 'rgba(0, 0, 0, 0.69)',
-              color: 'white',
-            }}
-          >
-            <PlaylistAddCheckCircleIcon />
-          </Box>
+          <Tooltip title="On List" arrow>
+            <PlaylistAddCheckCircleIcon
+              sx={{
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                margin: '5px',
+                bgcolor: 'rgba(0, 0, 0, 0.69)',
+                color: 'white',
+                borderRadius: '3px',
+              }}
+            />
+          </Tooltip>
         ) : null}
       </CardActionArea>
       <CardContent

diff --git a/src/renderer/components/app/search/SearchMediaCardCompact.tsx b/src/renderer/components/app/search/SearchMediaCardCompact.tsx
@@ -123,17 +123,19 @@ export default function SearchMediaCardCompact({ props }: any) {
           }}
         />
         {props.mediaListEntry !== null ? (
-          <Box
-            sx={{
-              position: 'absolute',
-              top: 0,
-              left: 0,
-              bgcolor: 'rgba(0, 0, 0, 0.69)',
-              color: 'white',
-            }}
-          >
-            <PlaylistAddCheckCircleIcon />
-          </Box>
+          <Tooltip title="On List" arrow>
+            <PlaylistAddCheckCircleIcon
+              sx={{
+                position: 'absolute',
+                top: 0,
+                left: 0,
+                margin: '5px',
+                bgcolor: 'rgba(0, 0, 0, 0.69)',
+                color: 'white',
+                borderRadius: '3px',
+              }}
+            />
+          </Tooltip>
         ) : null}
         <Box
           sx={{