diff --git a/dashboard/src/components/BuildDetails/BuildDetails.tsx b/dashboard/src/components/BuildDetails/BuildDetails.tsx index 85318fd9..ac5f3900 100644 --- a/dashboard/src/components/BuildDetails/BuildDetails.tsx +++ b/dashboard/src/components/BuildDetails/BuildDetails.tsx @@ -20,7 +20,7 @@ import IssueSection from '@/components/Issue/IssueSection'; import { shouldTruncate, valueOrEmpty } from '@/lib/string'; -import { Sheet, SheetTrigger } from '@/components/Sheet'; +import { Sheet } from '@/components/Sheet'; import type { TableFilter, @@ -40,12 +40,12 @@ import { getFilesSection } from '@/components/Section/FilesSection'; import QuerySwitcher from '@/components/QuerySwitcher/QuerySwitcher'; import { MemoizedSectionError } from '@/components/DetailsPages/SectionError'; -import { LogViewIcon } from '@/components/Icons/LogView'; import { StatusIcon } from '@/components/Icons/StatusIcons'; import PageWithTitle from '@/components/PageWithTitle'; import { MemoizedBuildDetailsOGTags } from '@/components/OpenGraphTags/BuildDetailsOGTags'; +import ButtonOpenLogSheet from '@/components/Button/ButtonOpenLogSheet'; import BuildDetailsTestSection from './BuildDetailsTestSection'; @@ -74,8 +74,6 @@ const BuildDetails = ({ const navigate = useNavigate({ from: '/build/$buildId' }); const { formatMessage } = useIntl(); - const hasUsefulLogInfo = data?.log_url || data?.log_excerpt; - const [sheetType, setSheetType] = useState('log'); const [jsonContent, setJsonContent] = useState(); const logOpenChange = useCallback( @@ -124,6 +122,7 @@ const BuildDetails = ({ return [ { title: buildDetailsTitle, + subtitle: , leftIcon: , eyebrow: formatMessage({ id: 'buildDetails.buildDetails' }), subsections: [ @@ -206,9 +205,7 @@ const BuildDetails = ({ linkText: ( ), - icon: hasUsefulLogInfo ? : undefined, - wrapperComponent: hasUsefulLogInfo ? SheetTrigger : undefined, - onClick: hasUsefulLogInfo ? setSheetToLog : undefined, + link: data.log_url, }, { title: 'buildDetails.kernelConfig', @@ -222,14 +219,7 @@ const BuildDetails = ({ ], }, ]; - }, [ - data, - buildDetailsTitle, - formatMessage, - buildId, - hasUsefulLogInfo, - setSheetToLog, - ]); + }, [data, buildDetailsTitle, setSheetToLog, formatMessage, buildId]); const sectionsData: ISection[] = useMemo(() => { return [...generalSections, miscSection, filesSection].filter( @@ -282,6 +272,7 @@ const BuildDetails = ({ diff --git a/dashboard/src/components/Button/ButtonOpenLogSheet.tsx b/dashboard/src/components/Button/ButtonOpenLogSheet.tsx new file mode 100644 index 00000000..e83b300a --- /dev/null +++ b/dashboard/src/components/Button/ButtonOpenLogSheet.tsx @@ -0,0 +1,22 @@ +import type { JSX } from 'react'; + +import { FormattedMessage } from 'react-intl'; + +import { SheetTrigger } from '@/components/Sheet'; +import { SearchIcon } from '@/components/Icons/SearchIcon'; + +const ButtonOpenLogSheet = ({ + setSheetToLog, +}: { + setSheetToLog: () => void; +}): JSX.Element => ( + + + + +); + +export default ButtonOpenLogSheet; diff --git a/dashboard/src/components/Icons/LogView.tsx b/dashboard/src/components/Icons/LogView.tsx deleted file mode 100644 index dd2c10ab..00000000 --- a/dashboard/src/components/Icons/LogView.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import { MdOutlineFileOpen } from 'react-icons/md'; - -import { FormattedMessage } from 'react-intl'; - -import type { JSX } from 'react'; - -import { Tooltip, TooltipTrigger, TooltipContent } from '@/components/Tooltip'; - -export const LogViewIcon = (): JSX.Element => ( - - - - - - - - -); diff --git a/dashboard/src/components/Icons/SearchIcon.tsx b/dashboard/src/components/Icons/SearchIcon.tsx new file mode 100644 index 00000000..5feaf275 --- /dev/null +++ b/dashboard/src/components/Icons/SearchIcon.tsx @@ -0,0 +1,7 @@ +import { MdOutlineSearch } from 'react-icons/md'; + +import type { JSX } from 'react'; + +export const SearchIcon = (): JSX.Element => ( + +); diff --git a/dashboard/src/components/Sheet/LogOrJsonSheetContent.tsx b/dashboard/src/components/Sheet/LogOrJsonSheetContent.tsx index 061789c4..9db49615 100644 --- a/dashboard/src/components/Sheet/LogOrJsonSheetContent.tsx +++ b/dashboard/src/components/Sheet/LogOrJsonSheetContent.tsx @@ -26,6 +26,7 @@ interface ILogSheet { navigationLogsActions?: TNavigationLogActions; currentLinkProps?: LinkProps; issues?: TIssue[]; + hideIssueSection?: boolean; status?: UseQueryResult['status']; error?: UseQueryResult['error']; } @@ -43,6 +44,7 @@ export const LogOrJsonSheetContent = ({ navigationLogsActions, currentLinkProps, issues, + hideIssueSection, status, error, }: ILogSheet): JSX.Element => { @@ -66,12 +68,15 @@ export const LogOrJsonSheetContent = ({ logExcerpt={logExcerpt} isLoading={navigationLogsActions?.isLoading} /> - + + {!hideIssueSection && ( + + )} ) : ( { return ( @@ -129,8 +129,6 @@ const TestDetailsSections = ({ test.tree_name, ]); - const hasUsefulLogInfo = test.log_url || test.log_excerpt; - const setSheetToLog = useCallback( (): void => setSheetType('log'), [setSheetType], @@ -139,6 +137,7 @@ const TestDetailsSections = ({ const generalSection: ISection = useMemo(() => { return { title: test.path, + subtitle: , eyebrow: formatMessage({ id: 'test.details' }), leftIcon: , subsections: [ @@ -167,14 +166,12 @@ const TestDetailsSections = ({ }, { title: 'global.logs', - icon: hasUsefulLogInfo ? : undefined, linkText: shouldTruncate(valueOrEmpty(test.log_url)) ? ( ) : ( valueOrEmpty(test.log_url) ), - wrapperComponent: hasUsefulLogInfo ? SheetTrigger : undefined, - onClick: hasUsefulLogInfo ? setSheetToLog : undefined, + link: test.log_url, }, { title: 'commonDetails.gitCommitHash', @@ -252,7 +249,6 @@ const TestDetailsSections = ({ test.id, test.environment_compatible, formatMessage, - hasUsefulLogInfo, setSheetToLog, treeDetailsLink, buildDetailsLink, @@ -368,6 +364,7 @@ const TestDetails = ({ breadcrumb }: TestsDetailsProps): JSX.Element => { type={sheetType} jsonContent={jsonContent} logUrl={data?.log_url} + hideIssueSection logExcerpt={data?.log_excerpt} /> diff --git a/dashboard/src/locales/messages/index.ts b/dashboard/src/locales/messages/index.ts index f22b2d4b..42d72407 100644 --- a/dashboard/src/locales/messages/index.ts +++ b/dashboard/src/locales/messages/index.ts @@ -181,7 +181,7 @@ export const messages = { 'global.unknown': 'Unknown', 'global.url': 'URL', 'global.viewJson': 'View Json', - 'global.viewLog': 'View Log', + 'global.viewLog': 'View Log Excerpt', 'global.warning': 'Warning', 'globalDetails.artifacts': 'Artifacts', 'globalDetails.environmentMiscData': 'Environment Misc Data',