1.4.9

ReStartQ · Feb 16, 2024 · b0296df · b0296df
1 parent 60f2ca2
commit b0296df
Show file tree

Hide file tree

Showing 14 changed files with 439 additions and 114 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -1,5 +1,12 @@
 # Changes
 
+## 1.4.9
+
+- When saving account information, there is now a notification to show whether the authentication information is valid or not. (Success/Failed to authenticate messages)
+- Grid view list media cards have changed visually (score select, update buttons, progress buttons) to a blue outlined theme.
+- Progress bar now scales in width along with episode/chapter/volume text.
+- Fixed bug for when user tries to sync without correct username/token.
+
 ## 1.4.8
 
 - Replaced the indicator tooltip with a progress bar for the grid media cards. These progress bars indicate progress towards completing the media and shows the available episodes available. Grid card's information section margin spacing has changed.

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.8.exe**
+   <br/> **Ex: AniCour-Setup-1.4.9.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/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.8",
+  "version": "1.4.9",
   "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/MediaProgress.tsx b/src/renderer/components/app/etc/MediaProgress.tsx
@@ -1,11 +1,70 @@
 import { LinearProgress } from '@mui/material';
 import React from 'react';
 
-const MediaProgress = ({ progress, buffer }: any) => {
+const MediaProgress = ({
+  progress,
+  buffer,
+  progressRaw,
+  episodes,
+  chapters,
+  volumes,
+  mediaType,
+  type,
+}: any) => {
   // MIN = Minimum expected value
   // MAX = Maximum expected value
   // Function to normalise the values (MIN / MAX could be integrated)
   // const normalise = (value) => ((value - MIN) * 100) / (MAX - MIN);
+  function getLength(number: any) {
+    if (number !== null) {
+      return number.toString().length;
+    }
+    return 1;
+  }
+
+  const getWidth = (
+    rawValue: any,
+    ep: any,
+    ch: any,
+    vol: any,
+    typeMedia: any,
+    progressType: any,
+  ) => {
+    // eslint-disable-next-line prefer-const
+    let counter = 0;
+    if (progressType === 0) {
+      if (typeMedia === 'ANIME') {
+        counter += getLength(rawValue) + getLength(ep);
+      } else {
+        counter += getLength(rawValue) + getLength(ch);
+      }
+    }
+    if (progressType === 1) {
+      counter += getLength(rawValue) + getLength(vol);
+    }
+    switch (counter) {
+      case 2:
+        // g
+        return '66%';
+      case 3:
+        // g
+        return '71%';
+      case 4:
+        // g
+        return '78%';
+      case 5:
+        // g
+        return '85%';
+      case 6:
+        // g
+        return '88%';
+      case 7:
+        // g
+        return '92%';
+      default: // 8 g
+        return '95%';
+    }
+  };
 
   return (
     <LinearProgress
@@ -15,8 +74,15 @@ const MediaProgress = ({ progress, buffer }: any) => {
       color="info"
       sx={{
         border: '1px solid deepskyblue',
-        width: '75%',
-        height: '7px',
+        width: getWidth(
+          progressRaw,
+          episodes,
+          chapters,
+          volumes,
+          mediaType,
+          type,
+        ),
+        height: '6px',
         '& .MuiLinearProgress-dashed': {
           animation: 'none',
           backgroundImage: 'none',

diff --git a/src/renderer/components/app/etc/ProgressStepper.tsx b/src/renderer/components/app/etc/ProgressStepper.tsx
@@ -177,11 +177,14 @@ export default function ProgressStepper({
           onClick={handleBack}
           disabled={advancedInput.progress === 0}
           sx={{
+            '&:hover': {
+              backgroundColor: '#12467b',
+            },
             m: 0,
             p: 0,
             minWidth: 0,
             '--IconButton-size': '12px',
-            mr: '4px',
+            mr: advancedInput.progress >= 100 ? '2px' : '4px',
           }}
         >
           <RemoveIcon fontSize="inherit" />
@@ -206,11 +209,14 @@ export default function ProgressStepper({
             advancedInput.progress === 9999
           }
           sx={{
+            '&:hover': {
+              backgroundColor: '#12467b',
+            },
             m: 0,
             p: 0,
             minWidth: 0,
             '--IconButton-size': '12px',
-            ml: '4px',
+            ml: advancedInput.progress >= 100 ? '2px' : '4px',
           }}
         >
           <AddIcon fontSize="inherit" />
@@ -241,6 +247,12 @@ export default function ProgressStepper({
             props.chapters,
             props.type,
           )}
+          progressRaw={advancedInput.progress}
+          episodes={props.episodes}
+          chapters={props.chapters}
+          volumes={props.volumes}
+          mediaType={props.type}
+          type={0}
         />
       </Box>
     </Box>

diff --git a/src/renderer/components/app/etc/ProgressVolumesStepper.tsx b/src/renderer/components/app/etc/ProgressVolumesStepper.tsx
@@ -71,11 +71,14 @@ export default function ProgressVolumesStepper({
             onClick={handleBack}
             disabled={advancedInput.progressVolumes === 0}
             sx={{
+              '&:hover': {
+                backgroundColor: '#12467b',
+              },
               m: 0,
               p: 0,
               minWidth: 0,
               '--IconButton-size': '12px',
-              mr: '4px',
+              mr: advancedInput.progressVolumes >= 100 ? '2px' : '4px',
             }}
           >
             <RemoveIcon fontSize="inherit" />
@@ -96,11 +99,14 @@ export default function ProgressVolumesStepper({
               advancedInput.progressVolumes === 9999
             }
             sx={{
+              '&:hover': {
+                backgroundColor: '#12467b',
+              },
               m: 0,
               p: 0,
               minWidth: 0,
               '--IconButton-size': '12px',
-              ml: '4px',
+              ml: advancedInput.progress >= 100 ? '2px' : '4px',
             }}
           >
             <AddIcon fontSize="inherit" />
@@ -115,6 +121,12 @@ export default function ProgressVolumesStepper({
           <MediaProgress
             progress={normalise(advancedInput.progressVolumes)}
             buffer={normalise(props.volumes !== null ? props.volumes : 0)}
+            progressRaw={advancedInput.progressVolumes}
+            episodes={props.episodes}
+            chapters={props.chapters}
+            volumes={props.volumes}
+            mediaType={props.type}
+            type={1}
           />
         </Box>
       </Box>

diff --git a/src/renderer/components/app/etc/ScoreSelect.tsx b/src/renderer/components/app/etc/ScoreSelect.tsx
@@ -3,6 +3,7 @@ import RemoveIcon from '@mui/icons-material/Remove';
 import { IconButton, NativeSelect, Typography } from '@mui/material';
 import { Box } from '@mui/system';
 import { useEffect, useState } from 'react';
+import ArrowDropDownIcon from '@mui/icons-material/ArrowDropDown';
 
 export default function ScoreSelect({
   props,
@@ -32,11 +33,20 @@ export default function ScoreSelect({
         value={advancedInput.score}
         size="small"
         sx={{
-          width: '45px',
+          pt: '4px',
+          width: '55px',
+          height: '22px',
           fontSize: '12px',
           textAlignLast: 'right',
-          borderRadius: '0px',
+          border: '1px solid #03a9f4',
+          borderRadius: '5px',
+          color: ' #81d4fa',
+          '&:hover': {
+            backgroundColor: '#1F242F',
+          },
+          backgroundColor: '#0b0d0e',
         }}
+        disableUnderline
         onChange={onChange}
       >
         {props.mediaListEntry.score % 1 !== 0 ? (

diff --git a/src/renderer/components/app/main/MediaCard.tsx b/src/renderer/components/app/main/MediaCard.tsx
@@ -1,6 +1,5 @@
 import {
   Alert,
-  Button,
   CardActionArea,
   IconButton,
   Snackbar,
@@ -44,7 +43,7 @@ import {
 } from 'renderer/store';
 import { useAdvancedMedia } from 'renderer/context/advanced/AdvancedMediaContext';
 import { useCategory } from 'renderer/context/CategoryContext';
-import { Tooltip } from '@mui/joy';
+import { Button, Tooltip } from '@mui/joy';
 import ContextMenu from '../etc/ContextMenu';
 import ProgressStepper from '../etc/ProgressStepper';
 import ProgressVolumesStepper from '../etc/ProgressVolumesStepper';
@@ -312,11 +311,10 @@ export default function MediaCard({ props }: any) {
           gridRow: '1/3',
           gridColumn: '2/3',
           paddingTop: '4px',
-          paddingX: '12px',
           '&:last-child': { pb: '4px' },
           display: 'grid',
-          gridTemplateRows: 'repeat(auto-fill, 1fr)',
-          gridTemplateColumns: '98px 98px',
+          gridTemplateRows: '26px 48px 42px 36px 1fr',
+          gridTemplateColumns: '96px 96px',
         }}
       >
         <Box sx={{ gridColumn: '1/3', display: 'flex', flexDirection: 'row' }}>
@@ -425,14 +423,30 @@ export default function MediaCard({ props }: any) {
             </Typography>
           </Box>
         )}
-        <Button
-          size="small"
-          sx={{ gridColumn: '1/3', textTransform: 'none', my: '5px' }}
-          variant="outlined"
-          onClick={handleUpdate}
+        <Box
+          sx={{
+            gridColumn: '1/3',
+            mt: '3px',
+            mb: '5px',
+          }}
         >
-          Update
-        </Button>
+          <Button
+            size="sm"
+            fullWidth
+            sx={{
+              textTransform: 'none',
+              '&:hover': {
+                backgroundColor: '#0a2744',
+              },
+              py: 0,
+              height: '15px',
+            }}
+            variant="outlined"
+            onClick={handleUpdate}
+          >
+            Update
+          </Button>
+        </Box>
       </CardContent>
       <ContextMenu
         props={props}