refactor: move all the routes one leve so we can have pages without

layout

right now the layout is in the root of the app, so a solution to create
routes without the layout is to move all routes one level deeper

Closes #1010

dashboard/src/api/hardware.ts

@@ -32,7 +32,7 @@ export const useHardwareListing = (
   startTimestampInSeconds: number,
   endTimestampInSeconds: number,
 ): UseQueryResult<HardwareListingResponse> => {
-  const { origin } = useSearch({ from: '/hardware' });
+  const { origin } = useSearch({ from: '/_main/hardware' });
 
   const queryKey = [
     'hardwareListing',

dashboard/src/api/issue.ts

@@ -18,7 +18,7 @@ const fetchIssueListing = async (
 };
 
 export const useIssueListing = (): UseQueryResult<IssueListingResponse> => {
-  const { origin, intervalInDays } = useSearch({ from: '/issue' });
+  const { origin, intervalInDays } = useSearch({ from: '/_main/issue' });
 
   const queryKey = ['issueTable', origin, intervalInDays];
 

dashboard/src/api/tree.ts

@@ -27,7 +27,7 @@ export const useTreeTable = ({
 }: {
   enabled: boolean;
 }): UseQueryResult<Tree[]> => {
-  const { origin, intervalInDays } = useSearch({ from: '/tree' });
+  const { origin, intervalInDays } = useSearch({ from: '/_main/tree' });
 
   const queryKey = ['treeTable', origin, intervalInDays];
 
@@ -49,7 +49,7 @@ const fetchTreeFastCheckoutData = async (
 };
 
 export const useTreeTableFast = (): UseQueryResult<TreeFastPathResponse> => {
-  const { origin, intervalInDays } = useSearch({ from: '/tree' });
+  const { origin, intervalInDays } = useSearch({ from: '/_main/tree' });
 
   const queryKey = ['treeTableFast', origin, intervalInDays];
 

dashboard/src/api/treeDetails.ts

@@ -30,7 +30,7 @@ const useTreeSearchParameters = (): TreeSearchParameters => {
   const {
     origin,
     treeInfo: { gitUrl, gitBranch },
-  } = useSearch({ from: '/tree/$treeId' });
+  } = useSearch({ from: '/_main/tree/$treeId' });
 
   return { origin, gitUrl, gitBranch };
 };

dashboard/src/components/BuildDetails/BuildDetails.tsx

@@ -62,15 +62,15 @@ const BuildDetails = ({
   tableFilter,
   getTestTableRowLink,
 }: BuildDetailsProps): JSX.Element => {
-  const { buildId } = useParams({ from: '/build/$buildId' });
+  const { buildId } = useParams({ from: '/_main/build/$buildId' });
   const { data, isLoading, status, error } = useBuildDetails(buildId);
   const {
     data: issueData,
     status: issueStatus,
     error: issueError,
   } = useBuildIssues(buildId);
 
-  const { logOpen } = useSearch({ from: '/build/$buildId' });
+  const { logOpen } = useSearch({ from: '/_main/build/$buildId' });
   const navigate = useNavigate({ from: '/build/$buildId' });
   const { formatMessage } = useIntl();
 

dashboard/src/components/Cards/CompatibleHardware.tsx

@@ -23,7 +23,7 @@ const CompatibleLink = ({
   compatible: string;
   diffFilter: TFilter;
 }): JSX.Element => {
-  const { currentPageTab } = useSearch({ from: '/hardware/$hardwareId' });
+  const { currentPageTab } = useSearch({ from: '/_main/hardware/$hardwareId' });
   return (
     <FilterLink
       filterValue={compatible}

dashboard/src/components/Cards/HardwareUsed.tsx

@@ -23,7 +23,7 @@ const HardwareLink = ({
   hardware: string;
   diffFilter: TFilter;
 }): JSX.Element => {
-  const { currentPageTab } = useSearch({ from: '/tree/$treeId' });
+  const { currentPageTab } = useSearch({ from: '/_main/tree/$treeId' });
   return (
     <FilterLink
       filterValue={hardware}

dashboard/src/components/InputTime/InputTime.tsx

@@ -34,7 +34,9 @@ const InputTime = ({
 }): JSX.Element => {
   const { formatMessage } = useIntl();
   const navigate = useNavigate({ from: navigateFrom });
-  const { intervalInDays: interval } = useSearch({ from: navigateFrom });
+  const { intervalInDays: interval } = useSearch({
+    from: `/_main${navigateFrom}`,
+  });
 
   const InputTimeSchema = z.object({
     intervalInDays: z.string().refine(validateStringToNumber, {

dashboard/src/components/IssueDetails/IssueDetails.tsx

@@ -67,7 +67,7 @@ export const IssueDetails = ({
   getBuildTableRowLink,
   breadcrumb,
 }: IIssueDetails): JSX.Element => {
-  const { issueId } = useParams({ from: '/issue/$issueId' });
+  const { issueId } = useParams({ from: '/_main/issue/$issueId' });
   const { data, isLoading, status, error } = useIssueDetails(
     issueId,
     versionNumber,

dashboard/src/components/TestDetails/TestDetails.tsx

@@ -70,7 +70,7 @@ const TestDetailsSections = ({
 }): JSX.Element => {
   const { formatMessage } = useIntl();
   const historyState = useRouterState({ select: s => s.location.state });
-  const searchParams = useSearch({ from: '/test/$testId' });
+  const searchParams = useSearch({ from: '/_main/test/$testId' });
   const hardware: string = useMemo(() => {
     return getTestHardware({
       misc: test.environment_misc,
@@ -301,10 +301,10 @@ interface TestsDetailsProps {
 }
 
 const TestDetails = ({ breadcrumb }: TestsDetailsProps): JSX.Element => {
-  const { testId } = useParams({ from: '/test/$testId' });
+  const { testId } = useParams({ from: '/_main/test/$testId' });
 
   const { formatMessage } = useIntl();
-  const { logOpen } = useSearch({ from: '/test/$testId' });
+  const { logOpen } = useSearch({ from: '/_main/test/$testId' });
   const navigate = useNavigate({ from: '/test/$testId' });
 
   const { data, isLoading, status, error } = useTestDetails(testId ?? '');

dashboard/src/components/ui/badge.tsx

@@ -15,8 +15,10 @@ const badgeVariants = cva(
         destructive:
           'border-transparent bg-red-500 text-slate-50 hover:bg-red-500/80 dark:bg-red-900 dark:text-slate-50 dark:hover:bg-red-900/80',
         outline: 'text-slate-950 dark:text-slate-50',
-        blueTag: 'text-dark-blue outline-medium-light-blue border-none bg-light-blue font-medium capitalize outline-1',
-        greenTag: 'text-dark-green outline-medium-light-green border-none bg-light-green font-medium capitalize outline-1',
+        blueTag:
+          'text-dark-blue outline-medium-light-blue border-none bg-light-blue font-medium capitalize outline-1',
+        greenTag:
+          'text-dark-green outline-medium-light-green border-none bg-light-green font-medium capitalize outline-1',
       },
     },
     defaultVariants: {

dashboard/src/index.css

@@ -1,18 +1,35 @@
 @import 'tailwindcss';
 @import './tailwindcss-animate.css';
 
-
 @custom-variant dark (&:is(.dark *));
 
 @layer components {
   .starburst {
     clip-path: polygon(
-      100% 50%, 78.98% 57.76%, 93.3% 75%, 71.21% 71.21%,
-      75% 93.3%, 57.76% 78.98%, 50% 100%, 42.24% 78.98%,
-      25% 93.3%, 28.79% 71.21%, 6.7% 75%, 21.02% 57.76%,
-      0% 50%, 21.02% 42.24%, 6.7% 25%, 28.79% 28.79%,
-      25% 6.7%, 42.24% 21.02%, 50% 0%, 57.76% 21.02%,
-      75% 6.7%, 71.21% 28.79%, 93.3% 25%, 78.98% 42.24%
+      100% 50%,
+      78.98% 57.76%,
+      93.3% 75%,
+      71.21% 71.21%,
+      75% 93.3%,
+      57.76% 78.98%,
+      50% 100%,
+      42.24% 78.98%,
+      25% 93.3%,
+      28.79% 71.21%,
+      6.7% 75%,
+      21.02% 57.76%,
+      0% 50%,
+      21.02% 42.24%,
+      6.7% 25%,
+      28.79% 28.79%,
+      25% 6.7%,
+      42.24% 21.02%,
+      50% 0%,
+      57.76% 21.02%,
+      75% 6.7%,
+      71.21% 28.79%,
+      93.3% 25%,
+      78.98% 42.24%
     );
   }
 }
@@ -91,7 +108,7 @@
     border-color: var(--color-gray-200, currentColor);
   }
   button:not(:disabled),
-  [role="button"]:not(:disabled) {
+  [role='button']:not(:disabled) {
     cursor: pointer;
   }
 }

dashboard/src/pages/BuildDetails/BuildDetails.tsx

@@ -15,7 +15,7 @@ import TreeBuildDetails from '@/pages/TreeBuildDetails';
 import HardwareBuildDetails from '@/pages/HardwareBuildDetails';
 
 const BuildDetailsPage = (): JSX.Element => {
-  const searchParams = useSearch({ from: '/build/$buildId' });
+  const searchParams = useSearch({ from: '/_main/build/$buildId' });
   const navigate = useNavigate({ from: '/build/$buildId' });
   const historyState = useRouterState({ select: s => s.location.state });
 

dashboard/src/pages/Hardware/Hardware.tsx

@@ -12,7 +12,7 @@ import { MemoizedListingOGTags } from '@/components/OpenGraphTags/ListingOGTags'
 
 const Hardware = (): JSX.Element => {
   const { hardwareSearch } = useSearch({
-    from: '/hardware',
+    from: '/_main/hardware',
   });
 
   const navigate = useNavigate({ from: '/hardware' });

dashboard/src/pages/Hardware/HardwareListingPage.tsx

@@ -49,7 +49,7 @@ const useHardwareListingTime = (): {
   startTimestampInSeconds: number;
   endTimestampInSeconds: number;
 } => {
-  const { intervalInDays } = useSearch({ from: '/hardware' });
+  const { intervalInDays } = useSearch({ from: '/_main/hardware' });
   const [timestamps, setTimeStamps] = useState(() => {
     return calculateTimeStamp(intervalInDays);
   });

dashboard/src/pages/HardwareBuildDetails/HardwareBuildDetails.tsx

@@ -12,7 +12,7 @@ import { RedirectFrom } from '@/types/general';
 import { MemoizedHardwareBreadcrumb } from '@/components/Breadcrumb/HardwareBreadcrumb';
 
 const HardwareBuildDetails = (): JSX.Element => {
-  const searchParams = useSearch({ from: '/build/$buildId' });
+  const searchParams = useSearch({ from: '/_main/build/$buildId' });
   const historyState = useRouterState({ select: s => s.location.state });
   const hardwareId = historyState.id;
 

dashboard/src/pages/HardwareTestDetails/HardwareTestDetails.tsx

@@ -6,7 +6,7 @@ import TestDetails from '@/components/TestDetails/TestDetails';
 import { MemoizedHardwareBreadcrumb } from '@/components/Breadcrumb/HardwareBreadcrumb';
 
 const HardwareTestDetails = (): JSX.Element => {
-  const searchParams = useSearch({ from: '/test/$testId/' });
+  const searchParams = useSearch({ from: '/_main/test/$testId/' });
 
   return (
     <TestDetails

dashboard/src/pages/IssueDetails/IssueDetails.tsx

@@ -10,8 +10,6 @@ import { RedirectFrom } from '@/types/general';
 import { MemoizedTreeBreadcrumb } from '@/components/Breadcrumb/TreeBreadcrumb';
 import { MemoizedHardwareBreadcrumb } from '@/components/Breadcrumb/HardwareBreadcrumb';
 
-const ISSUE_ROUTE = '/issue/$issueId';
-
 const getBuildTableRowLink = (buildId: string): LinkProps => ({
   to: '/build/$buildId',
   params: {
@@ -31,8 +29,8 @@ const getTestTableRowLink = (testId: string): LinkProps => ({
 });
 
 const IssueDetailsPage = (): JSX.Element => {
-  const searchParams = useSearch({ from: ISSUE_ROUTE });
-  const navigate = useNavigate({ from: ISSUE_ROUTE });
+  const searchParams = useSearch({ from: '/_main/issue/$issueId' });
+  const navigate = useNavigate({ from: '/issue/$issueId' });
   const historyState = useRouterState({ select: s => s.location.state });
 
   const breadcrumbComponent = useMemo(() => {

dashboard/src/pages/TreeBuildDetails/TreeBuildDetails.tsx

@@ -12,7 +12,7 @@ import { RedirectFrom } from '@/types/general';
 import { MemoizedTreeBreadcrumb } from '@/components/Breadcrumb/TreeBreadcrumb';
 
 const TreeBuildDetails = (): JSX.Element => {
-  const searchParams = useSearch({ from: '/build/$buildId' });
+  const searchParams = useSearch({ from: '/_main/build/$buildId' });
   const historyState = useRouterState({ select: s => s.location.state });
   const treeId = historyState.id;
 

dashboard/src/pages/TreeDetails/Tabs/Boots/BootsTab.tsx

@@ -38,11 +38,11 @@ interface BootsTabProps {
 
 const BootsTab = ({ treeDetailsLazyLoaded }: BootsTabProps): JSX.Element => {
   const { treeId } = useParams({
-    from: '/tree/$treeId',
+    from: '/_main/tree/$treeId',
   });
 
   const { tableFilter, diffFilter } = useSearch({
-    from: '/tree/$treeId',
+    from: '/_main/tree/$treeId',
   });
 
   const currentPathFilter = diffFilter.bootPath

dashboard/src/pages/TreeDetails/Tabs/Build/BuildTab.tsx

@@ -67,10 +67,10 @@ const BuildTab = ({ treeDetailsLazyLoaded }: BuildTab): JSX.Element => {
   });
 
   const { diffFilter } = useSearch({
-    from: '/tree/$treeId',
+    from: '/_main/tree/$treeId',
   });
 
-  const { treeId } = useParams({ from: '/tree/$treeId' });
+  const { treeId } = useParams({ from: '/_main/tree/$treeId' });
 
   const summaryData = treeDetailsLazyLoaded.summary?.data?.summary.builds;
   const { data: fullData, status: fullStatus } = treeDetailsLazyLoaded.full;

dashboard/src/pages/TreeDetails/Tabs/Build/TreeDetailsBuildsTable.tsx

@@ -17,8 +17,8 @@ export interface TTreeDetailsBuildsTable {
 export function TreeDetailsBuildsTable({
   buildItems,
 }: TTreeDetailsBuildsTable): JSX.Element {
-  const { treeId } = useParams({ from: '/tree/$treeId' });
-  const { tableFilter } = useSearch({ from: '/tree/$treeId' });
+  const { treeId } = useParams({ from: '/_main/tree/$treeId' });
+  const { tableFilter } = useSearch({ from: '/_main/tree/$treeId' });
   const navigate = useNavigate({ from: '/tree/$treeId' });
 
   const getRowLink = useCallback(

dashboard/src/pages/TreeDetails/Tabs/Tests/TestsTab.tsx

@@ -39,15 +39,15 @@ interface TestsTabProps {
 }
 
 const TestsTab = ({ treeDetailsLazyLoaded }: TestsTabProps): JSX.Element => {
-  const { treeId } = useParams({ from: '/tree/$treeId' });
+  const { treeId } = useParams({ from: '/_main/tree/$treeId' });
 
   const { full: fullQuery, summary: summaryQuery } = treeDetailsLazyLoaded;
   const { data, status, isLoading: fullIsLoading } = fullQuery;
   const { isLoading: isSummaryLoading, error: summaryError } = summaryQuery;
   const summaryData = treeDetailsLazyLoaded.summary.data?.summary.tests;
 
   const { tableFilter, diffFilter } = useSearch({
-    from: '/tree/$treeId',
+    from: '/_main/tree/$treeId',
   });
 
   const currentPathFilter = diffFilter.testPath

dashboard/src/pages/TreeDetails/Tabs/TreeCommitNavigationGraph.tsx

@@ -10,10 +10,10 @@ const TreeCommitNavigationGraph = (): React.ReactNode => {
     currentPageTab,
     diffFilter,
     treeInfo: { gitUrl, gitBranch, headCommitHash },
-  } = useSearch({ from: '/tree/$treeId' });
+  } = useSearch({ from: '/_main/tree/$treeId' });
 
   const { treeId } = useParams({
-    from: '/tree/$treeId',
+    from: '/_main/tree/$treeId',
   });
 
   const navigate = useNavigate({

dashboard/src/pages/TreeDetails/Tabs/TreeDetailsTab.tsx

@@ -31,7 +31,7 @@ const TreeDetailsTab = ({
   treeDetailsLazyLoaded,
 }: ITreeDetailsTab): JSX.Element => {
   const { currentPageTab } = useSearch({
-    from: '/tree/$treeId',
+    from: '/_main/tree/$treeId',
   });
   const navigate = useNavigate({ from: '/tree/$treeId' });
   const treeDetailsTab: ITabItem[] = useMemo(

dashboard/src/pages/TreeDetails/TreeDetails.tsx

@@ -151,8 +151,8 @@ const TreeHeader = ({
 function TreeDetails(): JSX.Element {
   const { formatMessage } = useIntl();
 
-  const { treeId } = useParams({ from: '/tree/$treeId' });
-  const searchParams = useSearch({ from: '/tree/$treeId' });
+  const { treeId } = useParams({ from: '/_main/tree/$treeId' });
+  const searchParams = useSearch({ from: '/_main/tree/$treeId' });
   const { diffFilter, treeInfo } = searchParams;
   const navigate = useNavigate({ from: '/tree/$treeId' });
 

dashboard/src/pages/TreeLatest.tsx

@@ -17,9 +17,11 @@ import { MemoizedSectionError } from '@/components/DetailsPages/SectionError';
 import { Skeleton } from '@/components/Skeleton';
 
 export const TreeLatest = (): JSX.Element | void => {
-  const searchParams = useSearch({ from: '/tree/$treeName/$branch/' });
+  const searchParams = useSearch({ from: '/_main/tree/$treeName/$branch/' });
   const navigate = useNavigate();
-  const { treeName, branch } = useParams({ from: '/tree/$treeName/$branch/' });
+  const { treeName, branch } = useParams({
+    from: '/_main/tree/$treeName/$branch/',
+  });
   const { isLoading, data, error } = useTreeLatest(
     treeName,
     branch,

dashboard/src/pages/TreeTestDetails/TreeTestDetails.tsx

@@ -6,7 +6,7 @@ import TestDetails from '@/components/TestDetails/TestDetails';
 import { MemoizedTreeBreadcrumb } from '@/components/Breadcrumb/TreeBreadcrumb';
 
 const TreeTestDetails = (): JSX.Element => {
-  const searchParams = useSearch({ from: '/test/$testId/' });
+  const searchParams = useSearch({ from: '/_main/test/$testId/' });
 
   return (
     <TestDetails

dashboard/src/pages/hardwareDetails/HardwareDetails.tsx

@@ -103,11 +103,11 @@ function HardwareDetails(): JSX.Element {
     endTimestampInSeconds,
     diffFilter,
     origin,
-  } = useSearch({ from: '/hardware/$hardwareId' });
+  } = useSearch({ from: '/_main/hardware/$hardwareId' });
 
   const { formatMessage } = useIntl();
 
-  const { hardwareId } = useParams({ from: '/hardware/$hardwareId' });
+  const { hardwareId } = useParams({ from: '/_main/hardware/$hardwareId' });
 
   const navigate = useNavigate({ from: '/hardware/$hardwareId' });
 

dashboard/src/pages/hardwareDetails/HardwareDetailsHeaderTable.tsx

@@ -81,7 +81,7 @@ const CommitSelector = ({
   setTreeIndexesLength: IHardwareHeader['setTreeIndexesLength'];
 }): JSX.Element => {
   const navigate = useNavigate({ from: '/hardware/$hardwareId/' });
-  const { treeCommits } = useSearch({ from: '/hardware/$hardwareId' });
+  const { treeCommits } = useSearch({ from: '/_main/hardware/$hardwareId' });
 
   const navigateToThePast = useCallback(
     (commitHash: string) => {