Added Info page

package.json

@@ -16,8 +16,9 @@
   "keywords": [
     "react",
     "rsuite",
-    "admin",
-    "template"
+    "stats",
+    "calculator",
+    "chart"
   ],
   "files": [
     "CHANGELOG.md",

src/App.tsx

@@ -5,10 +5,11 @@ import { CustomProvider } from 'rsuite';
 import enUS from 'rsuite/locales/en_GB';
 import locales from './locales';
 import Frame from './components/Frame';
-import HistogramPage from './pages';
+import HistogramPage from './pages/histogram';
 import Error404Page from './pages/authentication/404';
 import Error500Page from './pages/authentication/500';
 import { appNavs } from './config';
+import Info from './pages/info';
 
 const App = () => {
   return (
@@ -18,6 +19,7 @@ const App = () => {
           <Route path="/" element={<Frame navs={appNavs} />}>
             <Route index element={<HistogramPage />} />
             <Route path="histogram" element={<HistogramPage />} />
+            <Route path="info" element={<Info />} />
             <Route path="error-404" element={<Error404Page />} />
             <Route path="error-500" element={<Error500Page />} />
           </Route>

src/config.tsx

@@ -1,12 +1,18 @@
 import React from 'react';
 import { Icon } from '@rsuite/icons';
-import { MdBarChart } from 'react-icons/md';
+import { MdBarChart, MdInfoOutline } from 'react-icons/md';
 
 export const appNavs = [
   {
     eventKey: 'histogram',
     icon: <Icon as={MdBarChart} />,
     title: 'Histogram',
     to: '/histogram'
+  },
+  {
+    eventKey: 'info',
+    icon: <Icon as={MdInfoOutline} />,
+    title: 'Info',
+    to: '/info'
   }
 ];

src/pages/index.tsx → src/pages/histogram/index.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Panel } from 'rsuite';
-import HistogramDashboard from './histogram/HistogramDashboard';
+import HistogramDashboard from './HistogramDashboard';
 import Copyright from '@/components/Copyright';
 
 const Page = () => {

src/pages/info/Info.tsx

@@ -0,0 +1,63 @@
+import React from 'react';
+import { Icon } from '@rsuite/icons';
+import { RxExternalLink } from 'react-icons/rx';
+
+const Info = () => {
+  return (
+    <>
+      <section>
+        <h6>Reference</h6>
+        <ol>
+          <li>
+            Bob Donnelly Jr., PhD and Fatma Abdel-Raouf, PhD.{' '}
+            <i>Statistics, 3E (Idiot&apos;s Guides)</i>. 3rd ed. Alpha, 2016{' '}
+            <a
+              href="https://www.dk.com/ca/book/9781465451668-statistics-3e/"
+              target="_blank"
+              rel="noreferrer"
+            >
+              <Icon as={RxExternalLink} />
+            </a>
+          </li>
+        </ol>
+      </section>
+      <section>
+        <h6>Stack</h6>
+        <ol>
+          <li>
+            React{' '}
+            <a href="https://github.com/facebook/react" target="_blank" rel="noreferrer">
+              <Icon as={RxExternalLink} />
+            </a>
+          </li>
+          <li>
+            React Suite{' '}
+            <a href="https://github.com/rsuite/rsuite" target="_blank" rel="noreferrer">
+              <Icon as={RxExternalLink} />
+            </a>
+          </li>
+          <li>
+            React Icons{' '}
+            <a href="https://github.com/react-icons/react-icons" target="_blank" rel="noreferrer">
+              <Icon as={RxExternalLink} />
+            </a>
+          </li>
+          <li>
+            ApexCharts{' '}
+            <a href="https://github.com/apexcharts/apexcharts.js" target="_blank" rel="noreferrer">
+              <Icon as={RxExternalLink} />
+            </a>
+          </li>
+          <li>
+            react-csv{' '}
+            <a href="https://github.com/react-csv/react-csv" target="_blank" rel="noreferrer">
+              <Icon as={RxExternalLink} />
+            </a>
+          </li>
+        </ol>
+      </section>
+    </>
+  );
+};
+
+export default Info;

src/pages/info/index.tsx

@@ -0,0 +1,15 @@
+import React from 'react';
+import { Panel } from 'rsuite';
+import Info from './Info';
+import Copyright from '@/components/Copyright';
+
+const Page = () => {
+  return (
+    <Panel header={<h3 className="title">Info</h3>}>
+      <Info />
+      <Copyright />
+    </Panel>
+  );
+};
+
+export default Page;