root/gpustack-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

style: button for empty

Browse Source
This commit is contained in:
jialin
2025-11-27 15:53:23 +08:00
parent 962df859f1
commit d1c1132e6e
9 changed files with 64 additions and 55 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/pages/_components/no-result.tsx
+22 -3
View File
@@ -1,4 +1,4 @@
import { Empty, EmptyProps, Typography } from 'antd';
import { Button, Empty, EmptyProps, Typography } from 'antd';
import _ from 'lodash';
import React, { useMemo } from 'react';
import styled from 'styled-components';
@@ -54,9 +54,19 @@ const NoResult: React.FC<
loading?: boolean;
loadend?: boolean;
dataSource?: any[];
buttonText?: React.ReactNode;
onClick?: () => void;
}
> = (props) => {
const { filters, noFoundText, loadend, loading, dataSource } = props;
const {
filters,
noFoundText,
loadend,
loading,
dataSource,
buttonText,
onClick
} = props;
const hasFilters = useMemo(() => {
const filterValues = _.omit(filters, ['page', 'perPage']);
@@ -70,6 +80,15 @@ const NoResult: React.FC<
});
}, [filters]);
const renderChildren = () => {
if (!buttonText || !onClick) return null;
return (
<Button color="primary" variant="filled" onClick={onClick}>
{buttonText}
</Button>
);
};
return (
<>
{!loading && loadend && !dataSource?.length ? (
@@ -96,7 +115,7 @@ const NoResult: React.FC<
</Description>
}
>
{!hasFilters && props.children}
{!hasFilters && renderChildren()}
</StyledEmpty>
) : (
<span></span>
src/pages/api-keys/index.tsx
+4 -6
View File
@@ -6,7 +6,7 @@ import type { PageActionType } from '@/config/types';
import useTableFetch from '@/hooks/use-table-fetch';
import { useIntl } from '@umijs/max';
import useMemoizedFn from 'ahooks/lib/useMemoizedFn';
import { Button, ConfigProvider, Table } from 'antd';
import { ConfigProvider, Table } from 'antd';
import { useState } from 'react';
import NoResult from '../_components/no-result';
import PageBox from '../_components/page-box';
@@ -111,11 +111,9 @@ const APIKeys: React.FC = () => {
})}
title={intl.formatMessage({ id: 'noresult.keys.title' })}
subTitle={intl.formatMessage({ id: 'noresult.keys.subTitle' })}
>
<Button type="primary" onClick={handleAddKey}>
{intl.formatMessage({ id: 'noresult.button.add' })}
</Button>
</NoResult>
onClick={handleAddKey}
buttonText={intl.formatMessage({ id: 'noresult.button.add' })}
></NoResult>
);
};
src/pages/backends/config/index.ts
+14 -3
View File
@@ -3,7 +3,6 @@ import SGLangLogo from '@/assets/logo/sglang.png';
import vLLMLogo from '@/assets/logo/vllm.png';
import VoxBoxLogo from '@/assets/logo/voxbox.png';
import icons from '@/components/icon-font/icons';
import { GPUSTACK_API_BASE_URL } from '@/config/settings';
import { backendOptionsMap } from '@/pages/llmodels/config/backend-parameters';
import {
GPUDriverMap,
@@ -191,11 +190,23 @@ export const frameworks = [
}
];
export const yamlTemplate = `# backend configuration template
export const yamlTemplate = `# ----------------------------------------
# custom backend configuration template
# ----------------------------------------
# backend_name:
# - required
# - must be endwith '-custom'
# version_configs:
# - image_name: required
# - run_command: required
# - custom_framework:
# - optional
# - choose from: ${Object.values(GPUDriverMap).join(', ')}, CPU
backend_name: vllm-custom
description: this is my custom vllm backend
default_version: v0.11.0
health_check_path: /${GPUSTACK_API_BASE_URL}/models
health_check_path: /v1/models
default_backend_param:
- --host
default_run_command: vllm serve {{model_path}} --port {{port}} --host {{worker_ip}} --served-model-name {{model_name}}
src/pages/backends/index.tsx
+3 -6
View File
@@ -5,7 +5,6 @@ import { PageActionType } from '@/config/types';
import useTableFetch from '@/hooks/use-table-fetch';
import { useIntl } from '@umijs/max';
import useMemoizedFn from 'ahooks/lib/useMemoizedFn';
import { Button } from 'antd';
import _ from 'lodash';
import { useState } from 'react';
import { ScrollerContext } from '../_components/infinite-scroller/use-scroller-context';
@@ -209,11 +208,9 @@ const BackendList = () => {
})}
title={intl.formatMessage({ id: 'noresult.backend.title' })}
subTitle={intl.formatMessage({ id: 'noresult.backend.subTitle' })}
>
<Button type="primary" onClick={handleAddBackend}>
{intl.formatMessage({ id: 'noresult.button.add' })}
</Button>
</NoResult>
onClick={handleAddBackend}
buttonText={intl.formatMessage({ id: 'noresult.button.add' })}
></NoResult>
</ScrollerContext.Provider>
<AddModal
action={openModalStatus.action}
src/pages/cluster-management/clusters.tsx
+5 -7
View File
@@ -11,7 +11,7 @@ import useTableFetch from '@/hooks/use-table-fetch';
import useWatchList from '@/hooks/use-watch-list';
import { useIntl, useNavigate } from '@umijs/max';
import { useMemoizedFn } from 'ahooks';
import { Button, message } from 'antd';
import { message } from 'antd';
import { useAtom } from 'jotai';
import { useEffect, useState } from 'react';
import NoResult from '../_components/no-result';
@@ -121,7 +121,7 @@ const Clusters: React.FC = () => {
});
};
const handleClickDropdown = (item: any) => {
const handleClickDropdown = () => {
navigate(`/cluster-management/clusters/create?action=${PageAction.CREATE}`);
};
@@ -331,11 +331,9 @@ const Clusters: React.FC = () => {
subTitle={intl.formatMessage({
id: 'noresult.cluster.subTitle'
})}
>
<Button type="primary" onClick={handleClickDropdown}>
{intl.formatMessage({ id: 'noresult.button.add' })}
</Button>
</NoResult>
onClick={handleClickDropdown}
buttonText={intl.formatMessage({ id: 'noresult.button.add' })}
></NoResult>
}
pagination={{
showSizeChanger: true,
src/pages/cluster-management/credentials.tsx
+4 -9
View File
@@ -7,7 +7,7 @@ import type { PageActionType } from '@/config/types';
import useTableFetch from '@/hooks/use-table-fetch';
import { useIntl, useNavigate } from '@umijs/max';
import { useMemoizedFn } from 'ahooks';
import { Button, ConfigProvider, Table, message } from 'antd';
import { ConfigProvider, Table, message } from 'antd';
import { useAtom } from 'jotai';
import { useState } from 'react';
import NoResult from '../_components/no-result';
@@ -164,14 +164,9 @@ const Credentials: React.FC = () => {
subTitle={intl.formatMessage({
id: 'noresult.credentials.subTitle'
})}
>
<Button
type="primary"
onClick={() => handleAddCredential(addActions[0])}
>
{intl.formatMessage({ id: 'noresult.button.add' })}
</Button>
</NoResult>
onClick={() => handleAddCredential(addActions[0])}
buttonText={intl.formatMessage({ id: 'noresult.button.add' })}
></NoResult>
);
};
src/pages/llmodels/components/table-list.tsx
+5 -9
View File
@@ -717,15 +717,11 @@ const Models: React.FC<ModelsProps> = ({
subTitle={intl.formatMessage({
id: 'noresult.deployments.subTitle'
})}
>
<Button
type="primary"
iconPosition="end"
onClick={() => handleClickDropdown({ key: 'catalog' })}
>
{intl?.formatMessage?.({ id: 'models.table.button.deploy' })}
</Button>
</NoResult>
onClick={() => handleClickDropdown({ key: 'catalog' })}
buttonText={intl?.formatMessage?.({
id: 'models.table.button.deploy'
})}
></NoResult>
}
pagination={{
showSizeChanger: true,
src/pages/llmodels/hooks/use-no-resource-result.tsx
+3 -6
View File
@@ -4,7 +4,6 @@ import { PageAction } from '@/config';
import NoResult from '@/pages/_components/no-result';
import { useIntl, useNavigate } from '@umijs/max';
import { useMemoizedFn } from 'ahooks';
import { Button } from 'antd';
import { useAtom } from 'jotai';
import React, { useMemo } from 'react';
@@ -99,11 +98,9 @@ const useNoResourceResult = (props: {
noFoundText={statusContent.noFoundText}
title={title}
subTitle={statusContent.subTitle}
>
<Button type="primary" iconPosition="end" onClick={statusContent.onClick}>
{statusContent.buttonText}
</Button>
</NoResult>
onClick={statusContent.onClick}
buttonText={statusContent.buttonText}
></NoResult>
);
return {
noResourceResult
src/pages/users/index.tsx
+4 -6
View File
@@ -6,7 +6,7 @@ import type { PageActionType } from '@/config/types';
import useTableFetch from '@/hooks/use-table-fetch';
import { useIntl, useModel } from '@umijs/max';
import { useMemoizedFn } from 'ahooks';
import { Button, ConfigProvider, message, Table } from 'antd';
import { ConfigProvider, message, Table } from 'antd';
import { useMemo, useState } from 'react';
import NoResult from '../_components/no-result';
import PageBox from '../_components/page-box';
@@ -150,11 +150,9 @@ const Users: React.FC = () => {
})}
title={intl.formatMessage({ id: 'noresult.users.title' })}
subTitle={intl.formatMessage({ id: 'noresult.users.subTitle' })}
>
<Button type="primary" onClick={handleAddUser}>
{intl.formatMessage({ id: 'noresult.button.add' })}
</Button>
</NoResult>
onClick={handleAddUser}
buttonText={intl.formatMessage({ id: 'noresult.button.add' })}
></NoResult>
);
};