Merge pull request #32 from monofox/feature/custom_queries

Feature: custom queries

Author: tmahmood

CHANGELOG.md

@@ -1,3 +1,17 @@
+## Sun 04, May, 2025
+- [x] Remember shortcuts for project and tags in a cache file.
+  Default cache path: $HOME/.cache/taskwarrior-web/mnemonics.cache
+
+## Thu 01, May, 2025
+- [x] Improved CI pipeline in order to increase continues quality checks.
+- [x] Improved mobile view: proper scaling of the pages as well as headers are now really sticky, not fixed anymore. This ensures, that the header does not cover any tasks on small displays.
+
+## Tue 29, April, 2025
+- [x] Rework of task modifications.
+- [x] Adding absolute dates in task details.
+- [x] Added possibility to delete tasks.
+- [x] For denotation its now possible to select specific annotations.
+
 ## Fri 28, March, 2025
 - [x] Font's can be customized
 - [x] Removed packaged font

Cargo.lock

@@ -28,6 +28,7 @@ serde_path_to_error = "0.1.17"
 shell-words = "1.1.0"
 directories = "6.0.0"
 toml = "0.8.22"
+config = { version = "0.15.11", default-features = false, features = ["toml"] }
 
 [dev-dependencies]
 tempfile = "3.19.1"

Cargo.toml

@@ -26,11 +26,12 @@ RUN echo "NoExtract = !usr/share/doc/timew/*" >> /etc/pacman.conf \
  && pacman -S --noconfirm task timew cronie vi \
  && pacman -S --noconfirm python-pip \
  && useradd -m -d /app task && passwd -d task \
- && chown -R task:task /app && chmod -R 775 /app \
  && mkdir -p /app/bin \
  && mkdir -p /app/taskdata \
  && mkdir -p /app/.task/hooks \
  && mkdir -p /app/.timewarrior/data/ \
+ && mkdir -p /app/.config/taskwarrior-web/ \
+ && chown -R task:task /app && chmod -R 775 /app \
  && systemctl enable cronie.service \
  && cp /usr/share/doc/timew/ext/on-modify.timewarrior /app/.task/hooks/on-modify.timewarrior \
  && chmod +x /app/.task/hooks/on-modify.timewarrior \
@@ -67,6 +68,7 @@ EXPOSE 3000
 # Taskwarrior data volume
 VOLUME /app/taskdata/
 VOLUME /app/.timewarrior/
+VOLUME /app/.config/taskwarrior-web/
 
 ENV TASKRC="/app/.taskrc"
 ENV TASKDATA="/app/taskdata"

Dockerfile

@@ -59,10 +59,11 @@ That should do it.
 
 The docker shares following directories as volumes to store data:
 
-| Volume path       | Purpose                                        |
-| ----------------- | ---------------------------------------------- |
-| /app/taskdata     | Stores task data (mostly taskchampion.sqlite3) |
-| /app/.timewarrior | Stores timewarrior data                        |
+| Volume path                  | Purpose                                        |
+| -----------------            | ---------------------------------------------- |
+| /app/taskdata                | Stores task data (mostly taskchampion.sqlite3) |
+| /app/.timewarrior            | Stores timewarrior data                        |
+| /app/.config/taskwarrior-web | Stores taskwarrior-web configuration file      |
 
 It is recommend to specify the corresponding volume in order to persist the data.
 
@@ -78,12 +79,12 @@ It is recommend to specify the corresponding volume in order to persist the data
 
 In order to configure the environment variables and contexts for `timewarrior-web`, docker environments can be specified:
 
-| Docker environment               | Shell environment       | Purpose 
-| -------------------------------- | ----------------------- | ---------------------------------------------------------|
+| Docker environment               | Shell environment       | Purpose                                                  |
+| -------------------------------- | ----------------------- | -------------------------------------------------------- |
 | TASK_WEB_TWK_SERVER_PORT         | TWK_SERVER_PORT         | Specifies the server port (see "Ports")                  |
 | TASK_WEB_DISPLAY_TIME_OF_THE_DAY | DISPLAY_TIME_OF_THE_DAY | Displays a time of the day widget in case of value `1`   |
 | TASK_WEB_TWK_USE_FONT            | TWK_USE_FONT            | Font to be used. If not, browsers default fonts are used |
-| TASK_WEB_TWK_THEME               | TWK_THEME               | Defines the theme to be used (see "Themes")              | 
+| TASK_WEB_TWK_THEME               | TWK_THEME               | Defines the theme to be used (see "Themes")              |
 
 ## Hooks
 
@@ -114,17 +115,13 @@ That should be it! Now you have the server running at `localhost:3000` accessibl
 
 ### Troubleshooting
 
-if you are receiving the following error in step 5
-
+By default the log level is set to `INFO`. If a more detailed log is required, the application can be run with DEBUG or even TRACE messages.
+For debug messages, just set the environment "RUST_LOG" to "DEBUG":
 ```shell
-
-  thread 'main' panicked at build.rs:7:19:
-  called `Result::unwrap()` on an `Err` value: Os { code: 2, kind: NotFound, message: "No such file or directory" }
-  note: run with `RUST_BACKTRACE=1` environment variable to display a backtrace
-
+env RUST_LOG="DEBUG" cargo run
 ```
 
-It's because, `tailwindcss-cli` is missing
+If a fine granular configuration is desired - the application log itself is captured with the name `taskwarrior_web`.
 
 ## Customizing
 
@@ -219,17 +216,63 @@ Keyboard shortcut is `u`
 This will bring up undo confirmation dialog
 ![Undo](./screenshots/undo.png)
 
+## Custom queries
+
+Task organization is a pretty personal thing. And depending on the project or individual base, custom workflows and reportings are required.
+Create a configuration file under Linux in `$HOME/.config/taskwarrior-web/config.toml` or under Windows in `%APPDATA%\taskwarrior-web\config.toml` and add custom queries.
+
+A configuration file can look like:
+
+```toml
+[custom_queries]
+
+[custom_queries.completed_last_week]
+query = "end.after:today-1wk and status:completed"
+description = "completed last 7days"
+
+[custom_queries.due_today]
+query = "due:today"
+description = "to be done today"
+fixed_key = "ni" # this will override randomly generated key
+```
+
+Following options for each query definition is available:
+| property    | mandatory | meaning                                                                |
+| ----------- | --------- | ---------------------------------------------------------------------- |
+| query       |     X     | specifies the query to be executed on `taskwarrior`.                   |
+| description |     X     | description to be shown in the Web-UI for recognizing the right query. |
+| fixed_key   |           | Can be specified as two characters which will hardcode the shortcut.   |
+
+The query can be selected via keyboard shortcuts or via click on the right buttons.
+In order to select custom queries with the keyboard, first type in `q` as key for queries.
+A list is shown with available custom queries:
+![Custom query selections](./screenshots/custom_queries_selection.png)
+
+On each custom query, either a pre-defined shortcut key is shown or an automatic and cached shortcut is shown.
+The right one is typed and automatically the custom query is set:
+
+![Custom query list](./screenshots/custom_queries_list.png)
+
+As soon as one of the other reports like `next`, `pending` or others are selected, the custom query is unset and `taskwarrior-web` standard reports are shown.
+
+Beside of a configuration file, it is possible to configure via environment variables as well:
+```shell
+env TWK_custom_queries__one_query__fixed_key=ni TWK_custom_queries__one_query__query="end.after:today-1wk and status:completed" TWK_custom_queries__one_query__description="completed last 7days" cargo run
+```
+
+The same way it is possible to configure the docker container accordingly.
+
 ## Switch theme
 
 It is possible to switch the theme, which is saved in local storage too.
 
 For this following three symbols are used (left of the command bar):
 
-| Symbol | Purpose                               |
-|--------|---------------------------------------|
-|   ⚹    | Auto Mode or forced mode from server |  
-|   ☽    | Dark mode                            |
-|   🌣    | Light mode                           |
+| Symbol | Purpose                              |
+| ------ | ------------------------------------ |
+| ⚹      | Auto Mode or forced mode from server |
+| ☽      | Dark mode                            |
+| 🌣      | Light mode                           |
 
 # WIP warning
 
@@ -243,11 +286,11 @@ there will be errors, as no checks, and there may not be any error messages in c
   - [x] Hiding empty columns
   - [ ] Temporary highlight last modified row, if visible
 - [x] Make the mnemonics same for tags on refresh
-- [ ] Modification
-  - [ ] Deleting
+- [x] Modification
+  - [x] Deleting
 - [ ] Following Context
 - [ ] Error handling
-  - [ ] Retaining input in case of error
+  - [x] Retaining input in case of error
   - [ ] Finetune error handling
 - [ ] Add more tests
 - [ ] Convert to desktop app using Tauri

README.md

@@ -0,0 +1,8 @@
+[custom_queries]
+
+[custom_queries.one_query]
+description = "report of something"
+
+[custom_queries.two_query]
+description = "report of another thing"
+fixed_key = "n" # this will override randomly generated key

config.sample.toml

@@ -17,4 +17,7 @@ if [[ ! -f "$TASKRC" ]]; then
 fi
 
 cd $HOME/bin
-exec ./taskwarrior-web
+exec ./taskwarrior-web &
+pid=$!
+trap 'kill -SIGTERM $pid; wait $pid' SIGTERM
+wait $pidh

docker/start.sh

@@ -23,7 +23,7 @@ function focusTextInput(event: KeyboardEvent | MouseEvent) {
         event.preventDefault()
         ss.focus();
     } else {
-        document.getElementById('cmd-inp').focus();
+        document.getElementById('cmd-inp')?.focus();
     }
 }
 
@@ -34,11 +34,11 @@ window.handleTaskAnnotations = (event: KeyboardEvent | MouseEvent) => {
     }
     event.preventDefault();
     let annoSelector = document.getElementById('anno-inp');
-    document.querySelector('#anno-inp').classList.toggle('hidden');
+    document.querySelector('#anno-inp')?.classList.toggle('hidden');
     Array.from(document.querySelectorAll('.is-a-annotation')).forEach((value) => {
         value.classList.toggle('hidden');
     });
-    if (annoSelector.checkVisibility()) {
+    if (annoSelector?.checkVisibility()) {
         annoSelector.focus();
     }
     return false;
@@ -59,45 +59,66 @@ window.handleTaskAnnotationTrigger = (event: KeyboardEvent | MouseEvent) => {
 
 hotkeys('esc', function (event, handler) {
     // Prevent the default refresh event under WINDOWS system
-    if(event.target != document.getElementById('tag-inp')) {
+    if(event.target != document.getElementById('tag-inp') &&
+        event.target != document.getElementById('query-inp')) {
         console.log("not processing")
         return
     }
-    event.preventDefault()
-    let tag_selector = document.getElementById('cmd-inp')
-    document.querySelector('#tags_map_drawer').classList.toggle('hidden')
-    if (tag_selector.checkVisibility()) {
+    event.preventDefault();
+    let tag_selector = document.getElementById('cmd-inp');
+    if (event.target == document.getElementById('tag-inp')) {
+        document.querySelector('#tags_map_drawer')?.classList.toggle('hidden');
+    } else if (event.target == document.getElementById('query-inp')) {
+        document.querySelector('#querys_map_drawer')?.classList.toggle('hidden');
+    }
+    if (tag_selector?.checkVisibility()) {
         tag_selector.focus();
     }
     return false;
 });
 
+hotkeys('ctrl+shift+K', function (event, handler) {
+    // Prevent the default refresh event under WINDOWS system
+    event.preventDefault();
+    focusTextInput(event);
+    return false;
+});
+
 hotkeys('t', function (event, handler) {
     // Prevent the default refresh event under WINDOWS system
     if(event.target != document.getElementById('cmd-inp')) {
-        console.log("not processing")
+        console.debug("not processing")
         return
     }
     event.preventDefault()
-    window['toggleTagPanel']();
-
+    window['togglePanel']('tag');
 });
 
-hotkeys('ctrl+shift+K', function (event, handler) {
+hotkeys('q', function (event, handler) {
     // Prevent the default refresh event under WINDOWS system
-    event.preventDefault();
-    focusTextInput(event);
-    return false;
+    if(event.target != document.getElementById('cmd-inp')) {
+        console.debug("not processing")
+        return
+    }
+    event.preventDefault()
+    window['togglePanel']('query');
 });
 
-window['toggleTagPanel'] = () => {
-    let tagSelector = document.getElementById('tag-inp')
-    document.querySelector('#tags_map_drawer').classList.toggle('hidden')
-    if (tagSelector.checkVisibility()) {
+window['togglePanel'] = (panelType: string) => {
+    let tagSelector = document.getElementById(panelType + '-inp')
+    document.querySelector('#' + panelType + 's_map_drawer')?.classList.toggle('hidden')
+    if (tagSelector?.checkVisibility()) {
         tagSelector.focus();
     }
     return false;
-}
+};
+
+window['processPanelShortcut'] = (event: KeyboardEvent, panelType: string) {
+    const shortcut = event.target?.value;
+    if (shortcut.length >= 2) { 
+        document.getElementById(panelType + "s_" + shortcut)?.click() 
+    };
+};
 
 document.addEventListener('click', function (event) {
     let element = document.getElementsByTagName('html')[0];
@@ -154,6 +175,7 @@ document.addEventListener("DOMContentLoaded", function () {
                     .padStart(2, "0");
         }, 1000
     )
+
     let day_progress = setInterval(
         () => {
             const dd = document.getElementById('time_of_the_day');

frontend/src/main.ts

@@ -1,9 +1,12 @@
 <div class="pl-2 pr-2 py-1.5 rounded-sm text-xs flex bg-base-100 gap-2 items-center flex-wrap">
 
     <div class="join" id="tag_search_bar">
-        <button class="btn btn-neutral btn-xs join-item" id="tag-selection-toggle" onclick="window['toggleTagPanel']()">
+        <button class="btn btn-neutral btn-xs join-item" id="tag-selection-toggle" onclick="window['togglePanel']('tag')">
         <span><span class="shortcut_key opacity-50">t</span>ags</span>
         </button>
+        <button class="btn btn-neutral btn-xs join-item" id="query-selection-toggle" onclick="window['togglePanel']('query')">
+        <span><span class="shortcut_key opacity-50">q</span>ueries</span>
+        </button>
         <span class="btn btn-neutral btn-xs join-item" id="task_action_bar">
             <button hx-get="task_action_bar" hx-target="#task_action_bar" hx-swap="outerHTML"
                 hx-trigger="click,keyup[key=='s'] from:#cmd-inp">ta<span class="shortcut_key opacity-50">s</span>k</button>