Fix zero logs redirect, update badges

src/App.tsx

@@ -154,6 +154,7 @@ const App = ({ ui, navigation, tuneData }: { ui: UIState, navigation: Navigation
           <Route path={Routes.TUNE_LOGS} element={<ContentFor marginLeft={margin} element={<Logs />} />} />
           <Route path={Routes.TUNE_LOGS_FILE} element={<ContentFor marginLeft={margin} element={<Logs />} />} />
           <Route path={Routes.TUNE_DIAGNOSE} element={<ContentFor marginLeft={margin} element={<Diagnose />} />} />
+          <Route path={Routes.TUNE_DIAGNOSE_FILE} element={<ContentFor marginLeft={margin} element={<Diagnose />} />} />
           <Route path={`${Routes.UPLOAD}/*`} element={<ContentFor element={<Upload />} />} />
 
           <Route path={Routes.LOGIN} element={<ContentFor element={<Login formRole={FormRoles.LOGIN} />} />} />

src/components/TopBar.tsx

@@ -68,6 +68,7 @@ const TopBar = ({ tuneId, hasLogs, hasToothLogs }: { tuneId: string | null; hasL
   const tuneRootMatch = useMatch(`${Routes.TUNE_ROOT}/*`);
   const tuneTuneMatch = useMatch(`${Routes.TUNE_TUNE}/*`);
   const tuneLogMatch = useMatch(`${Routes.TUNE_LOGS}/*`);
+  const toothLogMatch = useMatch(`${Routes.TUNE_DIAGNOSE}/*`);
   const tabMatch = useMatch(`${Routes.TUNE_TAB}/*`);
   const uploadMatch = useMatch(Routes.UPLOAD);
   const hubMatch = useMatch(Routes.HUB);
@@ -96,7 +97,7 @@ const TopBar = ({ tuneId, hasLogs, hasToothLogs }: { tuneId: string | null; hasL
     <Col span={16} md={16} sm={16}>
       <Radio.Group
         key={pathname}
-        defaultValue={tuneLogMatch?.pathnameBase || tuneTuneMatch?.pathnameBase || tabMatch?.pathname || tuneRootMatch?.pathname || hubPathMatch?.pathname}
+        defaultValue={tuneLogMatch?.pathnameBase || toothLogMatch?.pathnameBase || tuneTuneMatch?.pathnameBase || tabMatch?.pathname || tuneRootMatch?.pathname || hubPathMatch?.pathname}
         optionType="button"
         buttonStyle="solid"
         onChange={(e) => navigate(e.target.value)}
@@ -133,7 +134,7 @@ const TopBar = ({ tuneId, hasLogs, hasToothLogs }: { tuneId: string | null; hasL
         </Radio.Button>
       </Radio.Group>
     </Col>
-  ), [pathname, tuneLogMatch?.pathnameBase, tuneTuneMatch?.pathnameBase, tabMatch?.pathname, tuneRootMatch?.pathname, hubPathMatch?.pathname, buildTuneUrl, lg, hasLogs, hasToothLogs, navigate]);
+  ), [pathname, tuneLogMatch?.pathnameBase, toothLogMatch?.pathnameBase, tuneTuneMatch?.pathnameBase, tabMatch?.pathname, tuneRootMatch?.pathname, hubPathMatch?.pathname, buildTuneUrl, lg, hasLogs, hasToothLogs, navigate]);
 
   const rightMenuColProps = tuneId ? {
     span: 8,

src/pages/Diagnose.tsx

@@ -154,7 +154,11 @@ const Diagnose = ({ ui, config, loadedLogs }: { ui: UIState, config: ConfigState
             style={{ marginLeft: 20 }}
             items={[
               {
-                label: <><FileTextOutlined /><Badge size="small" style={badgeStyle} count={2} /></>,
+                label: (
+                  <Badge size="small" style={badgeStyle} count={1} offset={[10, -3]}>
+                    <FileTextOutlined />Files
+                  </Badge>
+                ),
                 key: 'files',
                 children: (
                   <PerfectScrollbar options={{ suppressScrollX: true }}>

src/pages/Logs.tsx

@@ -172,6 +172,13 @@ const Logs = ({
     const loadData = async () => {
       const logFileName = routeMatch?.params.fileName!;
 
+      // user didn't upload any logs
+      if (tuneData && (tuneData.logFiles || []).length === 0) {
+        navigate(Routes.HUB);
+
+        return;
+      }
+
       try {
         const raw = await fetchLogFileWithProgress(tuneData.id, logFileName, (percent, total, edge) => {
           setProgress(percent);
@@ -218,13 +225,6 @@ const Logs = ({
       }
     };
 
-    // user didn't upload any logs
-    if (tuneData && (tuneData.logFiles || []).length === 0) {
-      navigate(Routes.HUB);
-
-      return undefined;
-    }
-
     // user navigated to logs root page
     if (!routeMatch?.params.fileName && tuneData.logFiles?.length) {
       // either redirect to the first log or to the latest selected
@@ -278,7 +278,11 @@ const Logs = ({
             style={{ marginLeft: 20 }}
             items={[
               {
-                label: <><EditOutlined /><Badge size="small" style={badgeStyle} count={fields.length} /></>,
+                label: (
+                  <Badge size="small" style={badgeStyle} count={fields.length} offset={[10, -3]}>
+                    <EditOutlined />Fields
+                  </Badge>
+                ),
                 key: 'fields',
                 children: (
                   <>
@@ -313,7 +317,11 @@ const Logs = ({
                 ),
               },
               {
-                label: <><FileTextOutlined /><Badge size="small" style={badgeStyle} count={tuneData.logFiles?.length} /></>,
+                label: (
+                  <Badge size="small" style={badgeStyle} count={tuneData.logFiles?.length} offset={[10, -3]}>
+                    <FileTextOutlined />Files
+                  </Badge>
+                ),
                 key: 'files',
                 children: (
                   <PerfectScrollbar options={{ suppressScrollX: true }}>

src/routes.ts

@@ -10,6 +10,7 @@ export enum Routes {
   TUNE_LOGS = '/t/:tuneId/logs',
   TUNE_LOGS_FILE = '/t/:tuneId/logs/:fileName',
   TUNE_DIAGNOSE = '/t/:tuneId/diagnose',
+  TUNE_DIAGNOSE_FILE = '/t/:tuneId/diagnose/:fileName',
 
   UPLOAD = '/upload',
   UPLOAD_WITH_TUNE_ID = '/upload/:tuneId',