feat: Datetime should show now button

Author: zombieJ

src/PickerPanel.tsx

@@ -24,7 +24,7 @@ import PanelContext from './PanelContext';
 import { DateRender } from './panels/DatePanel/DateBody';
 import { PickerModeMap } from './utils/uiUtil';
 import { MonthCellRender } from './panels/MonthPanel/MonthBody';
-import RangeContext from './RangeContext';
+import RangeContext, { FooterSelection } from './RangeContext';
 
 export interface PickerPanelSharedProps<DateType> {
   prefixCls?: string;
@@ -372,10 +372,25 @@ function PickerPanel<DateType>(props: PickerPanelProps<DateType>) {
   }
 
   let extraSelectionNode: React.ReactNode;
-  if (extraFooterSelections && extraFooterSelections.length) {
+  if ((extraFooterSelections && extraFooterSelections.length) || showTime) {
+    let mergedSelections: FooterSelection[] = [];
+
+    if (showTime) {
+      mergedSelections.push({
+        label: locale.now,
+        onClick: () => {
+          triggerSelect(generateConfig.getNow());
+        },
+      });
+    }
+
+    if (extraFooterSelections) {
+      mergedSelections = [...mergedSelections, ...extraFooterSelections];
+    }
+
     extraSelectionNode = (
       <ul className={`${prefixCls}-ranges`}>
-        {extraFooterSelections.map(({ label, onClick }) => (
+        {mergedSelections.map(({ label, onClick }) => (
           <li key={label} onClick={onClick}>
             {label}
           </li>

src/RangeContext.tsx

@@ -1,11 +1,13 @@
 import * as React from 'react';
 import { NullableDateType } from './interface';
 
+export interface FooterSelection {
+  label: string;
+  onClick: React.MouseEventHandler<HTMLElement>;
+}
+
 interface RangeContextProps {
-  extraFooterSelections?: {
-    label: string;
-    onClick: React.MouseEventHandler<HTMLElement>;
-  }[];
+  extraFooterSelections?: FooterSelection[];
   /**
    * Set displayed range value style.
    * Panel only has one value, this is only style effect.

tests/picker.spec.tsx

@@ -485,4 +485,15 @@ describe('Basic', () => {
 
     expect(wrapper.find('.rc-picker-input').render()).toMatchSnapshot();
   });
+
+  it('datetime should display now', () => {
+    const onSelect = jest.fn();
+    const wrapper = mount(<MomentPicker onSelect={onSelect} showTime />);
+    wrapper.openPicker();
+    wrapper.find('.rc-picker-ranges > li').simulate('click');
+
+    expect(
+      isSame(onSelect.mock.calls[0][0], '1990-09-03 00:00:00', 'second'),
+    ).toBeTruthy();
+  });
 });