GitLab will be upgraded on June 23rd evening. During the upgrade the service will be unavailable, sorry for the inconvenience.

Commit 32c21fc4 authored by Marjolaine Bodin's avatar Marjolaine Bodin

#497 first version automatic collapse

parent 5d13b403
Pipeline #46590 passed with stage
in 3 minutes
......@@ -41,12 +41,11 @@ export function unsetCategoryTypes(categoryType) {
};
}
/**
* Set the automatic collapsing events
* @param {*} automaticCollapsing automaticCollapsing value
*/
export function setAutomaticCollapsing(automaticCollapsing) {
export function setAutomaticCollapsing(automaticCollapsing) {
return {
type: SET_AUTOMATIC_COLLAPSING,
automaticCollapsing,
......
......@@ -42,7 +42,7 @@ function collapse(items) {
}
/** Returns the list of items to be displayed in the table: events + days */
function getItems(events) {
function getItems(events, automaticCollapsing) {
const eventsCopy = cloneDeep(events);
const items = [];
let lastDate = null; // format DDMMYYYY
......@@ -69,7 +69,7 @@ function getItems(events) {
if (items.length > 0) {
items[items.length - 1].shadowBottomBorder = true;
}
return collapse(items);
return automaticCollapsing ? collapse(items) : items;
}
/**
......@@ -90,7 +90,7 @@ function EventList(props) {
<>
<Table responsive style={{ border: 0 }}>
<tbody>
{getItems(events).map((event, index) => {
{getItems(events, props.automaticCollapsing).map((event, index) => {
if (event.type === 'date') {
return (
<tr
......
......@@ -43,6 +43,7 @@ function EventListMenu(props) {
searchEvents,
onSortingButtonClicked,
categoryTypes,
automaticCollapsing,
} = props;
/**
......@@ -277,6 +278,7 @@ function EventListMenu(props) {
{isSettingsDisplayed && (
<SettingLogbookMenuPanel
categoryTypes={categoryTypes}
automaticCollapsing={automaticCollapsing}
></SettingLogbookMenuPanel>
)}
</Navbar>
......
......@@ -11,7 +11,11 @@ import {
} from '../../../constants/eventTypes';
import { useDispatch } from 'react-redux';
import styles from './SettingLogbookMenuPanel.module.css';
import { setCategoryTypes, unsetCategoryTypes } from '../../../actions/logbook';
import {
setAutomaticCollapsing,
setCategoryTypes,
unsetCategoryTypes,
} from '../../../actions/logbook';
const checkBoxes = [
{
......@@ -51,6 +55,8 @@ export default function SettingLogbookMenuPanel(props) {
const getValueByName = (name) =>
checkBoxes.find((cb) => cb.name === name).value;
const automaticCollapsing = props.automaticCollapsing;
/** Checkbox will be checked if and only if its values are in the categoryTypes */
const isChecked = (values) => {
let found = true;
......@@ -106,6 +112,20 @@ export default function SettingLogbookMenuPanel(props) {
</Row>
</Grid>
</Col>
<Row>
<Col>
<Checkbox
checked={automaticCollapsing}
className={styles.returnCheckbox}
name="isAutomaticCollapsing"
onChange={(e) => {
dispatch(setAutomaticCollapsing(e.target.checked));
}}
>
Automatic collapsing of grouped logs
</Checkbox>
</Col>
</Row>
</Grid>
</Panel.Body>
</Panel>
......
.returnCheckbox {
margin-bottom: 10px !important;
margin-bottom: 12px !important;
}
......@@ -13,6 +13,9 @@ import { useScrollToHash, useQuery } from '../helpers/hooks';
function EventsPage() {
const { investigationId } = useParams();
const categoryTypes = useSelector((state) => state.logbook.categoryTypes);
const automaticCollapsing = useSelector(
(state) => state.logbook.automaticCollapsing
);
const investigation = useResource(InvestigationResource.detailShape(), {
id: investigationId,
});
......@@ -56,6 +59,7 @@ function EventsPage() {
categoryTypes={categoryTypes}
investigation={investigation}
page={page}
automaticCollapsing={automaticCollapsing}
/>
</Col>
</Row>
......
......@@ -88,7 +88,12 @@ export class LogbookContainerClass extends React.Component {
}
render() {
const { investigation, user, logbookContext } = this.props;
const {
investigation,
user,
logbookContext,
automaticCollapsing,
} = this.props;
const {
autorefresh,
searchCriteria,
......@@ -167,6 +172,7 @@ export class LogbookContainerClass extends React.Component {
)}
sessionId={user.sessionId}
setNewEventVisibility={this.setNewEventVisibility}
automaticCollapsing={automaticCollapsing}
/>
</PeriodicRefresher>
......@@ -238,6 +244,7 @@ export class LogbookContainerClass extends React.Component {
events={events}
logbookContext={logbookContext}
onEventClicked={this.onEventClicked}
automaticCollapsing={automaticCollapsing}
/>
<LogbookPager
......
......@@ -22,7 +22,7 @@ const initialState = {
{ type: NOTIFICATION, category: EVENT_CATEGORY_COMMENT },
{ type: NOTIFICATION, category: EVENT_CATEGORY_ERROR },
],
automaticCollapsing : true
automaticCollapsing: true,
};
/**
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment