add/subtract in moment (#2212)

reflex/__init__.py

@@ -253,6 +253,7 @@ _MAPPING = {
     "reflex.components": _ALL_COMPONENTS,
     "reflex.components.component": ["memo"],
     "reflex.components.graphing": ["recharts"],
+    "reflex.components.datadisplay.moment": ["MomentDelta"],
     "reflex.config": ["config", "Config", "DBConfig"],
     "reflex.constants": ["constants", "Env"],
     "reflex.components.el": ["el"],

reflex/__init__.pyi

@@ -442,6 +442,7 @@ from reflex.components import EditorOptions as EditorOptions
 from reflex.components import NoSSRComponent as NoSSRComponent
 from reflex.components.component import memo as memo
 from reflex.components.graphing import recharts as recharts
+from reflex.components.datadisplay.moment import MomentDelta as MomentDelta
 from reflex import config as config
 from reflex.config import Config as Config
 from reflex.config import DBConfig as DBConfig

reflex/components/datadisplay/__init__.py

@@ -9,7 +9,7 @@ from .datatable import DataTable
 from .divider import Divider
 from .keyboard_key import KeyboardKey as Kbd
 from .list import List, ListItem, OrderedList, UnorderedList
-from .moment import Moment
+from .moment import Moment, MomentDelta
 from .stat import Stat, StatArrow, StatGroup, StatHelpText, StatLabel, StatNumber
 from .table import Table, TableCaption, TableContainer, Tbody, Td, Tfoot, Th, Thead, Tr
 from .tag import Tag, TagCloseButton, TagLabel, TagLeftIcon, TagRightIcon

reflex/components/datadisplay/moment.py

@@ -1,12 +1,27 @@
 """Moment component for humanized date rendering."""
 
-from typing import Any, Dict, List
+from typing import Any, Dict, List, Optional
 
+from reflex.base import Base
 from reflex.components.component import Component, NoSSRComponent
 from reflex.utils import imports
 from reflex.vars import Var
 
 
+class MomentDelta(Base):
+    """A delta used for add/subtract prop in Moment."""
+
+    years: Optional[int]
+    quarters: Optional[int]
+    months: Optional[int]
+    weeks: Optional[int]
+    days: Optional[int]
+    hours: Optional[int]
+    minutess: Optional[int]
+    seconds: Optional[int]
+    milliseconds: Optional[int]
+
+
 class Moment(NoSSRComponent):
     """The Moment component."""
 
@@ -27,9 +42,11 @@ class Moment(NoSSRComponent):
     #  Use the parse attribute to tell moment how to parse the given date when non-standard.
     parse: Var[str]
 
-    # NOT IMPLEMENTED :
-    # add
-    # substract
+    # Add a delta to the base date (keys are "years", "quarters", "months", "weeks", "days", "hours", "minutes", "seconds")
+    add: Var[MomentDelta]
+
+    # Subtract a delta to the base date (keys are "years", "quarters", "months", "weeks", "days", "hours", "minutes", "seconds")
+    subtract: Var[MomentDelta]
 
     # Displays the date as the time from now, e.g. "5 minutes ago".
     from_now: Var[bool]

reflex/components/datadisplay/moment.pyi

@@ -7,11 +7,23 @@ from typing import Any, Dict, Literal, Optional, Union, overload
 from reflex.vars import Var, BaseVar, ComputedVar
 from reflex.event import EventChain, EventHandler, EventSpec
 from reflex.style import Style
-from typing import Any, Dict, List
+from typing import Any, Dict, List, Optional
+from reflex.base import Base
 from reflex.components.component import Component, NoSSRComponent
 from reflex.utils import imports
 from reflex.vars import Var
 
+class MomentDelta(Base):
+    years: Optional[int]
+    quarters: Optional[int]
+    months: Optional[int]
+    weeks: Optional[int]
+    days: Optional[int]
+    hours: Optional[int]
+    minutess: Optional[int]
+    seconds: Optional[int]
+    milliseconds: Optional[int]
+
 class Moment(NoSSRComponent):
     def get_event_triggers(self) -> Dict[str, Any]: ...
     @overload
@@ -23,6 +35,8 @@ class Moment(NoSSRComponent):
         format: Optional[Union[Var[str], str]] = None,
         trim: Optional[Union[Var[bool], bool]] = None,
         parse: Optional[Union[Var[str], str]] = None,
+        add: Optional[Union[Var[MomentDelta], MomentDelta]] = None,
+        subtract: Optional[Union[Var[MomentDelta], MomentDelta]] = None,
         from_now: Optional[Union[Var[bool], bool]] = None,
         from_now_during: Optional[Union[Var[int], int]] = None,
         to_now: Optional[Union[Var[bool], bool]] = None,
@@ -101,7 +115,9 @@ class Moment(NoSSRComponent):
             format: Formats the date according to the given format string.
             trim: When formatting duration time, the largest-magnitude tokens are automatically trimmed when they have no value.
             parse:  Use the parse attribute to tell moment how to parse the given date when non-standard.
-            from_now: NOT IMPLEMENTED :  add  substract  Displays the date as the time from now, e.g. "5 minutes ago".
+            add: Add a delta to the base date (keys are "years", "quarters", "months", "weeks", "days", "hours", "minutes", "seconds")
+            subtract: Subtract a delta to the base date (keys are "years", "quarters", "months", "weeks", "days", "hours", "minutes", "seconds")
+            from_now: Displays the date as the time from now, e.g. "5 minutes ago".
             from_now_during: Setting fromNowDuring will display the relative time as with fromNow but just during its value in milliseconds, after that format will be used instead.
             to_now: Similar to fromNow, but gives the opposite interval.
             with_title: Adds a title attribute to the element with the complete date.