1606880485 216

assets/js/NotificationPage.jsx

@@ -11,25 +11,78 @@ export default class NotificationPage extends React.Component {
 
   constructor(props) {
     super(props);
+    this.state = {
+  
+    list : [
+      {
+        title: "Your Application Has Been Rejected",
+        text: "Tutuplapak has rejected your applications",
+        timestamp: "2019-10-10T13:00:00",
+
+      },
+      {
+        title: "Your Application Has Been Accepted",
+        text: "Tutuplapak has rejected your applications",
+        timestamp: "2019-12-10T13:00:00",
+
+      },
+      {
+        title: "Your Application Has Been Responded",
+        text: "Tutuplapak has rejected your applications",
+        timestamp: "2019-11-10T13:00:00",
+
+      },
+    ]
+
 
-    console.log('Notifikasi');
-    Storage.set('menu-active-state', 'Notifikasi');
   }
+  console.log('Notifikasi');
+  Storage.set('menu-active-state', 'Notifikasi');
+}
+
+// componentDidUpdate(prevprops,prevstate){
+//   this.updateList();
+// }
+
+//  updateList = () => {
+   
+//  }
+
+ onClickDismiss = (index) => {
+  var array = [...this.state.list];
+  array.splice(index, 1);
+   console.log("eh kepencet")
+   console.log(index)
+   this.setState({
+    list : array
+
+   })
+ }
+
+ 
 
   render() {
+    var id=-1
     return (
       <div className="notificationPage">
         <Segment className="notifikasi">
-          <Notification
-            title="Your Application Has Been Rejected"
-            text="Tutuplapak has rejected your applications"
-            timestamp="2019-10-10T13:00:00"
-          />
-          <Notification
-            title="Lorem Ipsum"
-            text="Dolor Sit Amet"
-            timestamp="1970-01-01T06:00:00"
+          {
+            this.state.list.map(item=>{
+              id=id+1
+              console.log(id)
+            return (
+            <Notification
+            id={id}
+            title={item.title}
+            text={item.text}
+            timestamp={item.timestamp}
+            dismiss = {this.onClickDismiss}
+          
           />
+            )}
+            
+          )}
+          
         </Segment>
       </div>
     );

assets/js/__test__/NotificationPage-test.jsx

@@ -62,4 +62,15 @@ describe('NotificationPage', () => {
     );
     expect(topmenu.state.activeItem).to.equal('Notifikasi');
   });
+
+  it('test click dismiss notif',()=>{
+    const notifpage = ReactTestUtils.renderIntoDocument(
+      <NotificationPage
+        user={{ data: studentSession }}
+      />,
+    );
+
+    notifpage.onClickDismiss(0);
+    expect(notifpage.state.list.length).to.equal(2);
+  });
 });

assets/js/__test__/components/TopMenu-test.jsx

@@ -252,6 +252,24 @@ describe('TopMenu', () => {
     expect(topmenu.state.isOpen).to.equal(false);
   });
 
+    it('check popup is open', () => {
+    const topmenu = ReactTestUtils.renderIntoDocument(
+      <TopMenu user={adminUser2}>
+        <div> test </div>
+      </TopMenu>);
+      topmenu.handleOpen();
+      expect(topmenu.state.isOpen).to.equal(true);
+    });
+
+    it('check popup is close', () => {
+    const topmenu = ReactTestUtils.renderIntoDocument(
+      <TopMenu user={adminUser2}>
+        <div> test </div>
+      </TopMenu>);
+      topmenu.handleClose();
+      expect(topmenu.state.isOpen).to.equal(false);
+    });
+
   it('TopMenu state contain right current date time', () => {
     moment.locale('id');
     const date = new Date();

assets/js/components/Notification.jsx

@@ -51,7 +51,9 @@ export default class Notification extends React.Component {
               <p>{this.props.text}</p>
             </Grid.Column>
             <Grid.Column floated="right" width={2}>
-              <Button primary>Dismiss</Button>
+              <Button onClick={(e)=>
+                this.props.dismiss(this.props.id)
+                }primary>Dismiss</Button>
               <p>{this.getElapsedTime(new Date())}</p>
             </Grid.Column>
           </Grid.Row>