minor ui updates + change state dir

src-tauri/src/main.rs

@@ -26,7 +26,7 @@ use crate::srs::SrsDb;
 
 #[tokio::main]
 async fn main() -> Result<()> {
-  let app_dir = dirs::config_dir().unwrap().join("houhou");
+  let app_dir = dirs::state_dir().unwrap().join("houhou");
   fs::create_dir_all(&app_dir).await?;
 
   // Open kanji db
@@ -60,6 +60,15 @@ async fn main() -> Result<()> {
     .manage(KanjiDb(kanji_pool))
     .manage(SrsDb(srs_pool))
     .system_tray(tray)
+    .setup(|app| {
+      let resource_path = app
+        .path_resolver()
+        .resolve_resource("./KanjiDatabase.sqlite")
+        .expect("failed to resolve resource");
+      println!("Resource path: {}", resource_path.display());
+
+      Ok(())
+    })
     .invoke_handler(tauri::generate_handler![
       srs::get_srs_stats,
       srs::add_srs_item,

src/App.module.scss

@@ -1,5 +1,10 @@
+@use "sass:color";
+
 $navLinkAccentColor: #09c;
 $navLinkColor: hsl(203, 91%, 91%);
+$navLinkTransparent: hsla(203, 91%, 91%, 0%);
+$grayed: #f4f4f4;
+$grayedTransparent: #f4f4f400;
 
 .main {
   min-height: 0;
@@ -34,7 +39,7 @@ $navLinkColor: hsl(203, 91%, 91%);
   text-align: center;
   padding: 12px;
   border-top: 4px solid transparent;
-  transition: background-color 0.1s ease-out, border-top-color 0.1s ease-out;
+  transition: background 0.1s ease-out, border-top-color 0.1s ease-out;
 
   // Make the top bar seem less web-ish
   user-select: none;
@@ -43,12 +48,17 @@ $navLinkColor: hsl(203, 91%, 91%);
 
   &:not(.link-active):hover {
     border-top-color: #f4f4f4;
-    background: linear-gradient(#f4f4f4, transparent);
+    background: -moz-linear-gradient(180deg, $grayed 0%, $grayedTransparent 100%);
+    background: -webkit-linear-gradient(180deg, $grayed 0%, $grayedTransparent 100%);
+    background: linear-gradient(180deg, $grayed 0%, $grayedTransparent 100%);
   }
 }
 
 .link-active {
   border-top-color: $navLinkAccentColor;
   // background-color: $navLinkColor;
-  background: linear-gradient($navLinkColor, transparent);
+  background: $navLinkColor;
+  background: -moz-linear-gradient(180deg, $navLinkColor 0%, $navLinkTransparent 100%);
+  background: -webkit-linear-gradient(180deg, $navLinkColor 0%, $navLinkTransparent 100%);
+  background: linear-gradient(180deg, $navLinkColor 0%, $navLinkTransparent 100%);
 }

src/components/DashboardReviewStats.tsx

@@ -5,7 +5,8 @@ import useSWR from "swr";
 import { invoke } from "@tauri-apps/api/tauri";
 import { Link } from "react-router-dom";
 import ConditionalWrapper from "./utils/ConditionalWrapper";
-import ReactTimeago from "react-timeago";
+import ReactTimeago, { Formatter } from "react-timeago";
+import { isValid } from "date-fns";
 
 interface SrsStats {
   reviews_available: number;
@@ -46,7 +47,15 @@ export default function DashboardReviewStats() {
   const canReview = srsStats.reviews_available == 0;
 
   const nextReviewDate = new Date(srsStats.next_review * 1_000);
-  const nextReview = <ReactTimeago date={nextReviewDate} />;
+  const nowFormatter: Formatter = (value, unit, suffix, epochMilliseconds, nextFormatter) => {
+    if (epochMilliseconds < Date.now()) return "now";
+    return nextFormatter?.(value, unit, suffix, epochMilliseconds);
+  };
+  const nextReview = srsStats.next_review ? (
+    <ReactTimeago date={nextReviewDate} formatter={nowFormatter} />
+  ) : (
+    "never"
+  );
 
   const generateStat = (stat: Stat) => {
     return (
@@ -83,7 +92,7 @@ export default function DashboardReviewStats() {
           )}
           elseWrapper={(children) => <Link to="/srs/review">{children}</Link>}
         >
-          <Button isDisabled={canReview} colorScheme="blue">
+          <Button isDisabled={canReview} cursor="pointer" colorScheme="blue">
             Start reviewing <ArrowRightIcon marginLeft={3} />
           </Button>
         </ConditionalWrapper>

src/components/KanjiList.module.scss

@@ -35,6 +35,7 @@ $kanjiCharacterSize: 28px;
 .kanji-list-scroll {
   direction: rtl;
   overflow-y: scroll;
+  overscroll-behavior-y: none;
 }
 
 .kanji-list-inner {