vast

we geraken niet aan de state

ui/src/components/TimePicker/TimePicker.jsx

@@ -5,12 +5,22 @@ import { t } from 'i18next';
 
 class TimePicker extends React.PureComponent {
   maxDate = new Date( new Date())
+  constructor(props){
+    super(props)
+    this.state = {
+      date: new Date()
+    }
+  }
+  handleChange = (date) => {
+    this.setState({ date }); 
+  };
   render() {
     return <DateTimePickerComponent placeholder ={t('timepicker.placeholder')} 
     id="datetimepicker" 
-    strictMode={true} 
+    strictMode="true" 
     max={this.maxDate} 
-    onChange={(date) =>console.log(date)}
+    onChange={this.handleChange} 
+    value={this.state.date}
     />;
   }
 }

ui/src/components/TimePicker/TimePicker.scss

@@ -1,5 +1,5 @@
 /* To specify background color and font size */
 .e-datetime-wrapper .e-input-group-icon.e-date-icon, .e-datetime-wrapper .e-input-group-icon.e-time-icon {
     font-size: 16px;
-    background-color: rgb(202, 17, 17);
+    background-color: transparent;
 }

ui/src/pages/Media/Media.jsx

@@ -51,7 +51,7 @@ class Media extends React.Component {
       currentRecording: '',
     });
   }
-
+  
   trackScrolling = () => {
     const { events, dispatchGetEvents } = this.props;
     const { isScrolling } = this.state;
@@ -80,7 +80,9 @@ class Media extends React.Component {
   isBottom(el) {
     return el.getBoundingClientRect().bottom + 50 <= window.innerHeight;
   }
-
+  handleChange(){
+
+  }
   openModal(file) {
     this.setState({
       open: true,
@@ -108,7 +110,9 @@ class Media extends React.Component {
         </Breadcrumb>
         <ControlBar type="row">
           <Tabs>
-            <TimePicker />
+            <TimePicker>
+              onClick ={()=>console.log(this.state.date)};
+            </TimePicker>
             <Tab
               label={t('settings.submenu.all')}
               value="all"