[Frontend] Add titles on functional component pages

WIP - Adding Titles to pages

WIP - Updating Titles

WIP - Updating Titles for Functional Components only.

Updated Titles. Some class component pages have not been updated.

Revert "Updated Titles. Some class component pages have not been updated."

This reverts commit babb1cd.

Updated Titles. Some class component pages have not been updated.

Resolving Merge Conflicts

[frontend] Replaced Creation Floating Action Buttons for Cases

[frontend] Replaced Creation Floating Action Buttons for Observations

Fixed minor errors

Fixed duplicate issue.

Add translations and linting

Fix import issue from merge

Minor cleanup

Test commit

Formatting change

Add space to root again?

Add settings pages that are already functional

Add killChainPhases

Update translations

Add Narratives title

Translate narratives

Add data components

Remove duplicate Data titles (pt 2)

Add translations

Fix case on Taxii.tsx

Update translations

opencti-platform/opencti-front/src/private/Root.tsx

@@ -262,7 +262,6 @@ const computeBannerSettings = (settings: RootSettings$data) => {
     sessionLimit,
   };
 };
-
 interface RootComponentProps {
   queryRef: PreloadedQuery<RootPrivateQuery>;
 }

opencti-platform/opencti-front/src/private/components/Search.tsx

@@ -13,6 +13,8 @@ import { emptyFilterGroup, useBuildEntityTypeBasedFilterContext, useGetDefaultFi
 import { decodeSearchKeyword } from '../../utils/SearchUtils';
 import DataTable from '../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../utils/hooks/usePreloadedPaginationFragment';
+import { useFormatter } from '../../components/i18n';
+import useConnectedDocumentModifier from '../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'search';
 
@@ -185,6 +187,9 @@ const Search = () => {
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },
   } = useAuth();
+  const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Knowledge Search | Advanced Search'));
   const { keyword } = useParams() as { keyword: string };
 
   const searchTerm = decodeSearchKeyword(keyword);

opencti-platform/opencti-front/src/private/components/SearchBulk.jsx

@@ -31,6 +31,7 @@ import { hexToRGB, itemColor } from '../../utils/Colors';
 import ItemMarkings from '../../components/ItemMarkings';
 import { export_max_size } from '../../utils/utils';
 import Breadcrumbs from '../../components/Breadcrumbs';
+import useConnectedDocumentModifier from '../../utils/hooks/useConnectedDocumentModifier';
 
 const SEARCH$ = new Subject().pipe(debounce(() => timer(500)));
 
@@ -263,6 +264,8 @@ const inlineStyles = {
 
 const SearchBulk = () => {
   const { t_i18n, nsd, n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Bulk Search'));
   const isGrantedToExports = useGranted([KNOWLEDGE_KNGETEXPORT]);
   const classes = useStyles();
   const [textFieldValue, setTextFieldValue] = useState('');

opencti-platform/opencti-front/src/private/components/analyses/ExternalReferences.tsx

@@ -100,7 +100,7 @@ const externalReferencesLinesFragment = graphql`
 const ExternalReferences: FunctionComponent<ExternalReferencesProps> = () => {
   const { t_i18n } = useFormatter();
   const { setTitle } = useConnectedDocumentModifier();
-  setTitle(t_i18n('External references | Analyses'));
+  setTitle(t_i18n('External References | Analyses'));
   const { isFeatureEnable } = useHelper();
   const isFABReplaced = isFeatureEnable('FAB_REPLACEMENT');
   const {

opencti-platform/opencti-front/src/private/components/arsenal/Channels.tsx

@@ -13,6 +13,7 @@ import { useFormatter } from '../../../components/i18n';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import useHelper from '../../../utils/hooks/useHelper';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'channels';
 
@@ -101,7 +102,8 @@ const Channels = () => {
   const { t_i18n } = useFormatter();
   const { isFeatureEnable } = useHelper();
   const isFABReplaced = isFeatureEnable('FAB_REPLACEMENT');
-
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Channels | Arsenal'));
   const initialValues = {
     searchTerm: '',
     sortBy: 'name',

opencti-platform/opencti-front/src/private/components/arsenal/Malwares.tsx

@@ -20,11 +20,14 @@ import { useFormatter } from '../../../components/i18n';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import DataTable from '../../../components/dataGrid/DataTable';
 import useHelper from '../../../utils/hooks/useHelper';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'malwares';
 
 const Malwares = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Malware | Arsenal'));
   const initialValues = {
     searchTerm: '',
     sortBy: 'name',

opencti-platform/opencti-front/src/private/components/arsenal/Tools.tsx

@@ -13,6 +13,7 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import useHelper from '../../../utils/hooks/useHelper';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'tools';
 
@@ -100,6 +101,8 @@ const Tools = () => {
   const { t_i18n } = useFormatter();
   const { isFeatureEnable } = useHelper();
   const isFABReplaced = isFeatureEnable('FAB_REPLACEMENT');
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Tools | Arsenal'));
   const initialValues = {
     searchTerm: '',
     sortBy: 'name',

opencti-platform/opencti-front/src/private/components/arsenal/Vulnerabilities.tsx

@@ -14,6 +14,7 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import useHelper from '../../../utils/hooks/useHelper';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'vulnerabilities';
 
@@ -104,6 +105,8 @@ const vulnerabilitiesLinesFragment = graphql`
 
 const Vulnerabilities = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Vulnerabilities | Arsenal'));
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },
   } = useAuth();

opencti-platform/opencti-front/src/private/components/cases/CaseIncidents.tsx

@@ -18,6 +18,7 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { DataTableProps } from '../../../components/dataGrid/dataTableTypes';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 interface CaseIncidentsProps {
   inputValue?: string;
@@ -126,6 +127,8 @@ export const LOCAL_STORAGE_KEY_CASE_INCIDENT = 'caseIncidents';
 
 const CaseIncidents: FunctionComponent<CaseIncidentsProps> = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Incident Responses | Cases'));
   const { isFeatureEnable } = useHelper();
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },

opencti-platform/opencti-front/src/private/components/cases/CaseRfis.tsx

@@ -14,6 +14,7 @@ import { useFormatter } from '../../../components/i18n';
 import Breadcrumbs from '../../../components/Breadcrumbs';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 interface CaseRfisProps {
   inputValue?: string;
@@ -121,6 +122,8 @@ export const LOCAL_STORAGE_KEY = 'caseRfis';
 
 const CaseRfis: FunctionComponent<CaseRfisProps> = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Requests for Information | Cases'));
   const { isFeatureEnable } = useHelper();
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },

opencti-platform/opencti-front/src/private/components/cases/CaseRfts.tsx

@@ -15,6 +15,7 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import { DataTableProps } from '../../../components/dataGrid/dataTableTypes';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 interface CaseRftsProps {
   inputValue?: string;
@@ -123,6 +124,8 @@ export const LOCAL_STORAGE_KEY = 'caseRfts';
 const CaseRfts: FunctionComponent<CaseRftsProps> = () => {
   const { t_i18n } = useFormatter();
   const { isFeatureEnable } = useHelper();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Requests for Takedown | Cases'));
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },
   } = useAuth();

opencti-platform/opencti-front/src/private/components/cases/Feedbacks.tsx

@@ -11,6 +11,7 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import { DataTableProps } from '../../../components/dataGrid/dataTableTypes';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 interface FeedbacksProps {
   inputValue?: string;
@@ -119,6 +120,8 @@ export const LOCAL_STORAGE_KEY_FEEDBACK = 'feedbacks';
 
 const Feedbacks: FunctionComponent<FeedbacksProps> = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Feedbacks | Cases'));
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },
   } = useAuth();

opencti-platform/opencti-front/src/private/components/cases/Tasks.tsx

@@ -13,6 +13,7 @@ import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import ItemDueDate from '../../../components/ItemDueDate';
 import { DataTableProps } from '../../../components/dataGrid/dataTableTypes';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const tasksLinesQuery = graphql`
   query TasksLinesPaginationQuery(
@@ -73,6 +74,8 @@ export const LOCAL_STORAGE_KEY_TASKS = 'cases-casesTasks';
 
 const Tasks = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Tasks | Cases'));
 
   const initialValues = {
     searchTerm: '',

opencti-platform/opencti-front/src/private/components/data/CsvMappers.tsx

@@ -14,6 +14,7 @@ import Loader, { LoaderVariant } from '../../../components/Loader';
 import useQueryLoading from '../../../utils/hooks/useQueryLoading';
 import Breadcrumbs from '../../../components/Breadcrumbs';
 import { useFormatter } from '../../../components/i18n';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY_CSV_MAPPERS = 'csvMappers';
 
@@ -28,6 +29,8 @@ const useStyles = makeStyles(() => ({
 const CsvMappers = () => {
   const classes = useStyles();
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Processing: CSV Mappers | Data'));
   const { viewStorage, paginationOptions, helpers } = usePaginationLocalStorage<csvMappers_MappersQuery$variables>(
     LOCAL_STORAGE_KEY_CSV_MAPPERS,
     {

opencti-platform/opencti-front/src/private/components/data/Entities.tsx

@@ -15,11 +15,14 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import DataTable from '../../../components/dataGrid/DataTable';
 import { UsePreloadedPaginationFragment } from '../../../utils/hooks/usePreloadedPaginationFragment';
 import { DataTableProps } from '../../../components/dataGrid/dataTableTypes';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'entities';
 
 const Entities = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Entities | Data'));
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },
   } = useAuth();

opencti-platform/opencti-front/src/private/components/data/Feed.tsx

@@ -13,9 +13,12 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import { useFormatter } from '../../../components/i18n';
 import { TAXIIAPI_SETCOLLECTIONS } from '../../../utils/hooks/useGranted';
 import Security from '../../../utils/Security';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const Feed = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Data sharing: CSV Feeds | Data'));
   const LOCAL_STORAGE_KEY = 'feed';
   const navigate = useNavigate();
   const location = useLocation();

opencti-platform/opencti-front/src/private/components/data/IngestionCsv.tsx

@@ -15,6 +15,7 @@ import useQueryLoading from '../../../utils/hooks/useQueryLoading';
 import { INGESTION_SETINGESTIONS } from '../../../utils/hooks/useGranted';
 import Security from '../../../utils/Security';
 import Breadcrumbs from '../../../components/Breadcrumbs';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'ingestionCsvs';
 
@@ -30,6 +31,8 @@ const useStyles = makeStyles(() => ({
 const IngestionCsv = () => {
   const classes = useStyles();
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Ingestion: CSV Feeds | Data'));
   const { platformModuleHelpers } = useAuth();
   const {
     viewStorage,

opencti-platform/opencti-front/src/private/components/data/IngestionRss.jsx

@@ -13,6 +13,7 @@ import IngestionMenu from './IngestionMenu';
 import Breadcrumbs from '../../../components/Breadcrumbs';
 import Security from '../../../utils/Security';
 import { INGESTION_SETINGESTIONS } from '../../../utils/hooks/useGranted';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'ingestionRss';
 
@@ -28,6 +29,8 @@ const useStyles = makeStyles(() => ({
 const IngestionRss = () => {
   const classes = useStyles();
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Ingestion: RSS Feeds | Data'));
   const { platformModuleHelpers } = useAuth();
   const {
     viewStorage,

opencti-platform/opencti-front/src/private/components/data/IngestionTaxiis.jsx

@@ -13,6 +13,7 @@ import IngestionMenu from './IngestionMenu';
 import Breadcrumbs from '../../../components/Breadcrumbs';
 import Security from '../../../utils/Security';
 import { INGESTION_SETINGESTIONS } from '../../../utils/hooks/useGranted';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'ingestionTaxii';
 
@@ -28,6 +29,8 @@ const useStyles = makeStyles(() => ({
 const IngestionTaxii = () => {
   const classes = useStyles();
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Ingestion: TAXII Feeds | Data'));
   const { platformModuleHelpers } = useAuth();
   const {
     viewStorage,

opencti-platform/opencti-front/src/private/components/data/Playbooks.tsx

@@ -30,6 +30,7 @@ import type { Theme } from '../../../components/Theme';
 import useEnterpriseEdition from '../../../utils/hooks/useEnterpriseEdition';
 import { useFormatter } from '../../../components/i18n';
 import Breadcrumbs from '../../../components/Breadcrumbs';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 export const LOCAL_STORAGE_KEY_PLAYBOOKS = 'playbooks';
 
@@ -46,6 +47,8 @@ const Playbooks: FunctionComponent = () => {
   const classes = useStyles();
   const isEnterpriseEdition = useEnterpriseEdition();
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Processing: Automation | Data'));
   const { viewStorage, helpers, paginationOptions } = usePaginationLocalStorage<PlaybooksLinesPaginationQuery$variables>(
     LOCAL_STORAGE_KEY_PLAYBOOKS,
     {

opencti-platform/opencti-front/src/private/components/data/Relationships.tsx

@@ -18,6 +18,7 @@ import { DataTableProps } from '../../../components/dataGrid/dataTableTypes';
 import ItemIcon from '../../../components/ItemIcon';
 import { itemColor } from '../../../utils/Colors';
 import ItemEntityType from '../../../components/ItemEntityType';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'relationships';
 
@@ -216,6 +217,8 @@ export const relationshipsStixCoreRelationshipsLinesFragment = graphql`
 
 const Relationships = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Relationships | Data'));
   const {
     platformModuleHelpers: { isRuntimeFieldEnable },
   } = useAuth();

opencti-platform/opencti-front/src/private/components/data/Sync.jsx

@@ -14,6 +14,7 @@ import IngestionMenu from './IngestionMenu';
 import Breadcrumbs from '../../../components/Breadcrumbs';
 import Security from '../../../utils/Security';
 import { INGESTION_SETINGESTIONS } from '../../../utils/hooks/useGranted';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const LOCAL_STORAGE_KEY = 'sync';
 
@@ -30,6 +31,8 @@ const Sync = () => {
   const theme = useTheme();
   const classes = useStyles();
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Ingestion: Remote OCTI Streams | Data'));
   const { platformModuleHelpers } = useAuth();
   const {
     viewStorage,

opencti-platform/opencti-front/src/private/components/data/Tasks.jsx

@@ -10,6 +10,7 @@ import useAuth from '../../../utils/hooks/useAuth';
 import { TASK_MANAGER } from '../../../utils/platformModulesHelper';
 import ProcessingMenu from './ProcessingMenu';
 import Breadcrumbs from '../../../components/Breadcrumbs';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 // Deprecated - https://mui.com/system/styles/basics/
 // Do not use it for new code.
@@ -22,6 +23,8 @@ const useStyles = makeStyles(() => ({
 
 const Tasks = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Processing: Tasks | Data'));
   const classes = useStyles();
   const { platformModuleHelpers } = useAuth();
   const optionsInProgress = {

opencti-platform/opencti-front/src/private/components/data/Taxii.tsx

@@ -13,9 +13,12 @@ import Breadcrumbs from '../../../components/Breadcrumbs';
 import { useFormatter } from '../../../components/i18n';
 import { TAXIIAPI_SETCOLLECTIONS } from '../../../utils/hooks/useGranted';
 import Security from '../../../utils/Security';
+import useConnectedDocumentModifier from '../../../utils/hooks/useConnectedDocumentModifier';
 
 const Taxii = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Data sharing: TAXII Collections | Data'));
   const LOCAL_STORAGE_KEY = 'taxii';
   const navigate = useNavigate();
   const location = useLocation();

opencti-platform/opencti-front/src/private/components/data/import/ImportFilesContent.tsx

@@ -23,6 +23,7 @@ import useApiMutation from '../../../../utils/hooks/useApiMutation';
 import Breadcrumbs from '../../../../components/Breadcrumbs';
 import { UsePreloadedPaginationFragment } from '../../../../utils/hooks/usePreloadedPaginationFragment';
 import { deleteNode } from '../../../../utils/store';
+import useConnectedDocumentModifier from '../../../../utils/hooks/useConnectedDocumentModifier';
 
 export const WorkbenchFileLineDeleteMutation = graphql`
   mutation ImportFilesContentFileLineDeleteMutation($fileName: String) {
@@ -123,6 +124,8 @@ const LOCAL_STORAGE_KEY = 'importFiles';
 
 const ImportFilesContent = () => {
   const { t_i18n } = useFormatter();
+  const { setTitle } = useConnectedDocumentModifier();
+  setTitle(t_i18n('Import: Upload Files | Data'));
   const [displayDelete, setDisplayDelete] = useState<string>('');
 
   const initialValues = {