Skip to content

UI/changes (dev) #1789

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
cccs-nr merged 14 commits into from
Dec 11, 2025
Merged

UI/changes (dev) #1789

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
14 commits
Select commit Hold shift + click to select a range
6a16f9d
Merge pull request #1785 from CybercentreCanada/input/bugfix
cccs-nr Oct 24, 2025
ef64a28
Improved the TimelineBody
cccs-nr Nov 7, 2025
acbb6da
Added defensive prog to the DefaultMetadata
cccs-nr Nov 7, 2025
badc191
Make sure that the ConfirmationDialog properly waits and closes when …
cccs-nr Nov 21, 2025
abeefff
Undoing the changes to the DefaultMetadata
cccs-nr Nov 21, 2025
c36c1e4
Undoing the changes to the timeline_body
cccs-nr Nov 21, 2025
74aa2d2
Switching the Retrohunt Search buttons
cccs-nr Nov 21, 2025
531a88a
Added the TextScroller that wil horizontally scroll its children in a…
cccs-nr Nov 24, 2025
85bc7b5
Changing the default yara signature
cccs-nr Dec 4, 2025
a12ffb9
Fixed the autocomplete rule for Yara's monaco language
cccs-nr Dec 5, 2025
7ebfd83
Minor fix to the yara
cccs-nr Dec 5, 2025
53b21c8
Removed the "Dead Link" image from the 404 page.
cccs-nr Dec 5, 2025
c147a9b
Fixed the Drawer sizing issue on the Retrohunt Detail page
cccs-nr Dec 11, 2025
1b363a2
Fixed an issue where file name containing "#" would inadvertly open t…
cccs-nr Dec 11, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file removed public/images/dead_link.png
View file
Open in desktop
Binary file not shown.
4 changes: 2 additions & 2 deletions src/components/routes/404_dl.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,10 +9,10 @@ const NotFoundPage = () => {
return (
<PageCenter width="65%" margin={4}>
<div style={{ paddingTop: theme.spacing(10), paddingBottom: theme.spacing(6) }}>
<img alt={t('dl.alt')} src="/images/dead_link.png" style={{ maxHeight: '300px', maxWidth: '90%' }} />
<Typography variant="h1">{t('title')}</Typography>
</div>
<div>
<Typography variant="h6">{t('dl.description')}</Typography>
<Typography variant="h6">{t('description')}</Typography>
</div>
</PageCenter>
);
Expand Down
22 changes: 11 additions & 11 deletions src/components/routes/retrohunt.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
import AddCircleOutlineOutlinedIcon from '@mui/icons-material/AddCircleOutlineOutlined';
import PersonOutlinedIcon from '@mui/icons-material/PersonOutlined';
import PersonIcon from '@mui/icons-material/Person';
import TimerOutlinedIcon from '@mui/icons-material/TimerOutlined';
import { Pagination, Typography, useMediaQuery, useTheme } from '@mui/material';
import PageContainer from 'commons/components/pages/PageContainer';
Expand Down Expand Up @@ -305,6 +305,16 @@ export default function RetrohuntPage() {
} else handleQueryRemove(['query', 'rows', 'offset']);
}}
buttons={[
{
icon: <PersonIcon fontSize={downSM ? 'small' : 'medium'} />,
tooltip: hasFilter(`creator:${currentUser.username}`)
? t('filter.creator_self.remove')
: t('filter.creator_self.add'),
props: {
color: hasFilter(`creator:${currentUser.username}`) ? 'primary' : 'default',
onClick: () => handleToggleFilter(`creator:${currentUser.username}`)
}
},
{
icon: <TimerOutlinedIcon fontSize={downSM ? 'small' : 'medium'} />,
tooltip: hasFilter(`completed_time:>=${last24hDate}`)
Expand All @@ -314,16 +324,6 @@ export default function RetrohuntPage() {
color: hasFilter(`completed_time:>=${last24hDate}`) ? 'primary' : 'default',
onClick: () => handleToggleFilter(`completed_time:>=${last24hDate}`)
}
},
{
icon: <PersonOutlinedIcon fontSize={downSM ? 'small' : 'medium'} />,
tooltip: hasFilter(`creator:${currentUser.username}`)
? t('filter.creator_self.remove')
: t('filter.creator_self.add'),
props: {
color: hasFilter(`creator:${currentUser.username}`) ? 'primary' : 'default',
onClick: () => handleToggleFilter(`creator:${currentUser.username}`)
}
}
]}
>
Expand Down
16 changes: 13 additions & 3 deletions src/components/routes/retrohunt/create.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,17 @@ function WrappedRetrohuntCreate({ isDrawer = false, onCreateRetrohunt = () => nu
started_time: null,
truncated: false,
ttl: !configuration?.retrohunt?.dtl ? 30 : configuration?.retrohunt?.dtl,
yara_signature: ''
yara_signature: `
rule yara_template {
meta:
description = ""
strings:
$a = "First string"
$b = /some_regex_with_a_string.{,10}/
condition:
all of them
}
`
}),
[
c12nDef?.UNRESTRICTED,
Expand All @@ -87,6 +97,7 @@ function WrappedRetrohuntCreate({ isDrawer = false, onCreateRetrohunt = () => nu

const handleCreateRetrohunt = useCallback(
(result: RetrohuntData) => {
setIsConfirmationOpen(false);
if (!currentUser.roles.includes('retrohunt_run') && configuration?.retrohunt?.enabled) return;
apiCall({
method: 'PUT',
Expand All @@ -104,12 +115,10 @@ function WrappedRetrohuntCreate({ isDrawer = false, onCreateRetrohunt = () => nu
setRetrohunt({ ...DEFAULT_RETROHUNT, ...api_data.api_response });
setIsModified(false);
setIsDisabled(true);
setIsConfirmationOpen(false);
setTimeout(() => window.dispatchEvent(new CustomEvent('reloadRetrohunts')), 1000);
},
onFailure: api_data => {
showErrorMessage(api_data.api_error_message);
setIsConfirmationOpen(false);
},
onEnter: () => setIsButtonLoading(true),
onExit: () => setIsButtonLoading(false)
Expand Down Expand Up @@ -153,6 +162,7 @@ function WrappedRetrohuntCreate({ isDrawer = false, onCreateRetrohunt = () => nu
cancelText={t('validate.cancelText')}
acceptText={t('validate.acceptText')}
text={t('validate.text')}
waiting={isButtonLoading}
/>

<Grid container flexDirection="column" flexWrap="nowrap" flex={1} rowGap={1}>
Expand Down
170 changes: 88 additions & 82 deletions src/components/routes/retrohunt/detail.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -113,6 +113,7 @@ function WrappedRetrohuntDetailPage({ search_key: propKey = null, isDrawer = fal
const [hitResults, setHitResults] = useState<SearchResult<FileIndexed>>(null);
const [typeDataSet, setTypeDataSet] = useState<Record<string, number>>(null);
const [isReloading, setIsReloading] = useState<boolean>(true);
const [isInitialized, setIsInitialized] = useState<boolean>(false);
const [query, setQuery] = useState<SimpleSearchQuery>(null);

const filterValue = useRef<string>('');
Expand Down Expand Up @@ -237,7 +238,10 @@ function WrappedRetrohuntDetailPage({ search_key: propKey = null, isDrawer = fal
}
},
onEnter: () => setIsReloading(true),
onExit: () => setIsReloading(false)
onExit: () => {
setIsReloading(false);
setIsInitialized(true);
}
});
apiCall({
method: 'POST',
Expand Down Expand Up @@ -593,90 +597,92 @@ function WrappedRetrohuntDetailPage({ search_key: propKey = null, isDrawer = fal
) : (
<>
<Grid>
<SearchBar
initValue={query ? query.get('query', '') : ''}
placeholder={t('hits.filter')}
searching={isReloading}
suggestions={suggestions}
onValueChange={value => {
filterValue.current = value;
}}
onClear={() => handleQueryRemove(['query', 'rows', 'offset'])}
onSearch={() => {
if (filterValue.current !== '') {
handleQueryChange('query', filterValue.current);
handleQueryChange('offset', 0);
} else handleQueryRemove(['query', 'rows', 'offset']);
}}
>
<div
style={{
fontStyle: 'italic',
paddingTop: theme.spacing(0.5),
display: 'flex',
justifyContent: 'flex-end',
flexWrap: 'wrap'
{isInitialized && (
<SearchBar
initValue={query ? query.get('query', '') : ''}
placeholder={t('hits.filter')}
searching={isReloading}
suggestions={suggestions}
onValueChange={value => {
filterValue.current = value;
}}
onClear={() => handleQueryRemove(['query', 'rows', 'offset'])}
onSearch={() => {
if (filterValue.current !== '') {
handleQueryChange('query', filterValue.current);
handleQueryChange('offset', 0);
} else handleQueryRemove(['query', 'rows', 'offset']);
}}
>
{hitResults && hitResults.total !== 0 && (
<Typography variant="subtitle1" color="secondary" style={{ flexGrow: 1 }}>
{isReloading ? (
<span>{t('searching')}</span>
) : (
<span>
<SearchCount
currentMax={MAX_TRACKED_RECORDS}
defaultMax={MAX_TRACKED_RECORDS}
disabled
loading={isReloading}
total={hitResults?.total}
suffix={
query.get('query') || query.get('filters')
? t(`hits.filtered${hitResults.total === 1 ? '' : 's'}`)
: t(`hits.total${hitResults.total === 1 ? '' : 's'}`)
}
/>
</span>
)}
</Typography>
)}
{hitPageCount > 1 && (
<Pagination
page={Math.ceil(1 + query.get('offset') / PAGE_SIZE)}
onChange={(e, value) => handleQueryChange('offset', (value - 1) * PAGE_SIZE)}
count={hitPageCount}
shape="rounded"
size="small"
/>
)}
</div>
{query && (
<div>
<ChipList
items={query.getAll('filters', []).map(
f =>
({
color: f.indexOf('NOT ') === 0 ? 'error' : null,
label: `${f}`,
variant: 'outlined',
onClick: () => {
query.replace(
'filters',
f,
f.indexOf('NOT ') === 0 ? f.substring(5, f.length - 1) : `NOT (${f})`
);
handleNavigate(query);
},
onDelete: () => {
query.remove('filters', f);
handleNavigate(query);
}
}) as CustomChipProps
)}
/>
<div
style={{
fontStyle: 'italic',
paddingTop: theme.spacing(0.5),
display: 'flex',
justifyContent: 'flex-end',
flexWrap: 'wrap'
}}
>
{hitResults && hitResults.total !== 0 && (
<Typography variant="subtitle1" color="secondary" style={{ flexGrow: 1 }}>
{isReloading ? (
<span>{t('searching')}</span>
) : (
<span>
<SearchCount
currentMax={MAX_TRACKED_RECORDS}
defaultMax={MAX_TRACKED_RECORDS}
disabled
loading={isReloading}
total={hitResults?.total}
suffix={
query.get('query') || query.get('filters')
? t(`hits.filtered${hitResults.total === 1 ? '' : 's'}`)
: t(`hits.total${hitResults.total === 1 ? '' : 's'}`)
}
/>
</span>
)}
</Typography>
)}
{hitPageCount > 1 && (
<Pagination
page={Math.ceil(1 + query.get('offset') / PAGE_SIZE)}
onChange={(e, value) => handleQueryChange('offset', (value - 1) * PAGE_SIZE)}
count={hitPageCount}
shape="rounded"
size="small"
/>
)}
</div>
)}
</SearchBar>
{query && (
<div>
<ChipList
items={query.getAll('filters', []).map(
f =>
({
color: f.indexOf('NOT ') === 0 ? 'error' : null,
label: `${f}`,
variant: 'outlined',
onClick: () => {
query.replace(
'filters',
f,
f.indexOf('NOT ') === 0 ? f.substring(5, f.length - 1) : `NOT (${f})`
);
handleNavigate(query);
},
onDelete: () => {
query.remove('filters', f);
handleNavigate(query);
}
}) as CustomChipProps
)}
/>
</div>
)}
</SearchBar>
)}
</Grid>

<Grid>
Expand Down
3 changes: 2 additions & 1 deletion src/components/routes/submission/detail/file_tree.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -155,7 +155,8 @@ const WrappedFileTree: React.FC<FileTreeProps> = ({ tree, sid, defaultForceShown
to={`/file/detail/${item.sha256}`}
onClick={e => {
e.preventDefault();
if (item.sha256) navigate(`/submission/detail/${sid}/${item.sha256}?name=${encodeURI(item.name[0])}`);
if (item.sha256)
navigate(`/submission/detail/${sid}/${item.sha256}?name=${encodeURIComponent(item.name[0])}`);
}}
sx={{
cursor: 'pointer',
Expand Down
2 changes: 1 addition & 1 deletion src/components/visual/FileDetail/childrens.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -61,7 +61,7 @@ const WrappedChildrenSection: React.FC<ChildrenSectionProps> = ({
<Box
key={i}
component={Link}
to={`/file/detail/${fileItem.sha256}?name=${encodeURI(fileItem.name)}`}
to={`/file/detail/${fileItem.sha256}?name=${encodeURIComponent(fileItem.name)}`}
sx={{
wordBreak: 'break-word',
color: 'inherit',
Expand Down
6 changes: 3 additions & 3 deletions src/components/visual/ResultCard/extracted_file.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -31,7 +31,7 @@ const WrappedExtractedFile: React.FC<Props> = ({ file, download = false, sid = n
<div style={{ marginRight: theme.spacing(1) }}>
{download ? (
<Link
href={`/api/v4/file/download/${file.sha256}/?${sid ? `sid=${sid}&` : ''}name=${encodeURI(file.name)}`}
href={`/api/v4/file/download/${file.sha256}/?${sid ? `sid=${sid}&` : ''}name=${encodeURIComponent(file.name)}`}
>
{file.name}
</Link>
Expand All @@ -40,8 +40,8 @@ const WrappedExtractedFile: React.FC<Props> = ({ file, download = false, sid = n
component={RouterLink}
to={
sid
? `/submission/detail/${sid}/${file.sha256}?name=${encodeURI(file.name)}`
: `/file/detail/${file.sha256}?name=${encodeURI(file.name)}`
? `/submission/detail/${sid}/${file.sha256}?name=${encodeURIComponent(file.name)}`
: `/file/detail/${file.sha256}?name=${encodeURIComponent(file.name)}`
}
>
{file.name}
Expand Down
Loading