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

feat(branding): rebrand footer vendor to MesaStack, trim footer/topbar

Browse Source 
- Footer vendor label unified to "MesaStack" across all locales.
- Remove footer Help button; keep version as plain text (no click).
- Remove top-right GitHub star widget (delete unused github-star.tsx);
  keep version as plain text (no click), retain upgrade "New" badge.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
lofyer
2026-07-27 14:28:06 +08:00
co-authored by Claude Opus 4.8
parent 286f49897c
commit 81bcd6a5ac
8 changed files with 11 additions and 194 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/footer/index.tsx
+2 -25
View File
@@ -1,8 +1,6 @@
import { GPUStackVersionAtom } from '@/atoms/user';
import VersionInfo, { modalConfig } from '@/components/version-info';
import externalLinks from '@/constants/external-links';
import { useIntl } from '@umijs/max';
import { Button, Divider, Modal, Typography } from 'antd';
import { Divider, Typography } from 'antd';
import { createStyles } from 'antd-style';
import { useAtomValue } from 'jotai';
import styled from 'styled-components';
@@ -33,21 +31,11 @@ const useStyles = createStyles(({ token, css }) => ({
const Footer: React.FC = () => {
const intl = useIntl();
const [modal, contextHolder] = Modal.useModal();
const { styles } = useStyles();
const version = useAtomValue(GPUStackVersionAtom);
const showVersion = () => {
modal.info({
...modalConfig,
width: 460,
content: <VersionInfo intl={intl} />
});
};
return (
<>
{contextHolder}
<div className={styles.footer}>
<div className="footer-content">
<div className="footer-content-left">
@@ -64,18 +52,7 @@ const Footer: React.FC = () => {
</Typography.Link>
</CompanyWrapper>
<Divider orientation="vertical" />
<Button
type="link"
size="small"
href={externalLinks.documentation}
target="_blank"
>
{intl.formatMessage({ id: 'common.button.help' })}
</Button>
<Divider orientation="vertical" />
<Button type="link" size="small" onClick={showVersion}>
{version?.version}
</Button>
<span>{version?.version}</span>
</div>
</div>
</div>
src/layouts/extraRender.tsx
+4 -24
View File
@@ -1,8 +1,6 @@
import { GPUStackVersionAtom, UpdateCheckAtom } from '@/atoms/user';
import PluginExtraField from '@/components/plugin-extra-fields';
import VersionInfo, { modalConfig } from '@/components/version-info';
import externalLinks from '@/constants/external-links';
import useBodyScroll from '@/hooks/use-body-scroll';
import { logout } from '@/pages/login/apis';
import { getGPUStackPlugin } from '@/plugins';
import { useModel } from '@@/plugin-model';
@@ -14,12 +12,11 @@ import {
} from '@ant-design/icons';
import { DropdownActions, IconFont } from '@gpustack/core-ui';
import { history, useIntl, useNavigate } from '@umijs/max';
import { Avatar, Button, Divider, Modal } from 'antd';
import { Avatar, Divider } from 'antd';
import { useAtom } from 'jotai';
import { useMemo } from 'react';
import styled from 'styled-components';
import { DEFAULT_ENTER_PAGE } from '../config/settings';
import GithubStar from './github-star';
const NewLabel = styled.span`
position: relative;
@@ -100,11 +97,9 @@ const CustomItem = styled.div`
export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
const { isDarkTheme } = props;
const plugin = getGPUStackPlugin();
const { saveScrollHeight, restoreScrollHeight } = useBodyScroll();
const [modal, contextHolder] = Modal.useModal();
const intl = useIntl();
const [version] = useAtom(GPUStackVersionAtom);
const [updateCheck] = useAtom(UpdateCheckAtom);
const intl = useIntl();
const initialInfo = useModel('@@initialState') || {
initialState: undefined,
loading: false,
@@ -142,16 +137,6 @@ export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
return {};
}, [isDarkTheme]);
const showVersion = () => {
saveScrollHeight();
modal.info({
...modalConfig,
width: 460,
content: <VersionInfo intl={intl} />,
onCancel: restoreScrollHeight
});
};
const handleLogout = async () => {
await logout();
navigate(loginPath);
@@ -261,25 +246,20 @@ export const ExtraContent = (props: { isDarkTheme?: boolean }) => {
return (
<Wrapper>
{contextHolder}
<PluginExtraField name="OrgSwitcher" isDarkTheme={isDarkTheme} />
{process.env.ENABLE_ENTERPRISE !== 'true' && <GithubStar />}
<div
style={{
display: 'flex',
alignItems: 'center'
}}
>
<Button
type="text"
size="small"
onClick={showVersion}
<span
style={{
color: 'var(--ant-color-text-tertiary)'
}}
>
{version.version}
</Button>
</span>
{showUpgrade && (
<NewLabel>
<span className="text">
src/layouts/github-star.tsx
-140
View File
@@ -1,140 +0,0 @@
import externalLinks from '@/constants/external-links';
import { GithubFilled } from '@ant-design/icons';
import { useIntl } from '@umijs/max';
import { Tooltip } from 'antd';
import { useEffect, useState } from 'react';
import styled from 'styled-components';
const REPO = 'gpustack/gpustack';
const CACHE_KEY = 'gpustack:github-stars';
const CACHE_TTL = 24 * 60 * 60 * 1000;
const FETCH_TIMEOUT = 4000;
const StarLink = styled.a`
display: inline-flex;
align-items: stretch;
height: 24px;
border-radius: var(--ant-border-radius);
border: 1px solid var(--ant-color-border-secondary);
background-color: var(--ant-color-bg-container);
color: var(--ant-color-text-secondary);
font-size: 12px;
line-height: 1;
overflow: hidden;
transition:
border-color 0.2s,
color 0.2s;
&:hover {
border-color: var(--ant-color-border);
color: var(--ant-color-text);
}
.seg {
display: inline-flex;
align-items: center;
gap: 6px;
padding: 0 8px;
}
.seg + .seg {
border-left: 1px solid var(--ant-color-border-secondary);
background-color: var(--ant-color-fill-quaternary);
}
.anticon {
font-size: 13px;
}
.count {
font-weight: 500;
font-variant-numeric: tabular-nums;
min-width: 1.5em;
text-align: center;
}
`;
const formatCount = (n: number): string => {
if (n >= 1000) {
const k = n / 1000;
return k >= 10 ? `${Math.round(k)}k` : `${k.toFixed(1)}k`;
}
return String(n);
};
type CacheEntry = { value: number; time: number };
const readCache = (): CacheEntry | null => {
try {
const raw = localStorage.getItem(CACHE_KEY);
if (!raw) return null;
const parsed = JSON.parse(raw);
if (typeof parsed?.value !== 'number' || typeof parsed?.time !== 'number') {
return null;
}
return parsed;
} catch {
return null;
}
};
const writeCache = (value: number) => {
try {
localStorage.setItem(
CACHE_KEY,
JSON.stringify({ value, time: Date.now() })
);
} catch {
// ignore quota errors
}
};
const GithubStar = () => {
const intl = useIntl();
const [count, setCount] = useState<number | null>(
() => readCache()?.value ?? null
);
useEffect(() => {
const cached = readCache();
const fresh = cached && Date.now() - cached.time < CACHE_TTL;
if (fresh) return;
const controller = new AbortController();
const timer = setTimeout(() => controller.abort(), FETCH_TIMEOUT);
fetch(`https://api.github.com/repos/${REPO}`, { signal: controller.signal })
.then((r) => (r.ok ? r.json() : null))
.then((data) => {
if (!data || typeof data.stargazers_count !== 'number') return;
setCount(data.stargazers_count);
writeCache(data.stargazers_count);
})
.catch(() => {
// offline, blocked, rate-limited — stay hidden if no cache
})
.finally(() => clearTimeout(timer));
return () => {
clearTimeout(timer);
controller.abort();
};
}, []);
return (
<Tooltip title={intl.formatMessage({ id: 'common.github.star.tooltip' })}>
<StarLink href={externalLinks.github} target="_blank" rel="noreferrer">
<span className="seg">
<GithubFilled />
</span>
<span className="seg">
<span className="count">
{count != null ? formatCount(count) : 'Star'}
</span>
</span>
</StarLink>
</Tooltip>
);
};
export default GithubStar;
src/locales/en-US/common.ts
+1 -1
View File
@@ -214,7 +214,7 @@ export default {
'common.form.password': 'Password',
'common.form.username': 'Username',
'common.login.rember': 'Remember me',
'settings.company': 'MesaStack.ai',
'settings.company': 'MesaStack',
'common.button.help': 'Help',
'common.button.feedback': 'Feedback',
'common.button.docs': 'Documentation',
src/locales/ja-JP/common.ts
+1 -1
View File
@@ -213,7 +213,7 @@ export default {
'common.form.password': 'パスワード',
'common.form.username': 'ユーザー名',
'common.login.rember': 'ログイン状態を保持',
'settings.company': 'MesaStack.ai',
'settings.company': 'MesaStack',
'common.button.help': 'ヘルプ',
'common.button.feedback': 'フィードバック',
'common.button.docs': 'ドキュメント',
src/locales/ru-RU/common.ts
+1 -1
View File
@@ -211,7 +211,7 @@ export default {
'common.form.password': 'Пароль',
'common.form.username': 'Имя пользователя',
'common.login.rember': 'Запомнить меня',
'settings.company': 'MesaStack.ai',
'settings.company': 'MesaStack',
'common.button.help': 'Помощь',
'common.button.feedback': 'Обратная связь',
'common.button.docs': 'Документация',
src/locales/tr-TR/common.ts
+1 -1
View File
@@ -216,7 +216,7 @@ export default {
'common.form.password': 'Şifre',
'common.form.username': 'Kullanıcı adı',
'common.login.rember': 'Beni hatırla',
'settings.company': 'MesaStack.ai',
'settings.company': 'MesaStack',
'common.button.help': 'Yardım',
'common.button.feedback': 'Geri Bildirim',
'common.button.docs': 'Dokümantasyon',
src/locales/zh-CN/common.ts
+1 -1
View File
@@ -204,7 +204,7 @@ export default {
'common.form.password': '密码',
'common.form.username': '用户名',
'common.login.rember': '记住我',
'settings.company': '数澈软件',
'settings.company': 'MesaStack',
'common.button.help': '帮助',
'common.button.feedback': '反馈',
'common.button.docs': '文档',