Add Tabulator app

[hoxbro]

TODOS:

• Investigate why I can't delete rows after changing it.
• Remove flickering, when updating annotation?

Delete rows from the tabulator

screenrecord-2024-05-13_19.13.06.mp4

Edit values from tabulator + sync of selection

screenrecord-2024-05-13_19.15.02.mp4

Code

from holonote.annotate import Annotator, SQLiteDB
import hvplot.pandas
import pandas as pd

speed_data = pd.read_parquet("../assets/example.parquet")
curve = speed_data.hvplot("TIME", "SPEED")
annotator = Annotator(
    curve,
    fields=["category"],
    connector=SQLiteDB(table_name="styling"),
)

start_time = pd.date_range("2022-06-04", "2022-06-22", periods=5)
end_time = start_time + pd.Timedelta(days=2)
data = {
    "start_time": start_time,
    "end_time": end_time,
    "category": ["A", "B", "A", "C", "B"],
}
annotator.define_annotations(pd.DataFrame(data), TIME=("start_time", "end_time"))

from holonote.app.tabulator import AnnotatorTabulator

AnnotatorTabulator(annotator)
annotator * curve

[codspeed-hq]

CodSpeed Performance Report

Merging #106 will not alter performance

_{Comparing tabulator (b72559b) with main (36f5602)}

Summary

✅ 6 untouched benchmarks

[droumis]

Looking great so far!

Requested features:

• adding a new annotation to the table syncs with table
• ms resolution (hh:mm:ss.000) datetime editing for datetime types
• change history logging with undo and redo buttons (although this would require tabulator history module)
• Add a reset button column to reset per row/annotation to original (uncommitted) state.
• Either a global or per row commit/save button
• On 'delete' button click, format text with strike-through and mark for deletion when a commit/save button is clicked, allowing for row-wise undo of deletion-marking

[hoxbro]

adding a new annotation to the table syncs with table

This does work, but you need actually to add the annotation. This will likely be more intuitive if combined with pop ups.

screenrecord-2024-06-10_10.00.21.mp4

ms resolution (hh:mm:ss.000) datetime editing for datetime types

Are you using Firefox? See the Compatibility Warning here, for why it currently does not work in Firefox. In Chrome it does work:

Add a reset button column to reset per row/annotation to original (uncommitted) state.

I don't think that is currently supported in HoloNote. It is all or nothing. We save a snapshot of the full dataframe and use it this way. I will look into how easy it will be to implement this per annotation.

Either a global or per row commit/save button

Same as above with respect to per row. The global save button can be easily added, though I'm unsure if it should be added to the app or part of an example.

On 'delete' button click, format text with strike-through and mark for deletion when a commit/save button is clicked, allowing for row-wise undo of deletion-marking

Maybe this could work. However, I would like it to be a simple implementation, as I don't want another "DataFrame" to keep in sync with the global state.

[droumis]

This does work, but you need actually to add the annotation. This will likely be more intuitive if combined with pop ups.

Sure, a pop-up that allows the user to select a category is a solution.

Are you using Firefox? See the Compatibility Warning here, for why it currently does not work in Firefox. In Chrome it does work:

I'm using chrome Version 124.0.6367.208

[droumis]

can the save and reset buttons from panel widget box be synced with tabulator app?

[droumis]

new annotation for a new category doesn't persist display on plot when using tabulator app and groupby styling. Probably the visibility needs to be updated.

Code

import hvplot.pandas
import pandas as pd
from holonote.annotate import Annotator, SQLiteDB
from holonote.app import PanelWidgets
import panel as pn
from holonote.app.tabulator import AnnotatorTabulator

# Setup
speed_data = pd.read_parquet("/Users/droumis/src/holonote/examples/assets/example.parquet")
curve = speed_data.hvplot("TIME", "SPEED")

annotator = Annotator(
    curve,
    fields=["category"],
    connector=SQLiteDB(table_name="styling"),
)

start_time = pd.date_range("2022-06-04", "2022-06-22", periods=5)
end_time = start_time + pd.Timedelta(days=2)
data = {
    "start_time": start_time,
    "end_time": end_time,
    "category": ["A", "B", "A", "C", "B"],
}
annotator.define_annotations(pd.DataFrame(data), TIME=("start_time", "end_time"))

annotator.groupby = "category"
annotator_widgets = pn.Column(PanelWidgets(annotator), AnnotatorTabulator(annotator))
pn.Row(annotator_widgets, annotator * curve)

Screen.Recording.2024-06-12.at.10.51.31.AM.mov

[codecov]

Codecov Report

Attention: Patch coverage is 72.27723% with 28 lines in your changes missing coverage. Please review.

Project coverage is 86.33%. Comparing base (0301194) to head (b72559b).
Report is 6 commits behind head on main.

Files	Patch %	Lines
holonote/app/tabulator.py	60.00%	28 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main     #106      +/-   ##
==========================================
+ Coverage   86.16%   86.33%   +0.17%     
==========================================
  Files          24       26       +2     
  Lines        2595     2774     +179     
==========================================
+ Hits         2236     2395     +159     
- Misses        359      379      +20     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[hoxbro]

I will merge this so we can get it into the next release. We can improve the functionality in other PRs.