Remove timestamp props (#1082)

Author: tcbegley

src/components/badge/Badge.js

@@ -20,16 +20,12 @@ const Badge = props => {
     text_color,
     color = 'secondary',
     n_clicks = 0,
-    n_clicks_timestamp = -1,
     ...otherProps
   } = props;
 
   const incrementClicks = () => {
     if (setProps) {
-      setProps({
-        n_clicks: n_clicks + 1,
-        n_clicks_timestamp: Date.now()
-      });
+      setProps({n_clicks: n_clicks + 1});
     }
   };
   const isBootstrapColor = bootstrapColors.has(color);
@@ -156,13 +152,6 @@ Badge.propTypes = {
    */
   n_clicks: PropTypes.number,
 
-  /**
-   * An integer that represents the time (in ms since 1970)
-   * at which n_clicks changed. This can be used to tell
-   * which button was changed most recently.
-   */
-  n_clicks_timestamp: PropTypes.number,
-
   /**
    * Target attribute to pass on to the link. Only applies to external links.
    */

src/components/button/Button.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import {omit} from 'ramda';
 import RBButton from 'react-bootstrap/Button';
 import Link from '../../private/Link';
 
@@ -34,10 +33,7 @@ const Button = ({
 }) => {
   const incrementClicks = () => {
     if (!disabled && setProps) {
-      setProps({
-        n_clicks: n_clicks + 1,
-        n_clicks_timestamp: Date.now()
-      });
+      setProps({n_clicks: n_clicks + 1});
     }
   };
   const useLink = href && !disabled;
@@ -61,7 +57,7 @@ const Button = ({
       value={useLink ? undefined : value}
       className={class_name || className}
       rel={useLink ? rel : undefined}
-      {...omit(['n_clicks_timestamp'], otherProps)}
+      {...otherProps}
       data-dash-is-loading={
         (loading_state && loading_state.is_loading) || undefined
       }
@@ -129,16 +125,6 @@ Button.propTypes = {
    */
   n_clicks: PropTypes.number,
 
-  /**
-   * Use of *_timestamp props has been deprecated in Dash in favour of dash.callback_context.
-   * See "How do I determine which Input has changed?" in the Dash FAQs https://dash.plot.ly/faqs.
-   *
-   * An integer that represents the time (in ms since 1970)
-   * at which n_clicks changed. This can be used to tell
-   * which button was changed most recently.
-   */
-  n_clicks_timestamp: PropTypes.number,
-
   /**
    * Whether button is in active state. Default: False.
    */

src/components/card/CardLink.js

@@ -19,10 +19,7 @@ const CardLink = ({
 }) => {
   const incrementClicks = () => {
     if (!disabled && setProps) {
-      setProps({
-        n_clicks: n_clicks + 1,
-        n_clicks_timestamp: Date.now()
-      });
+      setProps({n_clicks: n_clicks + 1});
     }
   };
 
@@ -100,13 +97,6 @@ CardLink.propTypes = {
    */
   n_clicks: PropTypes.number,
 
-  /**
-   * An integer that represents the time (in ms since 1970)
-   * at which n_clicks changed. This can be used to tell
-   * which button was changed most recently.
-   */
-  n_clicks_timestamp: PropTypes.number,
-
   /**
    * Object that holds the loading state object coming from dash-renderer
    */

src/components/dropdownmenu/DropdownMenuItem.js

@@ -21,18 +21,14 @@ const DropdownMenuItem = ({
   header,
   divider,
   n_clicks = 0,
-  n_clicks_timestamp = -1,
   toggle = true,
   ...otherProps
 }) => {
   const context = useContext(DropdownMenuContext);
 
   const handleClick = e => {
     if (!disabled && setProps) {
-      setProps({
-        n_clicks: n_clicks + 1,
-        n_clicks_timestamp: Date.now()
-      });
+      setProps({n_clicks: n_clicks + 1});
     }
     if (toggle && context.isOpen) {
       context.toggle(e);
@@ -150,13 +146,6 @@ DropdownMenuItem.propTypes = {
    */
   n_clicks: PropTypes.number,
 
-  /**
-   * An integer that represents the time (in ms since 1970)
-   * at which n_clicks changed. This can be used to tell
-   * which button was changed most recently.
-   */
-  n_clicks_timestamp: PropTypes.number,
-
   /**
    * Object that holds the loading state object coming from dash-renderer
    */

src/components/form/Form.js

@@ -1,6 +1,5 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import {omit} from 'ramda';
 import RBForm from 'react-bootstrap/Form';
 
 /**
@@ -15,7 +14,6 @@ const Form = ({
   class_name,
   prevent_default_on_submit = true,
   n_submit = 0,
-  n_submit_timestamp = -1,
   ...otherProps
 }) => {
   return (
@@ -25,10 +23,7 @@ const Form = ({
           e.preventDefault();
         }
         if (setProps) {
-          setProps({
-            n_submit: n_submit + 1,
-            n_submit_timestamp: Date.now()
-          });
+          setProps({n_submit: n_submit + 1});
         }
       }}
       className={class_name || className}
@@ -95,11 +90,6 @@ Form.propTypes = {
    */
   n_submit: PropTypes.number,
 
-  /**
-   * Last time that `Enter` was pressed.
-   */
-  n_submit_timestamp: PropTypes.number,
-
   /**
    * The form calls preventDefault on submit events. If you want form data to
    * be posted to the endpoint specified by `action` on submit events, set

src/components/input/Input.js

@@ -116,10 +116,7 @@ const Input = ({
 
   const onBlur = () => {
     if (setProps) {
-      const payload = {
-        n_blur: n_blur + 1,
-        n_blur_timestamp: Date.now()
-      };
+      const payload = {n_blur: n_blur + 1};
       if (debounce === true) {
         // numeric debounce here has no effect, we only care about boolean debounce
         onEvent(payload);
@@ -131,10 +128,7 @@ const Input = ({
 
   const onKeyUp = e => {
     if (setProps && e.key === 'Enter') {
-      const payload = {
-        n_submit: n_submit + 1,
-        n_submit_timestamp: Date.now()
-      };
+      const payload = {n_submit: n_submit + 1};
       if (debounce === true) {
         // numeric debounce here has no effect, we only care about boolean debounce
         onEvent(payload);
@@ -153,13 +147,7 @@ const Input = ({
       onBlur={onBlur}
       onKeyUp={onKeyUp}
       {...omit(
-        [
-          'n_blur_timestamp',
-          'n_submit_timestamp',
-          'persistence',
-          'persistence_type',
-          'persisted_props'
-        ],
+        ['persistence', 'persistence_type', 'persisted_props'],
         otherProps
       )}
       valid={valid ? 'true' : undefined}
@@ -585,21 +573,11 @@ Input.propTypes = {
    */
   n_submit: PropTypes.number,
 
-  /**
-   * Last time that `Enter` was pressed.
-   */
-  n_submit_timestamp: PropTypes.number,
-
   /**
    * Number of times the input lost focus.
    */
   n_blur: PropTypes.number,
 
-  /**
-   * Last time the input lost focus.
-   */
-  n_blur_timestamp: PropTypes.number,
-
   /**
    * If true, changes to input will be sent back to the Dash server
    * only when the enter key is pressed or when the component loses

src/components/input/Textarea.js

@@ -34,11 +34,8 @@ const Textarea = ({
   tabIndex,
   tabindex,
   n_blur = 0,
-  n_blur_timestamp = -1,
   n_submit = 0,
-  n_submit_timestamp = -1,
   n_clicks = 0,
-  n_clicks_timestamp = -1,
   debounce = false,
   value = '',
   submit_on_enter = true,
@@ -71,10 +68,7 @@ const Textarea = ({
 
   const onBlur = e => {
     if (setProps) {
-      const payload = {
-        n_blur: n_blur + 1,
-        n_blur_timestamp: Date.now()
-      };
+      const payload = {n_blur: n_blur + 1};
       if (debounce === true) {
         payload.value = e.target.value;
       }
@@ -85,10 +79,7 @@ const Textarea = ({
   const onKeyUp = e => {
     if (submit_on_enter && setProps && e.key === 'Enter' && !e.shiftKey) {
       e.preventDefault(); // don't create newline if submitting
-      const payload = {
-        n_submit: n_submit + 1,
-        n_submit_timestamp: Date.now()
-      };
+      const payload = {n_submit: n_submit + 1};
       if (debounce === true) {
         payload.value = e.target.value;
       }
@@ -98,10 +89,7 @@ const Textarea = ({
 
   const onClick = () => {
     if (setProps) {
-      setProps({
-        n_clicks: n_clicks + 1,
-        n_clicks_timestamp: Date.now()
-      });
+      setProps({n_clicks: n_clicks + 1});
     }
   };
 
@@ -131,13 +119,7 @@ const Textarea = ({
       spellCheck={spellcheck || spellCheck}
       tabIndex={tabindex || tabIndex}
       {...omit(
-        [
-          'n_blur_timestamp',
-          'n_submit_timestamp',
-          'persistence',
-          'persistence_type',
-          'persisted_props'
-        ],
+        ['persistence', 'persistence_type', 'persisted_props'],
         otherProps
       )}
       data-dash-is-loading={
@@ -410,10 +392,6 @@ Textarea.propTypes = {
    * Number of times the input lost focus.
    */
   n_blur: PropTypes.number,
-  /**
-   * Last time the input lost focus.
-   */
-  n_blur_timestamp: PropTypes.number,
 
   /**
    * Number of times the `Enter` key was pressed while the textarea had focus. Only
@@ -422,13 +400,8 @@ Textarea.propTypes = {
   n_submit: PropTypes.number,
 
   /**
-   * Last time that `Enter` was pressed. Only updates if submit_on_enter is True.
-   */
-  n_submit_timestamp: PropTypes.number,
-
-  /**
-   * Whether or not the form should increment the n_submit and n_submit_timestamp props
-   * when enter key is pressed. If True, use shift + enter to create a newline. Default: True
+   * Whether or not the form should increment the n_submit prop when enter key is
+   * pressed. If True, use shift + enter to create a newline. Default: True
    */
   submit_on_enter: PropTypes.bool,
 
@@ -438,13 +411,6 @@ Textarea.propTypes = {
    */
   n_clicks: PropTypes.number,
 
-  /**
-   * An integer that represents the time (in ms since 1970)
-   * at which n_clicks changed. This can be used to tell
-   * which button was changed most recently.
-   */
-  n_clicks_timestamp: PropTypes.number,
-
   /**
    * If true, changes to input will be sent back to the Dash server only on enter or
    * when losing focus. If it's false, it will sent the value back on every change.