Skip to content

Commit

Permalink
[frontend] Add page titles to Settings pages
Browse files Browse the repository at this point in the history
Revert WIP conversion of Sectors

test commit

Fix paginationOptions issue for Groups, KillChainPhases, Roles

Fix MarkingDefinitions, update KillChainPhases to reflect master

Remove changes established in PR #7753

Add Malwares.tsx to removed changes

Post-rebase cleanup

Remove changes from PR 7753

Remove outdated changes to KillChainPhases

Fix translations

Align GroupLine design with master

Fix typing on GroupLines;

Remove variant from breadcrumbs
  • Loading branch information
Bonsai8863 authored and VerboseCat committed Sep 26, 2024
1 parent d507f71 commit 79df089
Show file tree
Hide file tree
Showing 15 changed files with 553 additions and 595 deletions.
4 changes: 4 additions & 0 deletions opencti-platform/opencti-front/lang/front/de.json
Original file line number Diff line number Diff line change
Expand Up @@ -2326,6 +2326,10 @@
"Sectors": "Sektoren",
"Sectors and organizations": "Sektoren und Organisationen",
"Security": "Sicherheit",
"Security: Groups | Settings": "Sicherheit: Gruppen | Einstellungen",
"Security: Marking Definitions | Settings": "Sicherheit: Markierungsdefinitionen | Einstellungen",
"Security: Roles | Settings": "Sicherheit: Rollen | Einstellungen",
"Security: Sessions | Settings": "Sicherheit: Sitzungen | Einstellungen",
"See all entities created by user": "Alle vom Benutzer erstellten Entitäten anzeigen",
"See all relationships created by user": "Alle vom Benutzer erstellten Beziehungen anzeigen",
"Select": "Wählen Sie",
Expand Down
4 changes: 4 additions & 0 deletions opencti-platform/opencti-front/lang/front/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -2326,6 +2326,10 @@
"Sectors": "Sectors",
"Sectors and organizations": "Sectors and organizations",
"Security": "Security",
"Security: Groups | Settings": "Security: Groups | Settings",
"Security: Marking Definitions | Settings": "Security: Marking Definitions | Settings",
"Security: Roles | Settings": "Security: Roles | Settings",
"Security: Sessions | Settings": "Security: Sessions | Settings",
"See all entities created by user": "See all entities created by user",
"See all relationships created by user": "See all relationships created by user",
"Select": "Select",
Expand Down
4 changes: 4 additions & 0 deletions opencti-platform/opencti-front/lang/front/es.json
Original file line number Diff line number Diff line change
Expand Up @@ -2326,6 +2326,10 @@
"Sectors": "Sectores",
"Sectors and organizations": "Sectores y organizaciones",
"Security": "Seguridad",
"Security: Groups | Settings": "Seguridad: Grupos | Configuración",
"Security: Marking Definitions | Settings": "Seguridad: Definiciones de marcado | Configuración",
"Security: Roles | Settings": "Seguridad: Roles | Configuración",
"Security: Sessions | Settings": "Seguridad: Sesiones | Configuración",
"See all entities created by user": "Ver todas las entidades creadas por el usuario",
"See all relationships created by user": "Ver todas las relaciones creadas por el usuario",
"Select": "Seleccione",
Expand Down
4 changes: 4 additions & 0 deletions opencti-platform/opencti-front/lang/front/fr.json
Original file line number Diff line number Diff line change
Expand Up @@ -2326,6 +2326,10 @@
"Sectors": "Secteurs",
"Sectors and organizations": "Secteurs et organisations",
"Security": "Sécurité",
"Security: Groups | Settings": "Sécurité : Groupes | Paramètres",
"Security: Marking Definitions | Settings": "Sécurité : définitions de marquage | Paramètres",
"Security: Roles | Settings": "Sécurité : Rôles | Paramètres",
"Security: Sessions | Settings": "Sécurité : Sessions | Paramètres",
"See all entities created by user": "Voir toutes les entités crées par l'utilisateur",
"See all relationships created by user": "Voir toutes les relations crées par l'utilisateur",
"Select": "Sélectionnez",
Expand Down
4 changes: 4 additions & 0 deletions opencti-platform/opencti-front/lang/front/ja.json
Original file line number Diff line number Diff line change
Expand Up @@ -2326,6 +2326,10 @@
"Sectors": "セクター",
"Sectors and organizations": "セクターと組織",
"Security": "安全",
"Security: Groups | Settings": "セキュリティ:グループ|設定",
"Security: Marking Definitions | Settings": "セキュリティ:マーキング定義|設定",
"Security: Roles | Settings": "セキュリティ:ロール|設定",
"Security: Sessions | Settings": "セキュリティ:セッション|設定",
"See all entities created by user": "ユーザーが作成したすべてのエンティティを見る",
"See all relationships created by user": "ユーザーが作成したすべての関係を見る",
"Select": "選択する",
Expand Down
4 changes: 4 additions & 0 deletions opencti-platform/opencti-front/lang/front/ko.json
Original file line number Diff line number Diff line change
Expand Up @@ -2326,6 +2326,10 @@
"Sectors": "부문",
"Sectors and organizations": "부문 및 조직",
"Security": "보안",
"Security: Groups | Settings": "보안: 그룹 | 설정",
"Security: Marking Definitions | Settings": "보안: 정의 표시 | 설정",
"Security: Roles | Settings": "보안: 역할 | 설정",
"Security: Sessions | Settings": "보안: 세션 | 설정",
"See all entities created by user": "사용자가 만든 모든 엔터티 보기",
"See all relationships created by user": "사용자가 만든 모든 관계 보기",
"Select": "선택",
Expand Down
4 changes: 4 additions & 0 deletions opencti-platform/opencti-front/lang/front/zh.json
Original file line number Diff line number Diff line change
Expand Up @@ -2326,6 +2326,10 @@
"Sectors": "部门",
"Sectors and organizations": "部门和组织",
"Security": "安全",
"Security: Groups | Settings": "安全:组|设置",
"Security: Marking Definitions | Settings": "安全性:标记定义|设置",
"Security: Roles | Settings": "安全:角色|设置",
"Security: Sessions | Settings": "安全:会话|设置",
"See all entities created by user": "查看用户创建的所有实体",
"See all relationships created by user": "查看用户创建的所有关系",
"Select": "选择",
Expand Down
Original file line number Diff line number Diff line change
@@ -1,17 +1,26 @@
import React, { Component } from 'react';
import * as PropTypes from 'prop-types';
import { compose, propOr } from 'ramda';
import withStyles from '@mui/styles/withStyles';
import React, { useState, useEffect } from 'react';
import makeStyles from '@mui/styles/makeStyles';
import { graphql } from 'react-relay';
import { QueryRenderer } from '../../../relay/environment';
import { useLocation, useNavigate } from 'react-router-dom';
import { buildViewParamsFromUrlAndStorage, saveViewParameters } from '../../../utils/ListParameters';
import inject18n from '../../../components/i18n';
import type { Theme } from '../../../components/Theme';
import { useFormatter } from '../../../components/i18n';
import ListLines from '../../../components/list_lines/ListLines';
import GroupsLines, { groupsLinesQuery } from './groups/GroupsLines';
import GroupCreation from './groups/GroupCreation';
import AccessesMenu from './AccessesMenu';
import { OrderMode, PaginationOptions } from '../../../components/list_lines';
import Breadcrumbs from '../../../components/Breadcrumbs';
import withRouter from '../../../utils/compat_router/withRouter';
import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
import { GroupsLinesPaginationQuery$data } from './groups/__generated__/GroupsLinesPaginationQuery.graphql';
import AccessesMenu from './AccessesMenu';
import { QueryRenderer } from '../../../relay/environment';

const useStyles = makeStyles<Theme>(() => ({
container: {
margin: 0,
padding: '0 200px 50px 0',
},
}));

export const groupsSearchQuery = graphql`
query GroupsSearchQuery($search: String) {
Expand Down Expand Up @@ -40,49 +49,51 @@ export const groupsSearchQuery = graphql`
}
`;

const styles = () => ({
container: {
margin: 0,
padding: '0 200px 50px 0',
},
});

const LOCAL_STORAGE_KEY = 'groups';
class Groups extends Component {
constructor(props) {
super(props);
const params = buildViewParamsFromUrlAndStorage(
props.navigate,
props.location,
LOCAL_STORAGE_KEY,
);
this.state = {
sortBy: propOr('name', 'sortBy', params),
orderAsc: propOr(true, 'orderAsc', params),
searchTerm: propOr('', 'searchTerm', params),
view: propOr('lines', 'view', params),
};
}

saveView() {
const Groups = () => {
const classes = useStyles();
const { t_i18n } = useFormatter();
const navigate = useNavigate();
const location = useLocation();
const { setTitle } = useConnectedDocumentModifier();
setTitle(t_i18n('Security: Groups | Settings'));
const params = buildViewParamsFromUrlAndStorage(
navigate,
location,
LOCAL_STORAGE_KEY,
);

const [groupState, setGroupState] = useState<{ orderAsc: boolean, searchTerm: string, view: string, sortBy: string }>({
sortBy: params.sortBy ?? 'name',
orderAsc: params.orderAsc !== false,
searchTerm: params.searchTerm ?? '',
view: params.view ?? 'lines',
});

function saveView() {
saveViewParameters(
this.props.navigate,
this.props.location,
navigate,
location,
LOCAL_STORAGE_KEY,
this.state,
groupState,
);
}

handleSearch(value) {
this.setState({ searchTerm: value }, () => this.saveView());
function handleSearch(value: string) {
setGroupState({ ...groupState, searchTerm: value });
}

handleSort(field, orderAsc) {
this.setState({ sortBy: field, orderAsc }, () => this.saveView());
function handleSort(field: string, orderAsc: boolean) {
setGroupState({ ...groupState, sortBy: field, orderAsc });
}

renderLines(paginationOptions) {
const { sortBy, orderAsc, searchTerm } = this.state;
useEffect(() => {
saveView();
}, [groupState]);

function renderLines(paginationOptions: PaginationOptions) {
const { sortBy, orderAsc, searchTerm } = groupState;
const dataColumns = {
name: {
label: 'Name',
Expand Down Expand Up @@ -125,16 +136,16 @@ class Groups extends Component {
sortBy={sortBy}
orderAsc={orderAsc}
dataColumns={dataColumns}
handleSort={this.handleSort.bind(this)}
handleSearch={this.handleSearch.bind(this)}
handleSort={handleSort}
handleSearch={handleSearch}
displayImport={false}
secondaryAction={false}
keyword={searchTerm}
>
<QueryRenderer
query={groupsLinesQuery}
variables={{ count: 25, ...paginationOptions }}
render={({ props }) => (
render={({ props }: { props: GroupsLinesPaginationQuery$data }) => (
<GroupsLines
data={props}
paginationOptions={paginationOptions}
Expand All @@ -147,30 +158,20 @@ class Groups extends Component {
);
}

render() {
const { view, sortBy, orderAsc, searchTerm } = this.state;
const { t, classes } = this.props;
const paginationOptions = {
search: searchTerm,
orderBy: sortBy,
orderMode: orderAsc ? 'asc' : 'desc',
};
return (
<div className={classes.container} data-testid="groups-settings-page">
<Breadcrumbs elements={[{ label: t('Settings') }, { label: t('Security') }, { label: t('Groups'), current: true }]} />
<AccessesMenu />
{view === 'lines' ? this.renderLines(paginationOptions) : ''}
<GroupCreation paginationOptions={paginationOptions} />
</div>
);
}
}
const paginationOptions: PaginationOptions = {
search: groupState.searchTerm,
orderBy: groupState.sortBy ? groupState.sortBy : null,
orderMode: groupState.orderAsc ? OrderMode.asc : OrderMode.desc,
};

Groups.propTypes = {
t: PropTypes.func,
classes: PropTypes.object,
navigate: PropTypes.func,
location: PropTypes.object,
return (
<div className={classes.container} data-testid="groups-settings-page">
<Breadcrumbs elements={[{ label: t_i18n('Settings') }, { label: t_i18n('Security') }, { label: t_i18n('Groups'), current: true }]} />
<AccessesMenu />
{groupState.view === 'lines' ? renderLines(paginationOptions) : ''}
<GroupCreation paginationOptions={paginationOptions} />
</div>
);
};

export default compose(inject18n, withRouter, withStyles(styles))(Groups);
export default Groups;
Loading

0 comments on commit 79df089

Please sign in to comment.