client/src/components/ReadOnlySession.js
author ymh <ymh.work@gmail.com>
Tue, 06 Nov 2018 16:19:26 +0100
changeset 170 7da1d5137b0b
parent 162 1fd73fdaf4c6
permissions -rw-r--r--
Upgrade dependencies and correct theme colors
Ignore whitespace changes - Everywhere: Within whitespace: At end of lines:
162
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
     1
import React, { Component } from 'react';
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
     2
import { connect } from 'react-redux';
170
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
     3
import { formatTimestamp } from '../utils';
162
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
     4
import Navbar from './Navbar';
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
     5
import { getSession, getSessionNotes } from '../selectors/coreSelectors';
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
     6
170
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
     7
const ReadOnlyNote = ({ note }) => {
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
     8
  return (
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
     9
    <div id={"note-" + note._id} className="note text-sm mr-5 pt-1">
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    10
      <div className="mr-5">
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    11
        <small className="start text-irinotes-time pt-2">{ formatTimestamp(note.startedAt) }</small>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    12
        <small className="finish text-irinotes-time pb-2">{ formatTimestamp(note.finishedAt) }</small>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    13
      </div>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    14
      <div className="note-content w-100 pl-2 pt-2" dangerouslySetInnerHTML={{ __html: note.html }} />
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    15
    </div>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    16
  );
162
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    17
170
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    18
}
162
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    19
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    20
class ReadOnlySession extends Component {
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    21
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    22
  onClickSession = (e) => {
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    23
    e.preventDefault();
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    24
    this.props.history.push('/sessions/' +  this.props.match.params.id)
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    25
  }
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    26
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    27
  render() {
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    28
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    29
    return (
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    30
          <div>
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    31
            <Navbar history={this.props.history} />
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    32
            <div className="ml-4">
170
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    33
              <div className="session-page-panel panel-default sticky-top">
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    34
                <div className="session-page-card card-body bg-secondary pr-5">
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    35
                  <div className='session-page-title border-0 bg-irinotes-headers text-muted ml-3'>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    36
                    { this.props.currentSession.title || '&nbsp;' }
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    37
                  </div>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    38
                  <div className="session-page-description border-0 bg-irinotes-headers text-muted ml-3" >
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    39
                    { this.props.currentSession.description || '&nbsp;' }
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    40
                  </div>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    41
                </div>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    42
              </div>
162
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    43
              <div>
170
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    44
                {
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    45
                  this.props.notes.map((note) =>
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    46
                    <ReadOnlyNote note={ note } key={ note._id} />
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    47
                  )
7da1d5137b0b Upgrade dependencies and correct theme colors
ymh <ymh.work@gmail.com>
parents: 162
diff changeset
    48
                }
162
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    49
              </div>
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    50
            </div>
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    51
          </div>
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    52
    );
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    53
  }
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    54
};
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    55
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    56
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    57
function mapStateToProps(state, props) {
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    58
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    59
  const sessionId = props.match.params.id;
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    60
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    61
  const currentSession = getSession(sessionId, state);
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    62
  const currentNotes = getSessionNotes(sessionId, state);
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    63
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    64
  return {
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    65
    currentSession,
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    66
    notes: currentNotes,
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    67
  };
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    68
}
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    69
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    70
export default connect(mapStateToProps)(ReadOnlySession);
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    71
1fd73fdaf4c6 Add ReadOnlySession component and message when session list is empty
salimr <riwad.salim@yahoo.fr>
parents:
diff changeset
    72