rust fixes, css fixes and version info

index.html

@@ -5,7 +5,7 @@
   <meta charset="UTF-8" />
   <link rel="stylesheet" href="/src/styles.css" />
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>Snotes Deck</title>
+  <title>Snotes</title>
   <script type="module" src="/src/main.ts" defer></script>
   <style>
     .logo.vite:hover {
@@ -73,6 +73,8 @@
 
     <div id="settings-modal-container">
       <div class="settings-flex">
+        <h2 class="row"><code>SNOTES</code></h2>
+        <p><small id="app-version"></small></p>
         <div class="fontsize-setting">
           <h3>Font Size (in px)</h3>
           <input type="number" name="fontsize" id="fontsize-setting-input" placeholder="">

libsnotes/src/lib.rs

@@ -56,7 +56,7 @@ pub fn create_note(content: &String, tag: &String) -> Result<()> {
 
     let query_insert = "INSERT INTO notes (content, date, tag) VALUES (?1, ?2, ?3)";
 
-    match connection.execute(query_insert, [&content, &date_string, &tag_string]) {
+    match connection.execute(query_insert, [content, &date_string, &tag_string]) {
         Ok(v) => println!("CREATE OK {}", v),
         Err(e) => println!("CREATE ERR {}", e),
     };
@@ -239,7 +239,7 @@ pub fn get_note_by_id(id: u32) -> Result<String, String> {
     let db = get_db_dir();
     let connection = Connection::open(db).map_err(|e| format!("Database Error: {}", e))?;
 
-    let query = format!("SELECT * FROM notes WHERE nid IS {};", id.to_string());
+    let query = format!("SELECT * FROM notes WHERE nid IS {};", id);
     let mut prepare = connection
         .prepare(&query)
         .map_err(|e| format!("Query Error: {}", e))?;
@@ -289,6 +289,5 @@ mod tests {
     fn test_id_10() {
         let result = get_note_by_id(10).unwrap();
         println!("{}", result);
-        assert!(true)
     }
 }

src-tauri/Cargo.lock

@@ -3484,7 +3484,7 @@ checksum = "3c5e1a9a646d36c3599cd173a41282daf47c44583ad367b8e6837255952e5c67"
 
 [[package]]
 name = "snotes-deck"
-version = "0.0.0"
+version = "0.0.14"
 dependencies = [
  "home",
  "libsnotes",

src-tauri/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "snotes-deck"
-version = "0.0.0"
+version = "0.0.14"
 description = "A simple little Note App"
 authors = ["you"]
 edition = "2021"

src-tauri/src/main.rs

@@ -6,6 +6,11 @@ use std::fs;
 use home::home_dir;
 use libsnotes::show_notes;
 
+#[tauri::command]
+fn get_app_version() -> String {
+    env!("CARGO_PKG_VERSION").to_string()
+}
+
 #[tauri::command]
 fn init_db() {
     libsnotes::init_db().unwrap();
@@ -107,6 +112,7 @@ fn main() {
         .plugin(tauri_plugin_dialog::init())
         .plugin(tauri_plugin_shell::init())
         .invoke_handler(tauri::generate_handler![
+            get_app_version,
             init_db,
             get_notes_list,
             get_latest_note,

src-tauri/tauri.conf.json

@@ -18,14 +18,14 @@
   },
   "productName": "snotes-deck",
   "mainBinaryName": "snotes-deck",
-  "version": "0.0.13",
+  "version": "0.0.14",
   "identifier": "space.maidsin.snotes-deck",
   "plugins": {},
   "app": {
     "withGlobalTauri": true,
     "windows": [
       {
-        "title": "Snotes Deck",
+        "title": "Snotes",
         "width": 800,
         "height": 600,
         "useHttpsScheme": true

src/main.ts

@@ -24,6 +24,7 @@ let idModalActive = false;
 
 let typingTimer: number | null = null;
 const AUTOSAVE_DELAY = 5000;
+const BACKGROUND_COLOR = "#252525";
 
 enum EditorState {
   NEW,
@@ -692,9 +693,18 @@ async function exportNote(contents: string | null) {
   }
 }
 
-function handleOpenSettingsModal() {
+async function handleOpenSettingsModal() {
+  // insert app version
+  const appVersionEl = document.getElementById("app-version");
+  if (appVersionEl) {
+    const VERSION_STR = await invoke("get_app_version");
+    appVersionEl.textContent = "version " + VERSION_STR;
+  } else {
+    console.error("Failed to get app version element.");
+  }
+  // open modal
   const modalBg = document.getElementById("id-modal-bg");
-  const setingsModalContainer = document.getElementById(
+  const settingsModalContainer = document.getElementById(
     "settings-modal-container"
   );
   const settingsFontsizeInput = document.getElementById(
@@ -704,15 +714,16 @@ function handleOpenSettingsModal() {
     "ocr-language-setting-input"
   ) as HTMLInputElement;
   const settingsSaveButton = document.getElementById("save-settings-button");
-  if (modalBg && setingsModalContainer && settingsFontsizeInput) {
+  if (modalBg && settingsModalContainer && settingsFontsizeInput) {
     modalBg.style.display = "block";
-    setingsModalContainer.style.display = "block";
+    settingsModalContainer.style.display = "block";
+    settingsModalContainer.style.backgroundColor = BACKGROUND_COLOR;
     settingsFontsizeInput.focus();
     settingsFontsizeInput.value = settings ? settings.fontSize : "16";
     settingsOcrLanguageInput.value = settings ? settings.ocrLanguage : "eng";
 
     modalBg.addEventListener("click", () => {
-      setingsModalContainer.style.display = "none";
+      settingsModalContainer.style.display = "none";
       modalBg.style.display = "none";
     });
 
@@ -737,11 +748,11 @@ function handleOpenSettingsModal() {
           } else {
             console.error("failed to get createNoteContentEl");
           }
-          setingsModalContainer.style.display = "none";
+          settingsModalContainer.style.display = "none";
           modalBg.style.display = "none";
         }
         if (event.key === "Escape") {
-          setingsModalContainer.style.display = "none";
+          settingsModalContainer.style.display = "none";
           modalBg.style.display = "none";
         }
       }
@@ -766,7 +777,7 @@ function handleOpenSettingsModal() {
         } else {
           console.error("failed to get createNoteContentEl");
         }
-        setingsModalContainer.style.display = "none";
+        settingsModalContainer.style.display = "none";
         modalBg.style.display = "none";
       });
     } else {

src/styles.css

@@ -46,15 +46,24 @@
   background-color: #1f1f1f;
   margin-left: 1em;
   width: 100%;
-  height: 100%;
-
-  border-radius: 15px;
-
+  height: calc(100vh - 1vh);
   display: flex;
   flex-direction: column;
-  justify-content: flex-end;
-
+}
 
+#create-input {
+  flex-grow: 1;
+  margin: 0.5em;
+  font-size: 16px;
+  line-height: 1.5;
+  padding: 10px;
+  border: 1px solid #3b3b3b;
+  border-radius: 5px;
+  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+  resize: none;
+  font-family: Inter, Avenir, Helvetica, Arial, sans-serif;
+  background-color: #252525;
+  color: #f6f6f6;
 }
 
 .row {
@@ -338,9 +347,11 @@ button {
   display: none;
 
   position: fixed;
+  top: 50%;
+  left: 50%;
+  transform: translate(-50%, -50%);
 
-  margin-top: 20%;
-  margin-left: 50%;
+  padding: 2em;
 
   z-index: 4;
 }