From b4822fabcd4d83118e17e297fb35a9b1d81f6b6c Mon Sep 17 00:00:00 2001
From: vargburz <vargburz@corpglory.com>
Date: Tue, 31 Oct 2023 17:03:05 +0300
Subject: [PATCH 1/3] add root page

---
 src/components/DescriptionPanel.tsx | 32 ++++++++++++++---------------
 src/module.ts                       | 16 +++++++++------
 2 files changed, 25 insertions(+), 23 deletions(-)

diff --git a/src/components/DescriptionPanel.tsx b/src/components/DescriptionPanel.tsx
index f8eeab8..4d19fe5 100644
--- a/src/components/DescriptionPanel.tsx
+++ b/src/components/DescriptionPanel.tsx
@@ -1,8 +1,8 @@
 import { KentikAPI } from '../datasource/kentik_api';
 
-import { getBackendSrv } from '@grafana/runtime';
+import { getBackendSrv, locationService } from '@grafana/runtime';
 import { PanelProps, GrafanaTheme2 } from '@grafana/data';
-import { HorizontalGroup, VerticalGroup, useStyles2 } from '@grafana/ui';
+import { Button, useStyles2 } from '@grafana/ui';
 import React, { FC, useEffect, useState } from 'react';
 
 import { css } from '@emotion/css';
@@ -31,28 +31,20 @@ export const DescriptionPanel: FC<Props> = () => {
     });
   }
 
+  const handleTopTalkersClick = () => {
+    locationService.push('/d/NS58GIo71/kentik-top-talkers');
+  };
+
   return (
-    <div>
+    <div className={styles.container}>
       <img className={styles.image} src="public/plugins/kentik-connect-app/img/kentik_logo.png" />
-      <p>
+      <p className={styles.descriptionText}>
         Kentik Connect Pro for Grafana allows you to quickly and easily add network activity visibility metrics to your
         Grafana dashboard. By leveraging the power of Kentik’s monitoring SaaS, you can enjoy rich, actionable insights
         into consumers of network bandwidth and anomalies that can affect application or service performance.
       </p>
       <div className={styles.actionsContainer}>
-        <VerticalGroup>
-          <div>Complete:</div>
-          <HorizontalGroup>
-            <i className={styles.successIcon + ' icon-gf icon-gf-check'}></i>
-            <span className={styles.successLine}>Install Kentik Connect for Grafana.</span>
-          </HorizontalGroup>
-          {state.devices.length > 0 && (
-            <HorizontalGroup>
-              <i className={styles.successIcon + ' icon-gf icon-gf-check'}></i>
-              <span className={styles.successLine}>Add your first device.</span>
-            </HorizontalGroup>
-          )}
-        </VerticalGroup>
+        <Button variant={'primary'} fill={'text'} onClick={handleTopTalkersClick}>Kentik Top Talkers</Button>
       </div>
     </div>
   );
@@ -66,6 +58,9 @@ const getStyles = (theme: GrafanaTheme2) => ({
     width: 150px;
     margin-bottom: 10px;
   `,
+  container: css`
+    padding: 16px;
+  `,
   actionsContainer: css`
     margin-left: 16px;
   `,
@@ -79,4 +74,7 @@ const getStyles = (theme: GrafanaTheme2) => ({
   successLine: css`
     text-decoration: line-through;
   `,
+  descriptionText: css`
+    max-width: 600px;
+  `,
 });
diff --git a/src/module.ts b/src/module.ts
index 0e13e58..853e65e 100644
--- a/src/module.ts
+++ b/src/module.ts
@@ -1,3 +1,4 @@
+import { DescriptionPanel } from 'components/DescriptionPanel';
 import { AppConfig } from './components/AppConfig';
 
 import './styles/dark.scss';
@@ -11,9 +12,12 @@ loadPluginCss({
   light: 'plugins/kentik-connect-app/styles/light.css',
 });
 
-export const plugin = new AppPlugin<{}>().addConfigPage({
-  title: 'Configuration',
-  icon: 'cog',
-  body: AppConfig,
-  id: 'configuration',
-});
+export const plugin = new AppPlugin<{}>()
+  // @ts-ignore
+  .setRootPage(DescriptionPanel)
+  .addConfigPage({
+    title: 'Configuration',
+    icon: 'cog',
+    body: AppConfig,
+    id: 'configuration',
+  });

From f0b9eeb33ca39627e57bff8cb4ed99e9cf077f1c Mon Sep 17 00:00:00 2001
From: vargburz <vargburz@corpglory.com>
Date: Tue, 31 Oct 2023 17:13:27 +0300
Subject: [PATCH 2/3] fix linter

---
 src/components/DescriptionPanel.tsx | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/src/components/DescriptionPanel.tsx b/src/components/DescriptionPanel.tsx
index 4d19fe5..45139b4 100644
--- a/src/components/DescriptionPanel.tsx
+++ b/src/components/DescriptionPanel.tsx
@@ -44,7 +44,9 @@ export const DescriptionPanel: FC<Props> = () => {
         into consumers of network bandwidth and anomalies that can affect application or service performance.
       </p>
       <div className={styles.actionsContainer}>
-        <Button variant={'primary'} fill={'text'} onClick={handleTopTalkersClick}>Kentik Top Talkers</Button>
+        <Button variant={'primary'} fill={'text'} onClick={handleTopTalkersClick}>
+          Kentik Top Talkers
+        </Button>
       </div>
     </div>
   );

From 3a769f2d0618cf28f44ce3d11abb4cc236767712 Mon Sep 17 00:00:00 2001
From: rozetko <rozetko@corpglory.com>
Date: Thu, 2 Nov 2023 13:45:19 +0300
Subject: [PATCH 3/3] bump version to 1.7.1

---
 CHANGELOG.md | 6 ++++++
 package.json | 2 +-
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 8f88a30..70c74ed 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,12 @@
 
 All notable changes to this project will be documented in this file.
 
+## [1.7.1] - 2023-11-02
+
+#### Fixed
+
+- "No root app page component found" error [#82](https://github.com/kentik/kentik-grafana-app/pull/82)
+
 ## [1.7.0] - 2023-06-27
 
 **Please note, the release contains breaking changes.**
diff --git a/package.json b/package.json
index ab15399..ec18112 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "kentik-connect-app",
   "private": false,
-  "version": "1.7.0",
+  "version": "1.7.1",
   "description": "Kentik Connect for Grafana allows you to quickly and easily enhance your visibility into your network traffic.",
   "scripts": {
     "build": "grafana-toolkit plugin:build",