@@ -70,71 +86,90 @@ const FilterButton = (): JSX.Element => {
);
};
-const TreeListingPage = ({inputFilter}: ITreeListingPage): JSX.Element => {
-
+const TreeListingPage = ({ inputFilter }: ITreeListingPage): JSX.Element => {
const { data } = useTreeTable();
const listItems: TreeTableBody[] = useMemo(() => {
- if(!data) {
- return [];
- } else {
- return((data as Tree[])
- .filter(tree => tree.tree_name?.includes(inputFilter)
- || tree.git_commit_hash?.includes(inputFilter)
- || tree.git_commit_name?.includes(inputFilter)
- || tree.git_repository_branch?.includes(inputFilter))
- .map(tree => {
- const fullHash = tree.git_commit_hash ?? '';
- const commitHash = fullHash.substring(0, NUMBER_CHAR_HASH) + (fullHash.length > NUMBER_CHAR_HASH ? '...' : '');
- const tagCommit = tree.git_commit_name ? `${tree.git_commit_name} - ${commitHash}` : commitHash;
-
- return ({
- name: tree.tree_name ?? '',
- branch: tree.git_repository_branch ?? '',
- commit: tagCommit,
- buildStatus: `${tree.build_status.invalid} / ${tree.build_status.invalid + tree.build_status.valid}`,
- testStatus: `${tree.test_status.fail} / ${tree.test_status.total}`,
- })
- })
- .sort((a, b) => a.name.localeCompare(b.name, undefined, {numeric: true})
- || a.branch.localeCompare(b.branch, undefined, {numeric: true})));
- }
+ if (!data) {
+ return [];
+ } else {
+ return (data as Tree[])
+ .filter(
+ tree =>
+ tree.tree_name?.includes(inputFilter) ||
+ tree.git_commit_hash?.includes(inputFilter) ||
+ tree.git_commit_name?.includes(inputFilter) ||
+ tree.git_repository_branch?.includes(inputFilter),
+ )
+ .map(tree => {
+ const fullHash = tree.git_commit_hash ?? '';
+ const commitHash =
+ fullHash.substring(0, NUMBER_CHAR_HASH) +
+ (fullHash.length > NUMBER_CHAR_HASH ? '...' : '');
+ const tagCommit = tree.git_commit_name
+ ? `${tree.git_commit_name} - ${commitHash}`
+ : commitHash;
+
+ return {
+ name: tree.tree_name ?? '',
+ branch: tree.git_repository_branch ?? '',
+ commit: tagCommit,
+ buildStatus: `${tree.build_status.invalid} / ${tree.build_status.invalid + tree.build_status.valid}`,
+ testStatus: `${tree.test_status.fail} / ${tree.test_status.total}`,
+ };
+ })
+ .sort(
+ (a, b) =>
+ a.name.localeCompare(b.name, undefined, { numeric: true }) ||
+ a.branch.localeCompare(b.branch, undefined, { numeric: true }),
+ );
+ }
}, [data, inputFilter]);
-
+
const [startIndex, setStartIndex] = useState(0);
const [endIndex, setEndIndex] = useState(0);
useEffect(() => {
- setEndIndex(listItems.length > ITEMS_PER_PAGE ? ITEMS_PER_PAGE : listItems.length);
+ setEndIndex(
+ listItems.length > ITEMS_PER_PAGE ? ITEMS_PER_PAGE : listItems.length,
+ );
}, [listItems]);
const onClickGoForward = useCallback(() => {
setStartIndex(endIndex);
- setEndIndex(endIndex+ITEMS_PER_PAGE >= listItems.length ? listItems.length : endIndex+ITEMS_PER_PAGE)
+ setEndIndex(
+ endIndex + ITEMS_PER_PAGE >= listItems.length
+ ? listItems.length
+ : endIndex + ITEMS_PER_PAGE,
+ );
}, [endIndex, listItems]);
const onClickGoBack = useCallback(() => {
- setStartIndex(startIndex-ITEMS_PER_PAGE);
- setEndIndex(endIndex % ITEMS_PER_PAGE !== 0 ? endIndex - endIndex % ITEMS_PER_PAGE : endIndex - ITEMS_PER_PAGE);
+ setStartIndex(startIndex - ITEMS_PER_PAGE);
+ setEndIndex(
+ endIndex % ITEMS_PER_PAGE !== 0
+ ? endIndex - (endIndex % ITEMS_PER_PAGE)
+ : endIndex - ITEMS_PER_PAGE,
+ );
}, [startIndex, endIndex]);
return (
-
+
{
const [debouncedValue, setDebouncedValue] = useState(input);
useEffect(() => {
const handler = setTimeout(() => {
- setDebouncedValue(input);
- }, delay);
+ setDebouncedValue(input);
+ }, delay);
return (): void => {
clearTimeout(handler);
};
diff --git a/dashboard/src/lib/utils.ts b/dashboard/src/lib/utils.ts
index a70ebb6..edac9f2 100644
--- a/dashboard/src/lib/utils.ts
+++ b/dashboard/src/lib/utils.ts
@@ -1,5 +1,5 @@
-import { type ClassValue, clsx } from "clsx";
-import { twMerge } from "tailwind-merge";
+import { type ClassValue, clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
export function cn(...inputs: ClassValue[]): string {
return twMerge(clsx(inputs));
diff --git a/dashboard/src/locales/constants.ts b/dashboard/src/locales/constants.ts
index 37633c6..df06169 100644
--- a/dashboard/src/locales/constants.ts
+++ b/dashboard/src/locales/constants.ts
@@ -1,4 +1,3 @@
export const LOCALES = {
- EN_US: 'en-us',
- };
-
\ No newline at end of file
+ EN_US: 'en-us',
+};
diff --git a/dashboard/src/locales/messages/index.ts b/dashboard/src/locales/messages/index.ts
index 2ce9f2a..396687f 100644
--- a/dashboard/src/locales/messages/index.ts
+++ b/dashboard/src/locales/messages/index.ts
@@ -1,27 +1,27 @@
-import {LOCALES} from '../constants'
+import { LOCALES } from '../constants';
export const messages = {
[LOCALES.EN_US]: {
global: {
- filters: "Filters",
+ filters: 'Filters',
},
routes: {
- deviceMonitor: "Devices",
- labsMonitor: "Labs",
- treeMonitor: "Trees",
+ deviceMonitor: 'Devices',
+ labsMonitor: 'Labs',
+ treeMonitor: 'Trees',
},
table: {
- itemsPerPage: "Items per page:",
- of: "of",
- showing: "Showing:",
- tree: "Tree",
+ itemsPerPage: 'Items per page:',
+ of: 'of',
+ showing: 'Showing:',
+ tree: 'Tree',
},
treeTable: {
- branch: "Branch",
- build: "Build Status (Failed / Total)",
- commit: "Tag - Commit",
- test: "Test Status (Failed / Total)",
- tree: "Tree",
+ branch: 'Branch',
+ build: 'Build Status (Failed / Total)',
+ commit: 'Tag - Commit',
+ test: 'Test Status (Failed / Total)',
+ tree: 'Tree',
},
},
};
diff --git a/dashboard/src/main.tsx b/dashboard/src/main.tsx
index 1756a3e..66a3761 100644
--- a/dashboard/src/main.tsx
+++ b/dashboard/src/main.tsx
@@ -1,23 +1,20 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
+import React from 'react';
+import ReactDOM from 'react-dom/client';
-import {IntlProvider} from "react-intl";
+import { IntlProvider } from 'react-intl';
-import {flatten} from 'flat';
+import { flatten } from 'flat';
-import {messages} from './locales/messages/index'
-import {LOCALES} from './locales/constants'
+import { messages } from './locales/messages/index';
+import { LOCALES } from './locales/constants';
-
-
-import './index.css'
-import App from './App'
+import './index.css';
+import App from './App';
ReactDOM.createRoot(document.getElementById('root')!).render(
-
+
-
,
-)
+);
diff --git a/dashboard/src/types/tree/Tree.tsx b/dashboard/src/types/tree/Tree.tsx
index 43a0e30..73f40ed 100644
--- a/dashboard/src/types/tree/Tree.tsx
+++ b/dashboard/src/types/tree/Tree.tsx
@@ -1,30 +1,30 @@
export type TreeTableBody = {
- name: string;
- branch: string;
- commit: string;
- buildStatus: string;
- testStatus: string;
-}
+ name: string;
+ branch: string;
+ commit: string;
+ buildStatus: string;
+ testStatus: string;
+};
export type Tree = {
- tree_name: string | null;
- git_commit_hash: string | null;
- git_commit_name: string | null;
- git_repository_branch: string | null;
- build_status: {
- valid: number;
- invalid: number;
- null: number;
- total: number;
- };
- test_status: {
- fail: number;
- error: number;
- miss: number;
- pass: number;
- done: number;
- skip: number;
- null: number;
- total: number;
- };
-}
+ tree_name: string | null;
+ git_commit_hash: string | null;
+ git_commit_name: string | null;
+ git_repository_branch: string | null;
+ build_status: {
+ valid: number;
+ invalid: number;
+ null: number;
+ total: number;
+ };
+ test_status: {
+ fail: number;
+ error: number;
+ miss: number;
+ pass: number;
+ done: number;
+ skip: number;
+ null: number;
+ total: number;
+ };
+};
+