From 33eb69664111f88832a0795ccf7a638bfdfb6b38 Mon Sep 17 00:00:00 2001
From: Vladimir Potekhin <vladimir.potekh@gmail.com>
Date: Tue, 8 Oct 2024 17:32:38 +0300
Subject: [PATCH] chore: temporary change nav

---
 .../src/components/app/app.routes.ts          | 67 ++++++++---------
 .../common-page/common-page.component.html    |  8 ++-
 .../common-page/common-page.component.less    |  8 ++-
 .../dashboards-list.component.html            | 13 ----
 .../dashboards-list.component.ts              | 46 ------------
 .../src/components/list/list.component.html   | 28 ++++++++
 .../list.component.less}                      |  1 -
 .../src/components/list/list.component.ts     | 72 +++++++++++++++++++
 .../navigation/navigation.component.html      | 14 ++--
 .../dashboards/crypto/crypto.component.html   | 15 ++++
 .../src/dashboards/crypto/crypto.component.ts |  9 +++
 .../dashboards/dashboards.component.html      | 16 -----
 .../dashboards/dashboards.component.ts        | 40 -----------
 .../cleaning.component.html                   |  0
 .../cleaning.component.less                   |  0
 .../cleaning.component.ts                     |  0
 .../cleaning.service.ts                       |  0
 .../{Cost => cost}/cost.component.html        |  0
 .../{Cost => cost}/cost.component.less        |  0
 .../{Cost => cost}/cost.component.ts          |  0
 .../components/{Cost => cost}/cost.service.ts |  0
 .../lighting.component.html                   |  0
 .../lighting.component.less                   |  0
 .../lighting.component.ts                     |  0
 .../lighting.service.ts                       |  0
 .../{Safety => safety}/safety.component.html  |  0
 .../{Safety => safety}/safety.component.less  |  0
 .../{Safety => safety}/safety.component.ts    |  0
 .../{Safety => safety}/safety.service.ts      |  0
 .../src/dashboards/iot/iot.component.html     | 15 ++++
 .../src/dashboards/iot/iot.component.ts       | 17 +++--
 31 files changed, 197 insertions(+), 172 deletions(-)
 delete mode 100644 apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.html
 delete mode 100644 apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.ts
 create mode 100644 apps/taiga-lumbermill/src/components/list/list.component.html
 rename apps/taiga-lumbermill/src/components/{dashboards-list/dashboards-list.component.less => list/list.component.less} (75%)
 create mode 100644 apps/taiga-lumbermill/src/components/list/list.component.ts
 delete mode 100644 apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.html
 delete mode 100644 apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.ts
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cleaning => cleaning}/cleaning.component.html (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cleaning => cleaning}/cleaning.component.less (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cleaning => cleaning}/cleaning.component.ts (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cleaning => cleaning}/cleaning.service.ts (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cost => cost}/cost.component.html (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cost => cost}/cost.component.less (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cost => cost}/cost.component.ts (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Cost => cost}/cost.service.ts (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Lighting => lighting}/lighting.component.html (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Lighting => lighting}/lighting.component.less (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Lighting => lighting}/lighting.component.ts (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Lighting => lighting}/lighting.service.ts (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Safety => safety}/safety.component.html (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Safety => safety}/safety.component.less (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Safety => safety}/safety.component.ts (100%)
 rename apps/taiga-lumbermill/src/dashboards/iot/components/{Safety => safety}/safety.service.ts (100%)

diff --git a/apps/taiga-lumbermill/src/components/app/app.routes.ts b/apps/taiga-lumbermill/src/components/app/app.routes.ts
index bbbf3921b..e28a3502f 100644
--- a/apps/taiga-lumbermill/src/components/app/app.routes.ts
+++ b/apps/taiga-lumbermill/src/components/app/app.routes.ts
@@ -4,63 +4,54 @@ export const appRoutes: Route[] = [
     {
         path: 'dashboards',
         loadComponent: async () =>
-            import('../../dashboards/dashboards/dashboards.component').then(
-                (mod) => mod.DashboardsComponent,
-            ),
-        children: [
-            {
-                path: '',
-                loadComponent: async () =>
-                    import(
-                        '../../components/dashboards-list/dashboards-list.component'
-                    ).then((mod) => mod.DashboardsListComponent),
-                data: {title: ''},
-            },
-            {
-                path: 'iot',
-                loadComponent: async () =>
-                    import('../../dashboards/iot/iot.component').then(
-                        (mod) => mod.IotComponent,
-                    ),
-                data: {title: 'Iot'},
-            },
-            {
-                path: 'crypto',
-                loadComponent: async () =>
-                    import('../../dashboards/crypto/crypto.component').then(
-                        (mod) => mod.CryptoComponent,
-                    ),
-                data: {title: 'Crypto'},
-            },
-        ],
+            import('../list/list.component').then((mod) => mod.ListComponent),
     },
     {
-        path: 'theme',
+        path: 'dashboards/iot',
         loadComponent: async () =>
-            import('../../features/theme-generator/theme-generator.component').then(
-                (mod) => mod.ThemeGeneratorComponent,
-            ),
+            import('../../dashboards/iot/iot.component').then((mod) => mod.IotComponent),
+        data: {title: 'Iot'},
     },
     {
-        path: '',
+        path: 'dashboards/crypto',
         loadComponent: async () =>
-            import('../../components/common-page/common-page.component').then(
-                (mod) => mod.CommonPageComponent,
+            import('../../dashboards/crypto/crypto.component').then(
+                (mod) => mod.CryptoComponent,
             ),
+        data: {title: 'Crypto'},
+    },
+    {
+        path: 'pages',
+        loadComponent: async () =>
+            import('../list/list.component').then((mod) => mod.ListComponent),
     },
     {
-        path: 'login',
+        path: 'pages/login',
         loadComponent: async () =>
             import('../../features/login/login.component').then(
                 (mod) => mod.LoginComponent,
             ),
     },
     {
-        path: 'sign-up',
+        path: 'pages/sign-up',
         loadComponent: async () =>
             import('../../features/sign-up/sign-up.component').then(
                 (mod) => mod.SignUpComponent,
             ),
     },
+    {
+        path: 'color-generator',
+        loadComponent: async () =>
+            import('../../features/theme-generator/theme-generator.component').then(
+                (mod) => mod.ThemeGeneratorComponent,
+            ),
+    },
+    {
+        path: '',
+        loadComponent: async () =>
+            import('../../components/common-page/common-page.component').then(
+                (mod) => mod.CommonPageComponent,
+            ),
+    },
     {path: '**', redirectTo: 'dashboards'},
 ];
diff --git a/apps/taiga-lumbermill/src/components/common-page/common-page.component.html b/apps/taiga-lumbermill/src/components/common-page/common-page.component.html
index aadeef231..797cbdf81 100644
--- a/apps/taiga-lumbermill/src/components/common-page/common-page.component.html
+++ b/apps/taiga-lumbermill/src/components/common-page/common-page.component.html
@@ -46,9 +46,11 @@ <h2 tuiTitle>
         </div>
     </button>
 
-    <div
+    <button
+        routerLink="/pages"
         tuiCardLarge
         tuiSurface="elevated"
+        type="button"
     >
         <tui-avatar
             appearance="opposite"
@@ -58,10 +60,10 @@ <h2 tuiTitle>
             Pages
             <div tuiSubtitle>Some common pages such as login, registration</div>
         </div>
-    </div>
+    </button>
 
     <button
-        routerLink="/theme"
+        routerLink="/color-generator"
         tuiCardLarge
         tuiSurface="elevated"
         type="button"
diff --git a/apps/taiga-lumbermill/src/components/common-page/common-page.component.less b/apps/taiga-lumbermill/src/components/common-page/common-page.component.less
index 0f87f1595..05569cba6 100644
--- a/apps/taiga-lumbermill/src/components/common-page/common-page.component.less
+++ b/apps/taiga-lumbermill/src/components/common-page/common-page.component.less
@@ -22,10 +22,14 @@
     align-items: baseline;
     justify-content: space-evenly;
     flex-wrap: wrap;
-    margin-top: 5rem;
+    margin-top: 3rem;
     gap: 1rem;
 
     [tuiCardLarge] {
-        inline-size: 25rem;
+        inline-size: 100%;
+
+        :host-context([data-platform='web']) & {
+            inline-size: 25rem;
+        }
     }
 }
diff --git a/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.html b/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.html
deleted file mode 100644
index ea97eae35..000000000
--- a/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.html
+++ /dev/null
@@ -1,13 +0,0 @@
-@for (card of dashboardsListData; track $index) {
-    <a
-        tuiCardLarge
-        tuiHeader
-        tuiSurface="elevated"
-        [routerLink]="card.link"
-    >
-        <h2 tuiTitle>
-            {{ card.title }}
-            <span tuiSubtitle>{{ card.description }}</span>
-        </h2>
-    </a>
-}
diff --git a/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.ts b/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.ts
deleted file mode 100644
index 66b7c07af..000000000
--- a/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.ts
+++ /dev/null
@@ -1,46 +0,0 @@
-import {CommonModule} from '@angular/common';
-import {ChangeDetectionStrategy, Component} from '@angular/core';
-import {RouterLink} from '@angular/router';
-import {TuiIcon, TuiSurface, TuiTitle} from '@taiga-ui/core';
-import {TuiCardLarge, TuiHeader, TuiNavigation} from '@taiga-ui/layout';
-
-interface DashboardsData {
-    readonly title: string;
-    readonly link: string;
-    readonly description: string;
-}
-
-export const INITIAL_DATA: DashboardsData[] = [
-    {
-        title: 'Iot Dashboard',
-        link: '/dashboards/iot',
-        description: 'Smart home dashboard',
-    },
-    {
-        title: 'Crypto Dashboard',
-        link: '/dashboards/crypto',
-        description: 'Crypto token dashboard',
-    },
-];
-
-@Component({
-    standalone: true,
-    selector: 'lmb-dashboards-list',
-    imports: [
-        CommonModule,
-        RouterLink,
-        TuiCardLarge,
-        TuiHeader,
-        TuiIcon,
-        TuiIcon,
-        TuiNavigation,
-        TuiSurface,
-        TuiTitle,
-    ],
-    templateUrl: './dashboards-list.component.html',
-    styleUrl: './dashboards-list.component.less',
-    changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class DashboardsListComponent {
-    protected dashboardsListData = INITIAL_DATA;
-}
diff --git a/apps/taiga-lumbermill/src/components/list/list.component.html b/apps/taiga-lumbermill/src/components/list/list.component.html
new file mode 100644
index 000000000..aa6e4f18d
--- /dev/null
+++ b/apps/taiga-lumbermill/src/components/list/list.component.html
@@ -0,0 +1,28 @@
+<nav
+    tuiNavigationNav
+    [style.position]="'sticky'"
+>
+    <a routerLink="/">
+        <tui-icon icon="@tui.chevron-left" />
+        Back
+    </a>
+    /
+    <span tuiNavigationLogo>
+        <span tuiFade>{{ type() }}</span>
+    </span>
+    <hr />
+</nav>
+
+@for (card of list(); track $index) {
+    <a
+        tuiCardLarge
+        tuiHeader
+        tuiSurface="elevated"
+        [routerLink]="card.link"
+    >
+        <h2 tuiTitle>
+            {{ card.title }}
+            <span tuiSubtitle>{{ card.description }}</span>
+        </h2>
+    </a>
+}
diff --git a/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.less b/apps/taiga-lumbermill/src/components/list/list.component.less
similarity index 75%
rename from apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.less
rename to apps/taiga-lumbermill/src/components/list/list.component.less
index bc2f6e4d6..23d25a3bb 100644
--- a/apps/taiga-lumbermill/src/components/dashboards-list/dashboards-list.component.less
+++ b/apps/taiga-lumbermill/src/components/list/list.component.less
@@ -1,6 +1,5 @@
 :host {
     display: flex;
-    padding-top: 1rem;
     flex-direction: column;
     gap: 1rem;
 }
diff --git a/apps/taiga-lumbermill/src/components/list/list.component.ts b/apps/taiga-lumbermill/src/components/list/list.component.ts
new file mode 100644
index 000000000..ea961af02
--- /dev/null
+++ b/apps/taiga-lumbermill/src/components/list/list.component.ts
@@ -0,0 +1,72 @@
+import {CommonModule} from '@angular/common';
+import {ChangeDetectionStrategy, Component, computed, inject} from '@angular/core';
+import {toSignal} from '@angular/core/rxjs-interop';
+import {NavigationEnd, Router, RouterLink, RouterOutlet} from '@angular/router';
+import {TuiIcon, TuiSurface, TuiTitle} from '@taiga-ui/core';
+import {TuiCardLarge, TuiHeader, TuiLogoComponent, TuiNavigation} from '@taiga-ui/layout';
+import {filter, map, startWith} from 'rxjs';
+
+interface CardData {
+    readonly title: string;
+    readonly link: string;
+    readonly description: string;
+}
+
+const LIST: {Dashboards: CardData[]; Pages: CardData[]} = {
+    Dashboards: [
+        {
+            title: 'Iot Dashboard',
+            link: '/dashboards/iot',
+            description: 'Smart home dashboard',
+        },
+        {
+            title: 'Crypto Dashboard',
+            link: '/dashboards/crypto',
+            description: 'Crypto token dashboard',
+        },
+    ],
+    Pages: [
+        {
+            title: 'Login',
+            link: '/pages/login',
+            description: 'Ready to use login page',
+        },
+        {
+            title: 'Sign up',
+            link: '/pages/login',
+            description: 'Ready to use registration page',
+        },
+    ],
+};
+
+@Component({
+    standalone: true,
+    selector: 'lmb-dashboards-list',
+    imports: [
+        CommonModule,
+        RouterLink,
+        RouterOutlet,
+        TuiCardLarge,
+        TuiHeader,
+        TuiIcon,
+        TuiLogoComponent,
+        TuiNavigation,
+        TuiSurface,
+        TuiTitle,
+    ],
+    templateUrl: './list.component.html',
+    styleUrl: './list.component.less',
+    changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class ListComponent {
+    protected readonly router = inject(Router);
+    protected readonly type = toSignal(
+        this.router.events.pipe(
+            filter((event) => event instanceof NavigationEnd),
+            startWith(null),
+            map(() => (this.router.url.includes('dashboards') ? 'Dashboards' : 'Pages')),
+        ),
+    );
+
+    protected readonly list = computed(() => LIST[this.type() ?? 'Pages']);
+}
diff --git a/apps/taiga-lumbermill/src/components/navigation/navigation.component.html b/apps/taiga-lumbermill/src/components/navigation/navigation.component.html
index 235ff9b8d..61d35aa79 100644
--- a/apps/taiga-lumbermill/src/components/navigation/navigation.component.html
+++ b/apps/taiga-lumbermill/src/components/navigation/navigation.component.html
@@ -15,7 +15,7 @@
             >
                 <button
                     iconStart="@tui.palette"
-                    routerLink="/theme"
+                    routerLink="/color-generator"
                     tuiOption
                     type="button"
                 >
@@ -39,7 +39,7 @@
                 </button>
                 <button
                     iconStart="@tui.log-in"
-                    routerLink="/theme"
+                    routerLink="/color-generator"
                     tuiOption
                     type="button"
                 >
@@ -47,7 +47,7 @@
                 </button>
                 <button
                     iconStart="@tui.key-round"
-                    routerLink="/theme"
+                    routerLink="/color-generator"
                     tuiOption
                     type="button"
                 >
@@ -60,7 +60,7 @@
         <img
             alt="logo"
             height="32px"
-            src="/logo-white-transparent.png"
+            src="./logo-white-transparent.png"
         />
         Taiga Lumbermill
     </span>
@@ -141,7 +141,7 @@
                 <ng-template>
                     <button
                         iconStart="@tui.log-in"
-                        routerLink="/login"
+                        routerLink="pages/login"
                         tuiAsideItem
                         type="button"
                     >
@@ -149,7 +149,7 @@
                     </button>
                     <button
                         iconStart="@tui.key-round"
-                        routerLink="/sign-up"
+                        routerLink="pages/sign-up"
                         tuiAsideItem
                         type="button"
                     >
@@ -161,7 +161,7 @@
         <hr />
         <button
             iconStart="@tui.palette"
-            routerLink="/theme"
+            routerLink="/color-generator"
             tuiAsideItem
             type="button"
         >
diff --git a/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.html b/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.html
index 88471a962..d6b49cf15 100644
--- a/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.html
+++ b/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.html
@@ -1,3 +1,18 @@
+<nav
+    tuiNavigationNav
+    [style.position]="'sticky'"
+>
+    <a routerLink="/dashboards">
+        <tui-icon icon="@tui.chevron-left" />
+        Back
+    </a>
+    /
+    <span tuiNavigationLogo>
+        <span tuiFade>Crypto</span>
+    </span>
+    <hr />
+</nav>
+
 <div class="layout">
     <div class="left">
         <lmb-prices class="" />
diff --git a/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.ts b/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.ts
index 464ac2086..7f47e48aa 100644
--- a/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.ts
+++ b/apps/taiga-lumbermill/src/dashboards/crypto/crypto.component.ts
@@ -1,5 +1,9 @@
 import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
+import {RouterLink} from '@angular/router';
+import {TuiIcon} from '@taiga-ui/core';
+import {TuiFade} from '@taiga-ui/kit';
+import {TuiLogoComponent, TuiNavigation} from '@taiga-ui/layout';
 
 import {MinterComponent} from './components/minter/minter.component';
 import {NFTComponent} from './components/nft/nft.component';
@@ -17,8 +21,13 @@ import {SwapComponent} from './components/swap/swap.component';
         NFTComponent,
         PoolsComponent,
         PricesComponent,
+        RouterLink,
         StakingComponent,
         SwapComponent,
+        TuiFade,
+        TuiIcon,
+        TuiLogoComponent,
+        TuiNavigation,
     ],
     templateUrl: './crypto.component.html',
     styleUrl: './crypto.component.less',
diff --git a/apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.html b/apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.html
deleted file mode 100644
index a81d5ab30..000000000
--- a/apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.html
+++ /dev/null
@@ -1,16 +0,0 @@
-<nav
-    tuiNavigationNav
-    [style.position]="'sticky'"
->
-    @let title = (data$ | async) ?? '';
-    <a [routerLink]="title ? '/dashboards' : '/'">
-        <tui-icon icon="@tui.chevron-left" />
-        Back
-    </a>
-    /
-    <span tuiNavigationLogo>
-        <span tuiFade>{{ title }} dashboard</span>
-    </span>
-    <hr />
-</nav>
-<router-outlet />
diff --git a/apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.ts b/apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.ts
deleted file mode 100644
index 74e189582..000000000
--- a/apps/taiga-lumbermill/src/dashboards/dashboards/dashboards.component.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import {AsyncPipe, CommonModule} from '@angular/common';
-import {ChangeDetectionStrategy, Component, inject} from '@angular/core';
-import {
-    ActivatedRoute,
-    ActivationEnd,
-    Router,
-    RouterLink,
-    RouterOutlet,
-} from '@angular/router';
-import {TuiIcon, TuiSurface, TuiTitle} from '@taiga-ui/core';
-import {TuiCardLarge, TuiHeader, TuiNavigation} from '@taiga-ui/layout';
-import {filter, map, startWith} from 'rxjs';
-
-@Component({
-    standalone: true,
-    selector: 'lmb-dashboards',
-    imports: [
-        AsyncPipe,
-        CommonModule,
-        RouterLink,
-        RouterOutlet,
-        TuiCardLarge,
-        TuiHeader,
-        TuiIcon,
-        TuiIcon,
-        TuiNavigation,
-        TuiSurface,
-        TuiTitle,
-    ],
-    templateUrl: './dashboards.component.html',
-    changeDetection: ChangeDetectionStrategy.OnPush,
-})
-export class DashboardsComponent {
-    private readonly activatedRoute = inject(ActivatedRoute);
-    protected data$ = inject(Router).events.pipe(
-        filter((e): e is ActivationEnd => e instanceof ActivationEnd),
-        map((event) => event.snapshot.firstChild?.data['title']),
-        startWith(this.activatedRoute.snapshot.firstChild?.data['title']),
-    );
-}
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.component.html b/apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.component.html
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.component.html
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.component.html
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.component.less b/apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.component.less
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.component.less
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.component.less
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.component.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.component.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.component.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.component.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.service.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.service.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cleaning/cleaning.service.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cleaning/cleaning.service.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.component.html b/apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.component.html
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.component.html
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.component.html
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.component.less b/apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.component.less
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.component.less
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.component.less
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.component.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.component.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.component.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.component.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.service.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.service.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Cost/cost.service.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/cost/cost.service.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.html b/apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.component.html
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.html
rename to apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.component.html
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.less b/apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.component.less
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.less
rename to apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.component.less
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.component.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.component.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.component.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.service.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.service.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Lighting/lighting.service.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/lighting/lighting.service.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.component.html b/apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.component.html
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.component.html
rename to apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.component.html
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.component.less b/apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.component.less
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.component.less
rename to apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.component.less
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.component.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.component.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.component.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.component.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.service.ts b/apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.service.ts
similarity index 100%
rename from apps/taiga-lumbermill/src/dashboards/iot/components/Safety/safety.service.ts
rename to apps/taiga-lumbermill/src/dashboards/iot/components/safety/safety.service.ts
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/iot.component.html b/apps/taiga-lumbermill/src/dashboards/iot/iot.component.html
index 1083337b3..1a8952cca 100644
--- a/apps/taiga-lumbermill/src/dashboards/iot/iot.component.html
+++ b/apps/taiga-lumbermill/src/dashboards/iot/iot.component.html
@@ -1,3 +1,18 @@
+<nav
+    tuiNavigationNav
+    [style.position]="'sticky'"
+>
+    <a routerLink="/dashboards">
+        <tui-icon icon="@tui.chevron-left" />
+        Back
+    </a>
+    /
+    <span tuiNavigationLogo>
+        <span tuiFade>IoT</span>
+    </span>
+    <hr />
+</nav>
+
 <div class="tiles">
     <lmb-small-card />
     <div class="top">
diff --git a/apps/taiga-lumbermill/src/dashboards/iot/iot.component.ts b/apps/taiga-lumbermill/src/dashboards/iot/iot.component.ts
index a315ed358..665622172 100644
--- a/apps/taiga-lumbermill/src/dashboards/iot/iot.component.ts
+++ b/apps/taiga-lumbermill/src/dashboards/iot/iot.component.ts
@@ -1,17 +1,18 @@
 import {CommonModule} from '@angular/common';
 import {ChangeDetectionStrategy, Component} from '@angular/core';
-import {TuiAppearance} from '@taiga-ui/core';
-import {TuiCardLarge} from '@taiga-ui/layout';
+import {RouterLink} from '@angular/router';
+import {TuiAppearance, TuiIcon} from '@taiga-ui/core';
+import {TuiCardLarge, TuiLogoComponent, TuiNavComponent} from '@taiga-ui/layout';
 
-import {CleaningComponent} from './components/Cleaning/cleaning.component';
+import {CleaningComponent} from './components/cleaning/cleaning.component';
 import {ClimateControlComponent} from './components/climate-control/climate-control.component';
 import {ContactsComponent} from './components/contacts/contacts.component';
 import {ControlPanelComponent} from './components/control-panel/control-panel.component';
-import {CostComponent} from './components/Cost/cost.component';
+import {CostComponent} from './components/cost/cost.component';
 import {ElectricityComponent} from './components/electricity/electricity.component';
-import {LightingComponent} from './components/Lighting/lighting.component';
+import {LightingComponent} from './components/lighting/lighting.component';
 import {MusicComponent} from './components/music/music.component';
-import {SafetyComponent} from './components/Safety/safety.component';
+import {SafetyComponent} from './components/safety/safety.component';
 import {WeatherComponent} from './components/weather/weather.component';
 
 @Component({
@@ -27,9 +28,13 @@ import {WeatherComponent} from './components/weather/weather.component';
         ElectricityComponent,
         LightingComponent,
         MusicComponent,
+        RouterLink,
         SafetyComponent,
         TuiAppearance,
         TuiCardLarge,
+        TuiIcon,
+        TuiLogoComponent,
+        TuiNavComponent,
         WeatherComponent,
     ],
     templateUrl: './iot.component.html',