Skip to content

Commit

Permalink
[frontend] make TAI personas always visible to be able to add some
Browse files Browse the repository at this point in the history
  • Loading branch information
@labo-flg
labo-flg committed Sep 13, 2024
1 parent 93242a7 commit 6e6fd69
Show file tree
Hide file tree
Showing 5 changed files with 89 additions and 86 deletions.
2 changes: 1 addition & 1 deletion opencti-platform/opencti-front/src/components/FieldOrEmpty.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ interface FieldOrEmptyProps<T> {
children: React.ReactNode;
}

const FieldOrEmpty = <T = never>({ source, children }: FieldOrEmptyProps<T>) => {
const FieldOrEmpty = <T = unknown>({ source, children }: FieldOrEmptyProps<T>) => {
return <>{isNotEmptyField(source) ? children : '-'}</>; // render the children if source is defined
};
export default FieldOrEmpty;
2 changes: 2 additions & 0 deletions ...rc/private/components/observations/stix_cyber_observables/StixCyberObservableCreation.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -270,6 +270,7 @@ const StixCyberObservableCreation = ({
inputValue,
paginationKey,
paginationOptions,
controlledDialStyles = {},
defaultCreatedBy = null,
defaultMarkingDefinitions = null,
isFromBulkRelation,
Expand Down Expand Up @@ -901,6 +902,7 @@ const StixCyberObservableCreation = ({
entityType={type ?? 'Observable'}
onOpen={handleOpen}
onClose={() => {}}
style={controlledDialStyles}
/>
: <Fab
onClick={handleOpen}
Expand Down
96 changes: 47 additions & 49 deletions ...cti-front/src/private/components/threats/threat_actors_group/ThreatActorGroupLocation.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ import Security from '../../../../utils/Security';
import { KNOWLEDGE_KNUPDATE } from '../../../../utils/hooks/useGranted';
import AddLocationsThreatActorGroup from './AddLocationsThreatActorGroup';
import { addLocationsThreatActorGroupMutationRelationDelete } from './AddLocationsThreatActorGroupLines';
import FieldOrEmpty from '../../../../components/FieldOrEmpty';

class ThreatActorGroupLocationsComponent extends Component {
removeLocation(locationEdge) {
Expand Down Expand Up @@ -60,62 +61,59 @@ class ThreatActorGroupLocationsComponent extends Component {
/>
</Security>
<div className="clearfix" />
<List style={{ marginTop: -10 }}>
{threatActorGroup.locations.edges.length === 0 && (
<ListItem dense={true} divider={true} button={false}>
<ListItemText primary="-" />
</ListItem>
)}
{threatActorGroup.locations.edges.map((locationEdge) => {
const { types } = locationEdge;
const location = locationEdge.node;
const link = resolveLink(location.entity_type);
const flag = location.entity_type === 'Country'
<FieldOrEmpty source={threatActorGroup.locations.edges}>
<List style={{ marginTop: -10 }}>
{threatActorGroup.locations.edges.map((locationEdge) => {
const { types } = locationEdge;
const location = locationEdge.node;
const link = resolveLink(location.entity_type);
const flag = location.entity_type === 'Country'
&& R.head(
(location.x_opencti_aliases ?? []).filter(
(n) => n?.length === 2,
),
);
return (
<ListItem
key={location.id}
dense={true}
divider={true}
button={true}
component={Link}
to={`${link}/${location.id}`}
>
<ListItemIcon>
return (
<ListItem
key={location.id}
dense={true}
divider={true}
button={true}
component={Link}
to={`${link}/${location.id}`}
>
<ListItemIcon>
{flag ? (
<img
style={{ width: 20 }}
src={`${APP_BASE_PATH}/static/flags/4x3/${flag.toLowerCase()}.svg`}
alt={location.name}
/>
) : (
<ItemIcon type={location.entity_type} />
)}
<ListItemIcon>
{flag ? (
<img
style={{ width: 20 }}
src={`${APP_BASE_PATH}/static/flags/4x3/${flag.toLowerCase()}.svg`}
alt={location.name}
/>
) : (
<ItemIcon type={location.entity_type} />
)}
</ListItemIcon>
</ListItemIcon>
</ListItemIcon>
<ListItemText primary={location.name} />
{types.includes('manual') ? (
<ListItemSecondaryAction>
<Security needs={[KNOWLEDGE_KNUPDATE]}>
<IconButton
aria-label="Remove"
onClick={() => this.removeLocation(locationEdge)}
size="large"
>
<LinkOff />
</IconButton>
</Security>
</ListItemSecondaryAction>
) : <AutoFix fontSize="small" style={{ marginRight: 13 }}/>}
</ListItem>
);
})}
</List>
<ListItemText primary={location.name} />
{types.includes('manual') ? (
<ListItemSecondaryAction>
<Security needs={[KNOWLEDGE_KNUPDATE]}>
<IconButton
aria-label="Remove"
onClick={() => this.removeLocation(locationEdge)}
size="large"
>
<LinkOff />
</IconButton>
</Security>
</ListItemSecondaryAction>
) : <AutoFix fontSize="small" style={{ marginRight: 13 }}/>}
</ListItem>
);
})}
</List>
</FieldOrEmpty>
</>
);
}
Expand Down
73 changes: 38 additions & 35 deletions ...private/components/threats/threat_actors_individual/ThreatActorIndividualDetailsChips.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { KNOWLEDGE_KNUPDATE } from 'src/utils/hooks/useGranted';
import { ThreatActorIndividualDetails_ThreatActorIndividual$data } from './__generated__/ThreatActorIndividualDetails_ThreatActorIndividual.graphql';
import AddPersonaThreatActorIndividual from './AddPersonasThreatActorIndividual';
import AddIndividualsThreatActorIndividual from './AddIndividualsThreatActorIndividual';
import FieldOrEmpty from '../../../../components/FieldOrEmpty';

type SupportedTypes = 'known-as' | 'impersonates';
type SupportedFields = 'persona_name' | 'name';
Expand Down Expand Up @@ -59,43 +60,45 @@ ThreatActorIndividualDetailsChipsProps
setNodes(getRelationshipsOfType(relType));
}, [data]);

// Hide if there are no valid relations

return (<div style={{ marginBottom: '20px' }}>
<div style={{
display: 'flex',
flexDirection: 'row',
}}
>

<Typography
variant="h3"
gutterBottom={true}
return (
<div style={{ marginBottom: '20px' }}>
<div style={{
display: 'flex',
flexDirection: 'row',
}}
>
{title}
</Typography>
<Security
needs={[KNOWLEDGE_KNUPDATE]}
placeholder={<div style={{ height: 29 }} />}
>
<AddComponent threatActorIndividual={data} />
</Security>
</div>
<div className='clearfix' />
{
nodes.map(({ id, to }) => (
<Button
key={id}
variant='outlined'
size='small'
href={`${path}/${to?.id}`}
style={{ margin: '0 5px 5px 0' }}

<Typography
variant="h3"
gutterBottom={true}
>
{to?.[field]}
</Button>
))
}
</div>);
{title}
</Typography>
<Security
needs={[KNOWLEDGE_KNUPDATE]}
placeholder={<div style={{ height: 29 }} />}
>
<AddComponent threatActorIndividual={data} />
</Security>
</div>
<div className='clearfix' />
<FieldOrEmpty source={nodes}>
{
nodes.map(({ id, to }) => (
<Button
key={id}
variant='outlined'
size='small'
href={`${path}/${to?.id}`}
style={{ margin: '0 5px 5px 0' }}
>
{to?.[field]}
</Button>
))
}
</FieldOrEmpty>
</div>
);
};

export default ThreatActorIndividualDetailsChips;
2 changes: 1 addition & 1 deletion ...src/private/components/threats/threat_actors_individual/ThreatActorIndividualLocation.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ class ThreatActorIndividualLocationsComponent extends Component {
/>
</Security>
<div className="clearfix" />
<FieldOrEmpty source={threatActorIndividual.locations}>
<FieldOrEmpty source={threatActorIndividual.locations.edges}>
<List style={{ marginTop: -10 }}>
{threatActorIndividual.locations.edges.map((locationEdge) => {
const { types } = locationEdge;
Expand Down

0 comments on commit 6e6fd69

Please sign in to comment.