feat(dashboard): "under development" message

This shows an "under development" message at project's main screen. This message can be changed at `global.projectUnderDevelopment` string at `dashboard/src/locales/messages/index.ts` file. Closes #265
kernelci · Sep 10, 2024 · 4ce5e29 · 4ce5e29
1 parent d614bcd
commit 4ce5e29
Show file tree

Hide file tree

Showing 2 changed files with 24 additions and 9 deletions.
diff --git a/dashboard/src/components/TreeListingPage/TreeListingPage.tsx b/dashboard/src/components/TreeListingPage/TreeListingPage.tsx
@@ -15,6 +15,8 @@ import TreeTable from '@/components/Table/TreeTable';
 import { useTreeTable } from '@/api/Tree';
 import { TableInfo } from '@/components/Table/TableInfo';
 
+import { formattedBreakLineValue } from '@/locales/messages';
+
 interface ITreeListingPage {
   inputFilter: string;
 }
@@ -100,15 +102,23 @@ const TreeListingPage = ({ inputFilter }: ITreeListingPage): JSX.Element => {
 
   return data && data.length > 0 ? (
     <div className="flex flex-col gap-6">
-      <div className="flex flex-col items-end gap-4">
-        <TableInfo
-          startIndex={startIndex + 1}
-          endIndex={endIndex}
-          totalTrees={listItems.length}
-          itemsPerPage={ITEMS_PER_PAGE}
-          onClickBack={onClickGoBack}
-          onClickForward={onClickGoForward}
-        />
+      <div className="flex items-center justify-between gap-4">
+        <span className="text-left text-sm text-dimGray">
+          <FormattedMessage
+            id="global.projectUnderDevelopment"
+            values={formattedBreakLineValue}
+          />
+        </span>
+        <div className="flex items-end gap-4">
+          <TableInfo
+            startIndex={startIndex + 1}
+            endIndex={endIndex}
+            totalTrees={listItems.length}
+            itemsPerPage={ITEMS_PER_PAGE}
+            onClickBack={onClickGoBack}
+            onClickForward={onClickGoForward}
+          />
+        </div>
       </div>
       <TreeTable treeTableRows={listItems.slice(startIndex, endIndex)} />
       <div className="flex flex-col items-end">

diff --git a/dashboard/src/locales/messages/index.ts b/dashboard/src/locales/messages/index.ts
@@ -1,5 +1,7 @@
 import React from 'react';
 
+import { FEEDBACK_EMAIL_TO } from '@/utils/constants/general';
+
 import { LOCALES } from '../constants';
 /*eslint sort-keys: "error"*/
 
@@ -114,6 +116,9 @@ export const messages = {
     'global.origins': 'Origins',
     'global.pass': 'Pass',
     'global.placeholderSearch': 'Search by tree, branch or tag',
+    'global.projectUnderDevelopment':
+      'This is an ongoing project.{br}' +
+      `Please report bugs and suggestions to ${FEEDBACK_EMAIL_TO}.`,
     'global.seconds': 'sec',
     'global.skipped': 'Skipped',
     'global.somethingWrong': 'Sorry... something went wrong',