diff --git a/dashboard/src/components/BuildDetails/BuildDetails.tsx b/dashboard/src/components/BuildDetails/BuildDetails.tsx
index 33794194..bf23fe48 100644
--- a/dashboard/src/components/BuildDetails/BuildDetails.tsx
+++ b/dashboard/src/components/BuildDetails/BuildDetails.tsx
@@ -1,6 +1,6 @@
 import { ImTree } from 'react-icons/im';
 
-import { MdClose, MdCheck, MdFolderOpen } from 'react-icons/md';
+import { MdClose, MdCheck } from 'react-icons/md';
 
 import { useIntl } from 'react-intl';
 import { ErrorBoundary } from 'react-error-boundary';
@@ -41,11 +41,9 @@ import { getFilesSection } from '@/components/Section/FilesSection';
 import QuerySwitcher from '@/components/QuerySwitcher/QuerySwitcher';
 import { MemoizedSectionError } from '@/components/DetailsPages/SectionError';
 
-import BuildDetailsTestSection from './BuildDetailsTestSection';
+import { BlueFolderIcon } from '@/components/Icons/BlueFolder';
 
-const BlueFolderIcon = (): JSX.Element => (
-  <MdFolderOpen className="text-blue" />
-);
+import BuildDetailsTestSection from './BuildDetailsTestSection';
 
 interface BuildDetailsProps {
   breadcrumb?: JSX.Element;
diff --git a/dashboard/src/components/Icons/BlueFolder.tsx b/dashboard/src/components/Icons/BlueFolder.tsx
new file mode 100644
index 00000000..626ed1b1
--- /dev/null
+++ b/dashboard/src/components/Icons/BlueFolder.tsx
@@ -0,0 +1,5 @@
+import { MdFolderOpen } from 'react-icons/md';
+
+export const BlueFolderIcon = (): JSX.Element => (
+  <MdFolderOpen className="text-blue" />
+);
diff --git a/dashboard/src/components/Section/MiscSection.tsx b/dashboard/src/components/Section/MiscSection.tsx
index 490949f9..f3193727 100644
--- a/dashboard/src/components/Section/MiscSection.tsx
+++ b/dashboard/src/components/Section/MiscSection.tsx
@@ -1,7 +1,5 @@
 import { type Dispatch, type SetStateAction } from 'react';
 
-import { MdFolderOpen } from 'react-icons/md';
-
 import type {
   IJsonContent,
   SheetType,
@@ -13,11 +11,9 @@ import { TruncatedValueTooltip } from '@/components/Tooltip/TruncatedValueToolti
 
 import { SheetTrigger } from '@/components/Sheet';
 
-import type { ISection, SubsectionLink } from './Section';
+import { BlueFolderIcon } from '@/components/Icons/BlueFolder';
 
-const BlueFolderIcon = (): JSX.Element => (
-  <MdFolderOpen className="text-blue" />
-);
+import type { ISection, SubsectionLink } from './Section';
 
 export const getMiscSection = ({
   misc,
diff --git a/dashboard/src/components/TestDetails/TestDetails.tsx b/dashboard/src/components/TestDetails/TestDetails.tsx
index 5c5b6c74..4166550a 100644
--- a/dashboard/src/components/TestDetails/TestDetails.tsx
+++ b/dashboard/src/components/TestDetails/TestDetails.tsx
@@ -6,7 +6,6 @@ import { useCallback, useMemo, useState } from 'react';
 import type { Dispatch, SetStateAction } from 'react';
 
 import { PiComputerTowerThin } from 'react-icons/pi';
-import { MdFolderOpen } from 'react-icons/md';
 
 import { Link, useRouterState, useSearch } from '@tanstack/react-router';
 
@@ -34,6 +33,7 @@ import { getFilesSection } from '@/components/Section/FilesSection';
 import { TruncatedValueTooltip } from '@/components/Tooltip/TruncatedValueTooltip';
 import QuerySwitcher from '@/components/QuerySwitcher/QuerySwitcher';
 import { MemoizedSectionError } from '@/components/DetailsPages/SectionError';
+import { BlueFolderIcon } from '@/components/Icons/BlueFolder';
 
 const TestDetailsSections = ({
   test,
@@ -115,9 +115,7 @@ const TestDetailsSections = ({
             },
             {
               title: 'global.logs',
-              icon: hasUsefulLogInfo ? (
-                <MdFolderOpen className="text-blue" />
-              ) : undefined,
+              icon: hasUsefulLogInfo ? <BlueFolderIcon /> : undefined,
               linkText: shouldTruncate(valueOrEmpty(test.log_url)) ? (
                 <TruncatedValueTooltip value={test.log_url} isUrl={true} />
               ) : (